refactor(FE): Refactor chickin approval modal logic into Zustand store

src/components/pages/production/project-flock/ProjectFlockTable.tsx

@@ -36,6 +36,7 @@ import PopoverContent from '@/components/popover/PopoverContent';
 import ProjectFlockConfirmationModal from './ProjectFlockConfirmationModal';
 import { useProjectFlockStore } from '@/stores/production/project-flock/project-flock.store';
 import { ProjectFlockFormValues } from './form/ProjectFlockForm.schema';
+import { useChickinStore } from '@/stores/production/chickin/chickin.store';
 
 const RowOptionsMenu = ({
   props,
@@ -193,6 +194,7 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
   const deleteModal = useModal();
   const confirmModal = useModal();
   const successModal = useModal();
+  const chickinApproveModal = useModal();
   const [approvalAction, setApprovalAction] = useState<'APPROVED' | 'REJECTED'>(
     'APPROVED'
   );
@@ -200,6 +202,13 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
   const [isApproveLoading, setIsApproveLoading] = useState(false);
   const [isLoadingExportingToExcel, setIsLoadingExportingToExcel] =
     useState(false);
+  const {
+    isChickinApproveModalOpen,
+    isChickinApproveLoading,
+    chickinApproveCallback,
+    closeChickinApproveModal,
+    setChickinApproveLoading,
+  } = useChickinStore();
 
   // ===== Fetch Data =====
   const {
@@ -292,6 +301,14 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
     refreshProjectFlocks();
   }, [refresh]);
 
+  useEffect(() => {
+    if (isChickinApproveModalOpen) {
+      chickinApproveModal.openModal();
+    } else {
+      chickinApproveModal.closeModal();
+    }
+  }, [isChickinApproveModalOpen, chickinApproveModal]);
+
   useEffect(() => {
     if (isSuccess) {
       successModal.openModal();
@@ -974,6 +991,40 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
         onClose={handleSuccessModalClose}
         secondaryButton={undefined}
       />
+
+      {/* Chickin Approval Modal */}
+      <ConfirmationModalWithNotes
+        ref={chickinApproveModal.ref}
+        type='success'
+        text={`Apakah anda yakin ingin approve data Chickin yang Pending?`}
+        className={{
+          modal: 'z-9999',
+        }}
+        secondaryButton={{
+          text: 'Tidak',
+          onClick: () => {
+            closeChickinApproveModal();
+            chickinApproveModal.closeModal();
+          },
+        }}
+        primaryButton={{
+          text: 'Ya',
+          color: 'success',
+          onClick: async (notes) => {
+            if (chickinApproveCallback) {
+              setChickinApproveLoading(true);
+              try {
+                await chickinApproveCallback(notes);
+              } finally {
+                setChickinApproveLoading(false);
+                closeChickinApproveModal();
+                chickinApproveModal.closeModal();
+              }
+            }
+          },
+          isLoading: isChickinApproveLoading,
+        }}
+      />
     </>
   );
 };