persist date

src/App.tsx

@@ -6,7 +6,12 @@ import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 import { queryClient } from "./layouts/AuthLayout";
 import  ModalProvider  from "./ModalProvider";
 
-
+window.addEventListener("unhandledrejection", (event) => {
+  if (event.reason?.message?.includes("Failed to fetch")) {
+    event.preventDefault();
+    console.debug("Network issue (fetch failed) - suppressed");
+  }
+});
 
 const App = () => {
   return (

src/ModalProvider.jsx

@@ -1,15 +1,14 @@
 import React, { useEffect } from "react";
 import { useOrganizationModal } from "./hooks/useOrganization";
 import OrganizationModal from "./components/Organization/OrganizationModal";
-import { useAuthModal } from "./hooks/useAuth";
+import { useAuthModal, useModal } from "./hooks/useAuth";
 import SwitchTenant from "./pages/authentication/SwitchTenant";
-import { useProjectModal } from "./hooks/useProjects";
 import { ProjectModal } from "./components/Project/ManageProjectInfo";
 
 const ModalProvider = () => {
   const { isOpen, onClose } = useOrganizationModal();
   const { isOpen: isAuthOpen } = useAuthModal();
-  const {isOpen:isOpenProject}  = useProjectModal()
+  const {isOpen:isOpenProject}  = useModal("ManageProject")
 
   return (
     <>

src/components/Activities/Regularization.jsx

@@ -22,9 +22,19 @@ const Regularization = ({ handleRequest, searchTerm, projectId, organizationId,
   const { regularizes, loading, error, refetch } =
     useRegularizationRequests(selectedProject, organizationId, IncludeInActive);
 
-  useEffect(() => {
+useEffect(() => {
-    setregularizedList(regularizes);
+  if (regularizes && regularizes.length) {
-  }, [regularizes]);
+    setregularizedList((prev) => {
+      const prevIds = prev.map((i) => i.id).join(",");
+      const newIds = regularizes.map((i) => i.id).join(",");
+      if (prevIds !== newIds) {
+        return regularizes;
+      }
+      return prev;
+    });
+  }
+}, [regularizes]);
+
 
   const sortByName = (a, b) => {
     const nameA = a.firstName.toLowerCase() + a.lastName.toLowerCase();

src/components/Project/ManageProjectInfo.jsx

@@ -8,7 +8,6 @@ import DatePicker from "../common/DatePicker";
 import {
   useCreateProject,
   useProjectDetails,
-  useProjectModal,
   useUpdateProject,
 } from "../../hooks/useProjects";
 
@@ -23,6 +22,7 @@ import {
 } from "../../hooks/useOrganization";
 import { localToUtc } from "../../utils/appUtils";
 import Modal from "../common/Modal";
+import { useModal } from "../../hooks/useAuth";
 
 const currentDate = new Date().toLocaleDateString("en-CA");
 const formatDate = (date) => {
@@ -38,7 +38,7 @@ const formatDate = (date) => {
 const ManageProjectInfo = ({ project, onClose }) => {
   const [addressLength, setAddressLength] = useState(0);
   const maxAddressLength = 500;
-  const { onOpen, startStep, flowType } = useOrganizationModal();
+  const { onOpen, startStep, flowType } = useModal("ManageProject");
 
   const ACTIVE_STATUS_ID = "b74da4c2-d07e-46f2-9919-e75e49b12731";
 

src/components/common/DateRangePicker.jsx

@@ -1,5 +1,7 @@
 import React, { useEffect, useRef } from "react";
 import { useController, useFormContext, useWatch } from "react-hook-form";
+import { useSelector } from "react-redux";
+
 const DateRangePicker = ({
   md,
   sm,
@@ -9,18 +11,28 @@ const DateRangePicker = ({
 }) => {
   const inputRef = useRef(null);
 
+  const persistedRange = useSelector(
+    (store) => store.localVariables.attendance.defaultDateRange
+  );
+
   useEffect(() => {
-    const endDate = new Date();
+    let startDate, endDate;
-    if (endDateMode === "yesterday") {
+
-      endDate.setDate(endDate.getDate() - 1);
+    if (persistedRange?.startDate && persistedRange?.endDate) {
+      startDate = new Date(persistedRange.startDate);
+      endDate = new Date(persistedRange.endDate);
+    } else {
+      endDate = new Date();
+      if (endDateMode === "yesterday") {
+        endDate.setDate(endDate.getDate() - 1);
+      }
+      endDate.setHours(0, 0, 0, 0);
+
+      startDate = new Date(endDate);
+      startDate.setDate(endDate.getDate() - (DateDifference - 1));
+      startDate.setHours(0, 0, 0, 0);
     }
 
-    endDate.setHours(0, 0, 0, 0);
-
-    const startDate = new Date(endDate);
-    startDate.setDate(endDate.getDate() - (DateDifference - 1));
-    startDate.setHours(0, 0, 0, 0);
-
     const fp = flatpickr(inputRef.current, { 
       mode: "range",
       dateFormat: "Y-m-d",
@@ -41,14 +53,12 @@ const DateRangePicker = ({
       endDate: endDate.toLocaleDateString("en-CA"),
     });
 
-    return () => {
+    return () => fp.destroy();
-      fp.destroy();
+  }, [onRangeChange, DateDifference, endDateMode, persistedRange]);
-    };
-  }, [onRangeChange, DateDifference, endDateMode]);
 
   const handleIconClick = () => {
-    if (inputRef.current) {
+    if (inputRef.current?._flatpickr) {
-      inputRef.current._flatpickr.open(); // directly opens flatpickr
+      inputRef.current._flatpickr.open();
     }
   };
 
@@ -63,9 +73,10 @@ const DateRangePicker = ({
       />
 
       <i
-        className="bx bx-calendar calendar-icon cursor-pointer position-relative top-50  translate-middle-y " onClick={handleIconClick}
+        className="bx bx-calendar calendar-icon cursor-pointer position-relative top-50 translate-middle-y"
+        onClick={handleIconClick}
         style={{ right: "22px", bottom: "-8px" }}
-      ></i>
+      />
     </div>
   );
 };
@@ -76,6 +87,7 @@ export default DateRangePicker;
 
 
 
+
 export const DateRangePicker1 = ({
   startField = "startDate",
   endField = "endDate",
@@ -85,7 +97,6 @@ export const DateRangePicker1 = ({
   resetSignal,
   defaultRange = true,
   maxDate = null,
-  sm,md,
   ...rest
 }) => {
   const inputRef = useRef(null);
@@ -169,12 +180,11 @@ export const DateRangePicker1 = ({
   const formattedValue = start && end ? `${start} To ${end}` : "";
 
   return (
-      <div className={`col-${sm} col-sm-${md} px-1 position-relative`}>
+    <div className={`position-relative ${className}`}>
       <input
         type="text"
-        className="form-control form-control-sm ps-2 pe-5 me-4 cursor-pointer"
+        className="form-control form-control-sm"
-        placeholder="From to End"
+        placeholder={placeholder}
-        id="flatpickr-range"
         defaultValue={formattedValue}
         ref={(el) => {
           inputRef.current = el;
@@ -183,10 +193,12 @@ export const DateRangePicker1 = ({
         readOnly={!allowText}
         autoComplete="off"
       />
-      <i
+      <span
-        className="bx bx-calendar calendar-icon cursor-pointer position-absolute top-50 end-0 translate-middle-y me-2"
+        className="position-absolute top-50 end-0 pe-1 translate-middle-y cursor-pointer"
         onClick={() => inputRef.current?._flatpickr?.open()}
-      ></i>
+      >
+        <i className="bx bx-calendar bx-sm fs-5 text-muted"></i>
+      </span>
     </div>
   );
 };

src/hooks/useAuth.jsx

@@ -14,6 +14,23 @@ import {
 } from "../slices/localVariablesSlice.jsx";
 import { removeSession } from "../utils/authUtils.js";
 
+
+
+// ----------------------------Modal--------------------------
+
+export const useModal = (modalType) => {
+  const dispatch = useDispatch();
+  const isOpen = useSelector(
+    (state) => state.localVariables.modals[modalType]?.isOpen
+  );
+
+  const onOpen = (data = {}) => dispatch(openModal({ modalType, data }));
+  const onClose = () => dispatch(closeModal({ modalType }));
+  const onToggle = () => dispatch(toggleModal({ modalType }));
+
+  return { isOpen, onOpen, onClose, onToggle };
+};
+
 export const useTenants = () => {
   return useQuery({
     queryKey: ["tenantlist"],

src/hooks/useProjects.js

@@ -3,7 +3,7 @@ import { cacheData, getCachedData } from "../slices/apiDataManager";
 import ProjectRepository from "../repositories/ProjectRepository";
 import { useProfile } from "./useProfile";
 import { useDispatch, useSelector } from "react-redux";
-import { closeProjectModal, openProjectModal, setProjectId } from "../slices/localVariablesSlice";
+import {  setProjectId } from "../slices/localVariablesSlice";
 import EmployeeList from "../components/Directory/EmployeeList";
 import eventBus from "../services/eventBus";
 import {
@@ -12,23 +12,25 @@ import {
   useQuery,
   useQueryClient,
 } from "@tanstack/react-query";
+
+
 import showToast from "../services/toastService";
 
 export const useCurrentService = () => {
   return useSelector((store) => store.globalVariables.selectedServiceId);
 };
 
-export const useProjectModal = () => {
+// export const useProjectModal = () => {
-  const dispatch = useDispatch();
+//   const dispatch = useDispatch();
-  const { isOpen, data } = useSelector((state) => state.localVariables.ProjectModal);
+//   const { isOpen, data } = useSelector((state) => state.localVariables.ProjectModal);
 
-  return {
+//   return {
-    isOpen,
+//     isOpen,
-    data,
+//     data,
-    openModal: (payload = null) => dispatch(openProjectModal(payload)),
+//     openModal: (payload = null) => dispatch(openProjectModal(payload)),
-    closeModal: () => dispatch(closeProjectModal()),
+//     closeModal: () => dispatch(closeProjectModal()),
-  };
+//   };
-};
+// };
 
 // ------------------------------Query-------------------
 

src/pages/Activities/AttendancePage.jsx

@@ -70,7 +70,8 @@ const AttendancePage = () => {
   };
 
   const handleModalData = (employee) => {
-    setModelConfig(employee);
+      setModelConfig(employee);
+  if (employee !== null) setIsCreateModalOpen(true);
   };
 
   const closeModal = () => {
@@ -78,11 +79,7 @@ const AttendancePage = () => {
     setIsCreateModalOpen(false);
   };
 
-  useEffect(() => {
+
-    if (modelConfig !== null) {
-      openModel();
-    }
-  }, [modelConfig, isCreateModalOpen]);
 
   // Handler to change tab and reset search term
   const handleTabChange = (tabName) => {

src/slices/localVariablesSlice.jsx

@@ -4,10 +4,18 @@ const localVariablesSlice = createSlice({
   name: "localVariables",
   initialState: {
     selectedMaster: "Application Role",
-    regularizationCount: 0,
+    //  Attendances
-    defaultDateRange: {
+    attendance: {
-      startDate: null,
+      regularizationCount: 0,
-      endDate: null,
+      defaultDateRange: { startDate: null, endDate: null },
+      SelectedOrg: "",
+    },
+
+    // Modal for all simple pass Name
+
+    modals: {
+      auth: { isOpen: false },
+      organization: { isOpen: false },
     },
     projectId: null,
     reload: false,
@@ -19,10 +27,6 @@ const localVariablesSlice = createSlice({
       startStep: 1,
       flowType: "default",
     },
-    ProjectModal:{
-       isOpen: false,
-       data: null,
-    },
 
     AuthModal: {
       isOpen: false,
@@ -32,9 +36,18 @@ const localVariablesSlice = createSlice({
     changeMaster: (state, action) => {
       state.selectedMaster = action.payload;
     },
+
+    // ─── ATTENDANCE ─────────────────────────
     updateRegularizationCount: (state, action) => {
-      state.regularizationCount = action.payload;
+      state.attendance.regularizationCount = action.payload;
     },
+    setDefaultDateRange: (state, action) => {
+      state.attendance.defaultDateRange = action.payload;
+    },
+    setOrganization: (state, action) => {
+      state.attendance.SelectedOrg = action.payload;
+    },
+
     setProjectId: (state, action) => {
       localStorage.setItem("project", null);
       state.projectId = action.payload;
@@ -43,10 +56,6 @@ const localVariablesSlice = createSlice({
     refreshData: (state, action) => {
       state.reload = action.payload;
     },
-    setDefaultDateRange: (state, action) => {
-      state.defaultDateRange = action.payload;
-    },
-
     openOrgModal: (state, action) => {
       state.OrganizationModal.isOpen = true;
       state.OrganizationModal.orgData = action.payload?.orgData || null;
@@ -75,15 +84,17 @@ const localVariablesSlice = createSlice({
       state.AuthModal.isOpen = false;
     },
 
-
+    openModal: (state, action) => {
-    // project modal 
+      const { modalType, data } = action.payload;
-    openProjectModal: (state, action) => {
+      state.modals[modalType] = { isOpen: true, ...data };
-      state.ProjectModal.isOpen = true;
-      state.ProjectModal.data = action.payload || null;
     },
-    closeProjectModal: (state) => {
+    closeModal: (state, action) => {
-      state.ProjectModal.isOpen = false;
+      const { modalType } = action.payload;
-      state.ProjectModal.data = null;
+      state.modals[modalType] = { ...state.modals[modalType], isOpen: false };
+    },
+    toggleModal: (state, action) => {
+      const { modalType } = action.payload;
+      state.modals[modalType].isOpen = !state.modals[modalType].isOpen;
     },
   },
 });
@@ -99,6 +110,6 @@ export const {
   toggleOrgModal,
   openAuthModal,
   closeAuthModal,
-  openProjectModal, closeProjectModal
+  setOrganization,openModal, closeModal, toggleModal 
 } = localVariablesSlice.actions;
 export default localVariablesSlice.reducer;