diff --git a/src/stock-items/add-stock-item/packaging-units/packaging-units.component.tsx b/src/stock-items/add-stock-item/packaging-units/packaging-units.component.tsx index 6b835198..0f060750 100644 --- a/src/stock-items/add-stock-item/packaging-units/packaging-units.component.tsx +++ b/src/stock-items/add-stock-item/packaging-units/packaging-units.component.tsx @@ -15,10 +15,12 @@ import { import PackagingUnitsConceptSelector from "../packaging-units-concept-selector/packaging-units-concept-selector.component"; import ControlledNumberInput from "../../../core/components/carbon/controlled-number-input/controlled-number-input.component"; import { Save, TrashCan } from "@carbon/react/icons"; -import { useForm } from "react-hook-form"; +import { FormProvider, useForm, useFormContext } from "react-hook-form"; import { zodResolver } from "@hookform/resolvers/zod"; import { PackageUnitFormData, packageUnitSchema } from "./validationSchema"; import { StockItemPackagingUOMDTO } from "../../../core/api/types/stockItem/StockItemPackagingUOM"; +import { createStockItemPackagingUnit } from "../../stock-items.resource"; +import { showSnackbar } from "@openmrs/esm-framework"; interface PackagingUnitsProps { onSubmit?: () => void; @@ -28,11 +30,41 @@ interface PackagingUnitsProps { const PackagingUnits: React.FC = ({ stockItemUuid }) => { const { items, isLoading, tableHeaders, setStockItemUuid } = useStockItemPackageUnitsHook(); - useEffect(() => { setStockItemUuid(stockItemUuid); }, [stockItemUuid, setStockItemUuid]); + const packageUnitForm = useForm({ + defaultValues: {}, + mode: "all", + resolver: zodResolver(packageUnitSchema), + }); + + const handleSavePackageUnits = () => { + const { getValues } = packageUnitForm; + const { factor, packagingUomName, packagingUomUuid } = getValues(); + const payload: StockItemPackagingUOMDTO = { + factor: factor, + packagingUomUuid, + stockItemUuid, + }; + createStockItemPackagingUnit(payload).then( + (resp) => + showSnackbar({ + title: "Package Unit", + subtitle: "Package Unit saved successfully", + kind: "success", + }), + (error) => { + showSnackbar({ + title: "Package Unit", + subtitle: "Error saving package unit", + kind: "error", + }); + } + ); + }; + if (isLoading) return ( = ({ stockItemUuid }) => { ); return ( - <> + = ({ stockItemUuid }) => { - {items.map((row: StockItemPackagingUOMDTO) => { - return ; - })} +
+ {items.length > 0 ? ( + <> + {items.map((row: StockItemPackagingUOMDTO) => { + return ; + })} + + ) : ( + + )} +
@@ -83,15 +123,13 @@ const PackagingUnits: React.FC = ({ stockItemUuid }) => { name="save" type="submit" className="submitButton" - onClick={() => { - // TODO: Implement Save - }} + onClick={handleSavePackageUnits} kind="primary" renderIcon={Save} > Save - +
); }; @@ -104,21 +142,17 @@ const PackagingUnitRow: React.FC<{ const { control, formState: { errors }, - } = useForm({ - defaultValues: row, - mode: "all", - resolver: zodResolver(packageUnitSchema), - }); - + } = useFormContext(); + errors; return ( - + @@ -134,7 +168,7 @@ const PackagingUnitRow: React.FC<{ control={control} id="factor" invalid={!!errors.factor} - invalidText={errors?.factor?.message} + // invalidText={errors?.factor?.message} />