feat(FE): adding delete per product row delivery order

src/components/pages/marketing/form/MarketingForm.tsx

@@ -582,6 +582,30 @@ const MarketingForm = ({
     },
     [addDOModal]
   );
+  const handleDeleteDO = useCallback(
+    async (id: number) => {
+      setDeliveryOrderValues((prev) =>
+        prev.map((product) =>
+          product.id === id
+            ? {
+                ...product,
+                ...{
+                  unit_price: '',
+                  total_weight: '',
+                  qty: '',
+                  avg_weight: '',
+                  total_price: '',
+                  delivery_date: '',
+                },
+              }
+            : product
+        )
+      );
+      addDOModal.closeModal();
+      setSelectedDeliveryProduct(null);
+    },
+    [addDOModal]
+  );
 
   useEffect(() => {
     formik.setFieldValue('delivery_order', deliveryOrderValues);
@@ -686,6 +710,7 @@ const MarketingForm = ({
                 formType={formType}
                 data={deliveryOrderValues}
                 onEdit={handleEditDO}
+                onDelete={handleDeleteDO}
                 onAddProductClick={handleAddDOClick}
               />
             </Card>

src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx

@@ -106,6 +106,7 @@ const DeliveryOrderProductForm = ({
         await onUpdateForm?.(values.marketing_product_id as number, values);
       }
       handleResetForm();
+      setSelectedProduct(null);
     },
   });
 
@@ -124,7 +125,7 @@ const DeliveryOrderProductForm = ({
         marketing_product: undefined,
       },
     });
-    setSelectedProduct(null);
+    // setSelectedProduct(null);
   };
 
   const handleBlurField = (field: string) => {

src/components/pages/marketing/form/table-view/DeliveryOrderProductTable.tsx

@@ -16,6 +16,7 @@ type DeliveryOrderProductTableProps = {
   data: DeliveryOrderProductFormValues[];
   formType?: 'add' | 'edit' | 'add_deliver' | 'edit_deliver';
   onEdit: (id: number) => void;
+  onDelete: (id: number) => void;
   onAddProductClick: () => void;
 };
 
@@ -23,10 +24,13 @@ const DeliveryOrderProductTable = ({
   data,
   formType,
   onEdit,
+  onDelete,
   onAddProductClick,
 }: DeliveryOrderProductTableProps) => {
   const onEditRef = useRef(onEdit);
   onEditRef.current = onEdit;
+  const onDeleteRef = useRef(onDelete);
+  onDeleteRef.current = onDelete;
 
   const canAddData = data.filter((item) => !Boolean(item.qty));
 
@@ -144,16 +148,29 @@ const DeliveryOrderProductTable = ({
           <div className='flex flex-row gap-1 items-center justify-end h-full mt-2'>
             <>
               {props.row.original.qty && (
-                <Button
+                <>
-                  color='warning'
+                  <Button
-                  className='px-2 py-1 text-sm'
+                    color='warning'
-                  onClick={() =>
+                    className='px-2 py-1 text-sm'
-                    onEditRef.current(props.row.original.id as number)
+                    onClick={() =>
-                  }
+                      onEditRef.current(props.row.original.id as number)
-                  type='button'
+                    }
-                >
+                    type='button'
-                  <Icon icon='mdi:edit' width={16} height={16} /> Edit
+                  >
-                </Button>
+                    <Icon icon='mdi:edit' width={16} height={16} /> Edit
+                  </Button>
+                  <Button
+                    color='error'
+                    className='px-2 py-1 text-sm'
+                    onClick={() =>
+                      onDeleteRef.current(props.row.original.id as number)
+                    }
+                    type='button'
+                    disabled={!!props.row.original.do_number}
+                  >
+                    <Icon icon='mdi:delete' width={16} height={16} /> Hapus
+                  </Button>
+                </>
               )}
               {!props.row.original.qty && '-'}
             </>

src/components/pages/marketing/form/table-view/SalesOrderProductTable.tsx

@@ -111,7 +111,7 @@ const SalesOrderProductTable = ({
             5
           ) +
           ' ' +
-          row.original.uom,
+          (row.original.uom ?? ''),
       },
       {
         accessorFn: (row: SalesOrderProductFormValues) =>
@@ -135,7 +135,7 @@ const SalesOrderProductTable = ({
               onClick={() => onEditRef.current(props.row.original.id as number)}
               type='button'
             >
-              <Icon icon='mdi:pencil' width={16} height={16} />
+              <Icon icon='mdi:pencil' width={16} height={16} /> Edit
             </Button>
             <Button
               color='error'
@@ -145,7 +145,7 @@ const SalesOrderProductTable = ({
               }
               type='button'
             >
-              <Icon icon='mdi:trash' width={16} height={16} />
+              <Icon icon='mdi:trash' width={16} height={16} /> Hapus
             </Button>
           </div>
         ),