Implementing Validation when we status will be done or closed then Archieve button will be shown.

src/components/ServiceProject/JobList.jsx

@@ -5,7 +5,7 @@ import {
   getNextBadgeColor,
 } from "../../utils/appUtils";
 import { useServiceProjectJobs, useUpdateServiceProjectJob } from "../../hooks/useServiceProject";
-import { ITEMS_PER_PAGE } from "../../utils/constants";
+import { ITEMS_PER_PAGE, JOBS_STATUS_IDS } from "../../utils/constants";
 import EmployeeAvatarGroup from "../common/EmployeeAvatarGroup";
 import { formatUTCToLocalTime } from "../../utils/dateUtils";
 import { SpinnerLoader } from "../common/Loader";
@@ -112,6 +112,14 @@ const JobList = () => {
     },
   ];
 
+  const canArchive = (statusId) => {
+    const closedId = JOBS_STATUS_IDS.find((s) => s.label === "Closed")?.id;
+    const workDoneId = JOBS_STATUS_IDS.find((s) => s.label === "Work Done")?.id;
+
+    return statusId === closedId || statusId === workDoneId;
+  };
+
+
   return (
     <>
 
@@ -182,6 +190,7 @@ const JobList = () => {
                         >
                           <i className="bx bx-detail bx-sm"></i> View
                         </button>
+                        <>
                         <button
                           className="dropdown-item py-1"
                           onClick={() =>
@@ -190,7 +199,9 @@ const JobList = () => {
                         >
                           <i className="bx bx-edit bx-sm"></i> Edit
                         </button>
+                        </>
 
+                        {canArchive(row?.status?.id) && (
                           <button
                             className="dropdown-item py-1"
                             onClick={() => {
@@ -200,6 +211,8 @@ const JobList = () => {
                           >
                             <i className="bx bx-archive bx-sm"></i> Archive
                           </button>
+                        )}
+
                       </div>
                     </div>
                   </td>

src/hooks/useServiceProject.jsx

@@ -255,23 +255,26 @@ export const useCreateServiceProjectJob = (onSuccessCallback) => {
   });
 };
 
-export const useUpdateServiceProjectJob = () => {
+export const useUpdateServiceProjectJob = (onSuccessCallback) => {
   const queryClient = useQueryClient();
 
   return useMutation({
     mutationFn: async ({ id, payload, isArchiveAction = false }) => {
       const resp = await ServiceProjectRepository.UpdateJob(id, payload);
+
       return { resp, isArchiveAction };
     },
 
-    onSuccess: ({ isArchiveAction }, variables) => {
+    onSuccess: ({ isArchiveAction }) => {
       queryClient.invalidateQueries({ queryKey: ["serviceProjectJobs"] });
       queryClient.invalidateQueries({ queryKey: ["service-job"] });
 
+      if (onSuccessCallback) onSuccessCallback();
+
       if (isArchiveAction) {
         showToast("Job archived successfully", "success");
       } else {
-        showToast("Job updated successfully", "success");
+        showToast("Job Updated successfully", "success");
       }
     },
 
@@ -286,6 +289,7 @@ export const useUpdateServiceProjectJob = () => {
   });
 };
 
+
 //#endregion
 
 //#region Branch

src/utils/constants.jsx

@@ -211,3 +211,34 @@ export const PAYEE_RECURRING_EXPENSE = [
 export const STATUS_JOB_CLOSED = "3ddeefb5-ae3c-4e10-a922-35e0a452bb69"
 
 //#endregion
+
+export const JOBS_STATUS_IDS = [
+  {
+    id: "32d76a02-8f44-4aa0-9b66-c3716c45a918",
+    label: "New",
+  },
+  {
+    id: "cfa1886d-055f-4ded-84c6-42a2a8a14a66",
+    label: "Assigned",
+  },
+  {
+    id: "5a6873a5-fed7-4745-a52f-8f61bf3bd72d",
+    label: "In Progress",
+  },
+  {
+    id: "aab71020-2fb8-44d9-9430-c9a7e9bf33b0",
+    label: "Work Done",
+  },
+  {
+    id: "ed10ab57-dbaa-4ca5-8ecd-56745dcbdbd7",
+    label: "Review Done",
+  },
+  {
+    id: "3ddeefb5-ae3c-4e10-a922-35e0a452bb69",
+    label: "Closed",
+  },
+  {
+    id: "75a0c8b8-9c6a-41af-80bf-b35bab722eb2",
+    label: "On Hold",
+  },
+];