var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
import React, { useState } from "react";
import { Row, Column, Input, Button } from "@nimles/react-web-components";
import { useSelector } from "react-redux";
import { updateCartItem, useAppDispatch, } from "@nimles/react-redux";
export const AddToCart = ({ product }) => {
    const dispatch = useAppDispatch();
    const cart = useSelector(({ carts }) => carts.selected);
    const item = cart &&
        cart.items &&
        cart.items.find((i) => i.productId === product.id);
    const [quantity, setQuantity] = useState(item ? item.quantity : 1);
    const [updating, setUpdating] = useState(false);
    return (<form onSubmit={(e) => __awaiter(void 0, void 0, void 0, function* () {
            e.preventDefault();
            setUpdating(true);
            yield dispatch(updateCartItem(cart.id, {
                productId: product.id,
                quantity: (item ? item.quantity : 0) + quantity,
            }));
            setUpdating(false);
        })}>
      <Row wrap>
        <Column xs={100} sm={50}>
          <Input align="right" type="number" value={quantity} onChange={({ target }) => setQuantity(+target.value)}/>
        </Column>
        <Column xs={100} sm={50}>
          <Button raised primary type="submit">
            {updating ? "Adding..." : "Add to cart"}
          </Button>
        </Column>
      </Row>
    </form>);
};
//# sourceMappingURL=AddToCart.jsx.map