diff --git a/src/components/Activities/AttendLogs.jsx b/src/components/Activities/AttendLogs.jsx
index b94c80c6..7c1e686d 100644
--- a/src/components/Activities/AttendLogs.jsx
+++ b/src/components/Activities/AttendLogs.jsx
@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from "react";
 import { useEmployeeAttendacesLog } from "../../hooks/useAttendance";
-import { convertShortTime } from "../../utils/dateUtils";
+import { convertShortTime, formatUTCToLocalTime } from "../../utils/dateUtils";
 import { useNavigate } from "react-router-dom";
 import { THRESH_HOLD } from "../../utils/constants";
 
@@ -128,7 +128,7 @@ const AttendLogs = ({ Id }) => {
           <p>
             Attendance logs for{" "}
             {logs[0]?.employee?.firstName + " " + logs[0]?.employee?.lastName}{" "}
-            on {logs[0]?.activityTime.slice(0, 10)}{" "}
+            on {formatUTCToLocalTime(logs[0]?.activityTime)}
           </p>
         )}
       </div>
@@ -156,7 +156,7 @@ const AttendLogs = ({ Id }) => {
                 .sort((a, b) => b.id - a.id)
                 .map((log, index) => (
                   <tr key={index}>
-                    <td>{log.activityTime.slice(0, 10)}</td>
+                    <td>{formatUTCToLocalTime(log.activityTime)}</td>
                     <td>{convertShortTime(log.activityTime)}</td>
                     <td>
                       {whichActivityPerform(log.activity, log.activityTime)}
diff --git a/src/components/Activities/Attendance.jsx b/src/components/Activities/Attendance.jsx
index 2dde2938..eb7dc500 100644
--- a/src/components/Activities/Attendance.jsx
+++ b/src/components/Activities/Attendance.jsx
@@ -1,7 +1,7 @@
 import React, { useState, useEffect, useCallback, useMemo } from "react";
 import moment from "moment";
 import Avatar from "../common/Avatar";
-import { convertShortTime } from "../../utils/dateUtils";
+import { convertShortTime, formatUTCToLocalTime } from "../../utils/dateUtils";
 import RenderAttendanceStatus from "./RenderAttendanceStatus";
 import usePagination from "../../hooks/usePagination";
 import { useNavigate } from "react-router-dom";
@@ -10,7 +10,7 @@ import { useAttendance } from "../../hooks/useAttendance";
 import { useSelector } from "react-redux";
 import { useQueryClient } from "@tanstack/react-query";
 import eventBus from "../../services/eventBus";
-import { useSelectedproject } from "../../slices/apiDataManager";
+import { useSelectedProject } from "../../slices/apiDataManager";
 
 const Attendance = ({ getRole, handleModalData, searchTerm }) => {
   const queryClient = useQueryClient();
@@ -21,7 +21,7 @@ const Attendance = ({ getRole, handleModalData, searchTerm }) => {
   // const selectedProject = useSelector(
   //   (store) => store.localVariables.projectId
   // );
-  const selectedProject = useSelectedproject();
+  const selectedProject = useSelectedProject();
   const {
     attendance,
     loading: attLoading,
@@ -116,7 +116,7 @@ const Attendance = ({ getRole, handleModalData, searchTerm }) => {
     <>
       <div className="table-responsive text-nowrap h-100" >
         <div className="d-flex text-start align-items-center py-2">
-          <strong>Date : {todayDate.toLocaleDateString("en-GB")}</strong>
+          <strong>Date : {formatUTCToLocalTime(todayDate)}</strong>
           <div className="form-check form-switch text-start m-0 ms-5">
             <input
               type="checkbox"
diff --git a/src/components/Activities/AttendcesLogs.jsx b/src/components/Activities/AttendcesLogs.jsx
index 548175d9..681783be 100644
--- a/src/components/Activities/AttendcesLogs.jsx
+++ b/src/components/Activities/AttendcesLogs.jsx
@@ -6,11 +6,12 @@ import RenderAttendanceStatus from "./RenderAttendanceStatus";
 import { useSelector, useDispatch } from "react-redux";
 import { fetchAttendanceData } from "../../slices/apiSlice/attedanceLogsSlice";
 import DateRangePicker from "../common/DateRangePicker";
-import { clearCacheKey, getCachedData, useSelectedproject } from "../../slices/apiDataManager";
+import { clearCacheKey, getCachedData, useSelectedProject } from "../../slices/apiDataManager";
 import eventBus from "../../services/eventBus";
 import AttendanceRepository from "../../repositories/AttendanceRepository";
 import { useAttendancesLogs } from "../../hooks/useAttendance";
 import { queryClient } from "../../layouts/AuthLayout";
+import { ITEMS_PER_PAGE } from "../../utils/constants";
 
 const usePagination = (data, itemsPerPage) => {
   const [currentPage, setCurrentPage] = useState(1);
@@ -37,7 +38,7 @@ const AttendanceLog = ({ handleModalData, searchTerm }) => {
   // const selectedProject = useSelector(
   //   (store) => store.localVariables.projectId
   // );
-  const selectedProject = useSelectedproject();
+  const selectedProject = useSelectedProject();
   const [dateRange, setDateRange] = useState({ startDate: "", endDate: "" });
   const dispatch = useDispatch();
   const [loading, setLoading] = useState(false);
@@ -353,7 +354,7 @@ const AttendanceLog = ({ handleModalData, searchTerm }) => {
           <span className="text-secondary">No Pending Record Available !</span>
         </div>
       )}
-      {filteredSearchData.length > 10 && (
+      {filteredSearchData.length > ITEMS_PER_PAGE && (
         <nav aria-label="Page ">
           <ul className="pagination pagination-sm justify-content-end py-1">
             <li className={`page-item ${currentPage === 1 ? "disabled" : ""}`}>
diff --git a/src/components/Activities/CheckCheckOutForm.jsx b/src/components/Activities/CheckCheckOutForm.jsx
index 1bcb7007..a77e9a31 100644
--- a/src/components/Activities/CheckCheckOutForm.jsx
+++ b/src/components/Activities/CheckCheckOutForm.jsx
@@ -9,7 +9,7 @@ import { markAttendance } from "../../slices/apiSlice/attedanceLogsSlice";
 import showToast from "../../services/toastService";
 import { checkIfCurrentDate } from "../../utils/dateUtils";
 import { useMarkAttendance } from "../../hooks/useAttendance";
-import { useSelectedproject } from "../../slices/apiDataManager";
+import { useSelectedProject } from "../../slices/apiDataManager";
 
 const createSchema = (modeldata) => {
   return z
@@ -43,9 +43,8 @@ const createSchema = (modeldata) => {
     });
 };
 
-const CheckCheckOutmodel = ({ modeldata, closeModal, handleSubmitForm }) => {
-  // const projectId = useSelector((store) => store.localVariables.projectId);
-  const projectId = useSelectedproject();
+const CheckInCheckOut = ({ modeldata, closeModal, handleSubmitForm }) => {
+  const projectId = useSelectedProject();
   const { mutate: MarkAttendance } = useMarkAttendance();
   const [isLoading, setIsLoading] = useState(false);
   const coords = usePositionTracker();
@@ -173,7 +172,7 @@ const CheckCheckOutmodel = ({ modeldata, closeModal, handleSubmitForm }) => {
   );
 };
 
-export default CheckCheckOutmodel;
+export default CheckInCheckOut;
 
 const schemaReg = z.object({
   description: z.string().min(1, { message: "please give reason!" }),
diff --git a/src/components/Activities/InfraPlanning.jsx b/src/components/Activities/InfraPlanning.jsx
index 819994a4..664c0613 100644
--- a/src/components/Activities/InfraPlanning.jsx
+++ b/src/components/Activities/InfraPlanning.jsx
@@ -15,7 +15,7 @@ import {useDispatch, useSelector} from "react-redux";
 import {useProfile} from "../../hooks/useProfile";
 import {refreshData, setProjectId} from "../../slices/localVariablesSlice";
 import InfraTable from "../Project/Infrastructure/InfraTable";
-import { useSelectedproject } from "../../slices/apiDataManager";
+import { useSelectedProject } from "../../slices/apiDataManager";
 import Loader from "../common/Loader";
 
 
@@ -24,7 +24,7 @@ const InfraPlanning = () =>
   const {profile: LoggedUser, refetch : fetchData} = useProfile()
   const dispatch = useDispatch()
   // const selectedProject = useSelector((store)=>store.localVariables.projectId)
-  const selectedProject = useSelectedproject();
+  const selectedProject = useSelectedProject();
   const {projectInfra, isLoading, error} = useProjectInfra( selectedProject )
 
 
@@ -35,15 +35,15 @@ const InfraPlanning = () =>
   const reloadedData = useSelector( ( store ) => store.localVariables.reload )
 
   
-   useEffect( () =>
-   {
-     if (reloadedData)
-     {
-       refetch()
-       dispatch( refreshData( false ) )
-     }
+  //  useEffect( () =>
+  //  {
+  //    if (reloadedData)
+  //    {
+  //      refetch()
+  //      dispatch( refreshData( false ) )
+  //    }
 
-   },[reloadedData])
+  //  },[reloadedData])
 
   return (
     <div className="col-md-12 col-lg-12 col-xl-12 order-0 mb-4">
diff --git a/src/components/Activities/Regularization.jsx b/src/components/Activities/Regularization.jsx
index 3e04caef..cdcd3972 100644
--- a/src/components/Activities/Regularization.jsx
+++ b/src/components/Activities/Regularization.jsx
@@ -7,13 +7,13 @@ import { useRegularizationRequests } from "../../hooks/useAttendance";
 import moment from "moment";
 import usePagination from "../../hooks/usePagination";
 import eventBus from "../../services/eventBus";
-import { cacheData, clearCacheKey, useSelectedproject } from "../../slices/apiDataManager";
+import { cacheData, clearCacheKey, useSelectedProject } from "../../slices/apiDataManager";
 import { useQueryClient } from "@tanstack/react-query";
 
 const Regularization = ({ handleRequest, searchTerm }) => {
   const queryClient = useQueryClient();
   // var selectedProject = useSelector((store) => store.localVariables.projectId);
-  const selectedProject = useSelectedproject();
+  const selectedProject = useSelectedProject();
   const [regularizesList, setregularizedList] = useState([]);
   const { regularizes, loading, error, refetch } =
     useRegularizationRequests(selectedProject);
diff --git a/src/components/Activities/RegularizationActions.jsx b/src/components/Activities/RegularizationActions.jsx
index 318b8382..1fcb3485 100644
--- a/src/components/Activities/RegularizationActions.jsx
+++ b/src/components/Activities/RegularizationActions.jsx
@@ -4,7 +4,7 @@ import useAttendanceStatus, { ACTIONS } from '../../hooks/useAttendanceStatus';
 import { useDispatch, useSelector } from 'react-redux';
 import { usePositionTracker } from '../../hooks/usePositionTracker';
 import {markCurrentAttendance} from '../../slices/apiSlice/attendanceAllSlice';
-import {cacheData, getCachedData, useSelectedproject} from '../../slices/apiDataManager';
+import {cacheData, getCachedData, useSelectedProject} from '../../slices/apiDataManager';
 import showToast from '../../services/toastService';
 import { useMarkAttendance } from '../../hooks/useAttendance';
 import { useQueryClient } from '@tanstack/react-query';
@@ -18,7 +18,7 @@ const {mutate:MarkAttendance,isPending} = useMarkAttendance()
 const queryClient = useQueryClient()
 
 // const projectId = useSelector((store)=>store.localVariables.projectId)
-const projectId = useSelectedproject();
+const projectId = useSelectedProject();
 const {latitude,longitude} = usePositionTracker();
 const dispatch = useDispatch()
 
diff --git a/src/components/Directory/NotesCardViewDirectory.jsx b/src/components/Directory/NotesCardViewDirectory.jsx
index 0dbbe5bd..b8a16a40 100644
--- a/src/components/Directory/NotesCardViewDirectory.jsx
+++ b/src/components/Directory/NotesCardViewDirectory.jsx
@@ -1,8 +1,16 @@
 import React, { useEffect, useState, useMemo } from "react";
 import { DirectoryRepository } from "../../repositories/DirectoryRepository";
 import NoteCardDirectoryEditable from "./NoteCardDirectoryEditable";
+import { useSelectedProject } from "../../slices/apiDataManager";
+
+const NotesCardViewDirectory = ({
+  notes,
+  setNotesForFilter,
+  searchText,
+  filterAppliedNotes,
+}) => {
+  const projectId = useSelectedProject(); 
 
-const NotesCardViewDirectory = ({ notes, setNotesForFilter, searchText, filterAppliedNotes }) => {
   const [allNotes, setAllNotes] = useState([]);
   const [filteredNotes, setFilteredNotes] = useState([]);
   const [loading, setLoading] = useState(true);
@@ -13,13 +21,15 @@ const NotesCardViewDirectory = ({ notes, setNotesForFilter, searchText, filterAp
   const pageSize = 20;
 
   useEffect(() => {
-    fetchNotes();
-  }, []);
+    if (projectId) {
+      fetchNotes(projectId);
+    }
+  }, [projectId]);
 
-  const fetchNotes = async () => {
+  const fetchNotes = async (projId) => {
     setLoading(true);
     try {
-      const response = await DirectoryRepository.GetNotes(1000, 1);
+      const response = await DirectoryRepository.GetNotes(1000, 1, projId); // ✅ pass projectId
       const fetchedNotes = response.data?.data || [];
       setAllNotes(fetchedNotes);
       setNotesForFilter(fetchedNotes)
@@ -122,7 +132,7 @@ const NotesCardViewDirectory = ({ notes, setNotesForFilter, searchText, filterAp
                 prevNotes.map((n) => (n.id === updatedNote.id ? updatedNote : n))
               );
             }}
-            onNoteDelete={() => fetchNotes()}
+            onNoteDelete={() => fetchNotes(projectId)} // ✅ reload with projectId
           />
         ))}
       </div>
diff --git a/src/components/Employee/EmpAttendance.jsx b/src/components/Employee/EmpAttendance.jsx
index b8ff8b83..26ae9531 100644
--- a/src/components/Employee/EmpAttendance.jsx
+++ b/src/components/Employee/EmpAttendance.jsx
@@ -126,7 +126,7 @@ const EmpAttendance = ({ employee }) => {
           className="dataTables_length text-start py-2 d-flex justify-content-between "
           id="DataTables_Table_0_length"
         >
-          <div className="col-md-3 my-0 ">
+          <div className="col-md-4 my-0 ">
             <DateRangePicker
               DateDifference="30"
               onRangeChange={setDateRange}
diff --git a/src/components/Employee/EmpBanner.jsx b/src/components/Employee/EmpBanner.jsx
index f77de0a0..6cb12073 100644
--- a/src/components/Employee/EmpBanner.jsx
+++ b/src/components/Employee/EmpBanner.jsx
@@ -59,20 +59,20 @@ const EmpBanner = ({ profile, loggedInUser }) => {
               </h4>
               <ul className="list-inline mb-0 d-flex align-items-center flex-wrap justify-content-sm-start justify-content-center gap-4 mt-4">
                 <li className="list-inline-item">
-                  <i className="icon-base bx bx-crown me-2 align-top"></i>
+                  <i className="icon-base bx bx-crown me-1 align-top"></i>
                   <span className="fw-medium">
                     {profile?.jobRole || <em>NA</em>}
                   </span>
                 </li>
                 <li className="list-inline-item">
-                  <i className="icon-base bx bx-phone me-2 align-top"></i>
+                  <i className="icon-base bx bx-phone me-0 align-top"></i>
                   <span className="fw-medium">
                     {" "}
                     {profile?.phoneNumber || <em>NA</em>}
                   </span>
                 </li>
                 <li className="list-inline-item">
-                  <i className="icon-base bx bx-calendar me-2 align-top"></i>
+                  <i className="icon-base bx bx-calendar me-0 align-top"></i>
                   <span className="fw-medium">
                     {" "}
                     Joined on{" "}
@@ -85,18 +85,21 @@ const EmpBanner = ({ profile, loggedInUser }) => {
                 </li>
               </ul>
               <ul className="list-inline mb-0 d-flex align-items-center flex-wrap justify-content-sm-start justify-content-center mt-4">
-                <li className="list-inline-item">
-                  <button
-                    className="btn btn-sm btn-primary btn-block"
-                    onClick={() => setShowModal(true)}
-                  >
-                    Edit Profile
-                  </button>
-                </li>
-                <li className="list-inline-item">
-                  {profile?.id == loggedInUser?.employeeInfo?.id && (
+                {profile?.isActive && (   // ✅ show only if active
+                  <li className="list-inline-item">
                     <button
-                      className="btn  btn-sm btn-outline-primary btn-block"
+                      className="btn btn-sm btn-primary btn-block"
+                      onClick={() => setShowModal(true)}
+                    >
+                      Edit Profile
+                    </button>
+                  </li>
+                )}
+
+                <li className="list-inline-item">
+                  {profile?.id === loggedInUser?.employeeInfo?.id && (
+                    <button
+                      className="btn btn-sm btn-outline-primary btn-block"
                       onClick={() => openChangePassword()}
                     >
                       Change Password
diff --git a/src/components/Expenses/ExpenseFilterPanel.jsx b/src/components/Expenses/ExpenseFilterPanel.jsx
index c6829d45..a3cb5dbb 100644
--- a/src/components/Expenses/ExpenseFilterPanel.jsx
+++ b/src/components/Expenses/ExpenseFilterPanel.jsx
@@ -105,6 +105,7 @@ const ExpenseFilterPanel = ({ onApply, handleGroupBy }) => {
               startField="startDate"
               endField="endDate"
               resetSignal={resetKey}
+              defaultRange={false}
             />
           </div>
 
diff --git a/src/components/Layout/Header.jsx b/src/components/Layout/Header.jsx
index 3edaeb0c..94ec39ac 100644
--- a/src/components/Layout/Header.jsx
+++ b/src/components/Layout/Header.jsx
@@ -3,7 +3,7 @@ import {
   cacheData,
   clearAllCache,
   getCachedData,
-  useSelectedproject,
+  useSelectedProject,
 } from "../../slices/apiDataManager";
 import AuthRepository from "../../repositories/AuthRepository";
 import { useDispatch, useSelector } from "react-redux";
@@ -101,7 +101,7 @@ const Header = () => {
 
   const { projectNames, loading: projectLoading, fetchData } = useProjectName();
 
-  const selectedProject = useSelectedproject();
+  const selectedProject = useSelectedProject();
 
   const projectsForDropdown = isDashboardPath
     ? projectNames
diff --git a/src/components/Project/AboutProject.jsx b/src/components/Project/AboutProject.jsx
index 204fe759..248a9141 100644
--- a/src/components/Project/AboutProject.jsx
+++ b/src/components/Project/AboutProject.jsx
@@ -8,7 +8,7 @@ import { MANAGE_PROJECT } from "../../utils/constants";
 import GlobalModel from "../common/GlobalModel";
 import ManageProjectInfo from "./ManageProjectInfo";
 import { useQueryClient } from "@tanstack/react-query";
-import { useSelectedproject } from "../../slices/apiDataManager";
+import { useSelectedProject } from "../../slices/apiDataManager";
 
 const AboutProject = () => {
   const [IsOpenModal, setIsOpenModal] = useState(false);
@@ -21,7 +21,7 @@ const AboutProject = () => {
 
   // *** MODIFIED LINE: Get projectId from Redux store using useSelector ***
   // const projectId = useSelector((store) => store.localVariables.projectId);
-  const projectId = useSelectedproject();
+  const projectId = useSelectedProject();
 
   const manageProject = useHasUserPermission(MANAGE_PROJECT);
   const { projects_Details, isLoading, error, refetch } = useProjectDetails(projectId); // Pass projectId from useSelector
diff --git a/src/components/Project/ProjectInfra.jsx b/src/components/Project/ProjectInfra.jsx
index 047e41c5..edb8c34b 100644
--- a/src/components/Project/ProjectInfra.jsx
+++ b/src/components/Project/ProjectInfra.jsx
@@ -15,7 +15,7 @@ import {
   cacheData,
   clearCacheKey,
   getCachedData,
-  useSelectedproject,
+  useSelectedProject,
 } from "../../slices/apiDataManager";
 import { useProjectDetails, useProjectInfra } from "../../hooks/useProjects";
 import { useDispatch, useSelector } from "react-redux";
@@ -27,7 +27,7 @@ import GlobalModel from "../common/GlobalModel";
 const ProjectInfra = ( {data, onDataChange, eachSiteEngineer} ) =>
 {
   // const projectId = useSelector((store)=>store.localVariables.projectId)
-  const projectId = useSelectedproject();
+  const projectId = useSelectedProject();
   const reloadedData = useSelector((store) => store.localVariables.reload);
   const [ expandedBuildings, setExpandedBuildings ] = useState( [] );
    const {projectInfra,isLoading,error} = useProjectInfra(projectId)
diff --git a/src/components/Project/Teams.jsx b/src/components/Project/Teams.jsx
index cb725e30..0d4a1eb6 100644
--- a/src/components/Project/Teams.jsx
+++ b/src/components/Project/Teams.jsx
@@ -18,12 +18,12 @@ import {
   useEmployeesByProjectAllocated,
   useManageProjectAllocation,
 } from "../../hooks/useProjects";
-import { useSelectedproject } from "../../slices/apiDataManager";
+import { useSelectedProject } from "../../slices/apiDataManager";
 
 const Teams = () => {
   // const {projectId} = useParams()
   // const projectId = useSelector((store)=>store.localVariables.projectId)
-  const projectId = useSelectedproject();
+  const projectId = useSelectedProject();
   const dispatch = useDispatch();
 
   const { data, loading } = useMaster();
diff --git a/src/components/Tenant/EditProfile.jsx b/src/components/Tenant/EditProfile.jsx
index d6e23c88..8e355737 100644
--- a/src/components/Tenant/EditProfile.jsx
+++ b/src/components/Tenant/EditProfile.jsx
@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import Label from '../common/Label';
-import { useFormContext,useForm,FormProvider } from 'react-hook-form';
+import { useFormContext, useForm, FormProvider } from 'react-hook-form';
 import { useIndustries, useTenantDetails, useUpdateTenantDetails } from '../../hooks/useTenant';
 import { orgSize, reference } from '../../utils/constants';
 import { LogoUpload } from './LogoUpload';
@@ -8,18 +8,18 @@ import showToast from '../../services/toastService';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { EditTenant } from './TenantSchema';
 
-const EditProfile = ({ TenantId,onClose }) => {
+const EditProfile = ({ TenantId, onClose }) => {
   const { data, isLoading, isError, error } = useTenantDetails(TenantId);
   const [logoPreview, setLogoPreview] = useState(null);
   const [logoName, setLogoName] = useState("");
   const { data: Industries, isLoading: industryLoading, isError: industryError } = useIndustries();
-  const {mutate:UpdateTenant,isPending,} = useUpdateTenantDetails(()=>{
-    showToast("Tenant Details Updated Successfully","success")
+  const { mutate: UpdateTenant, isPending, } = useUpdateTenantDetails(() => {
+    showToast("Tenant Details Updated Successfully", "success")
     onClose()
-    
+
   })
   const methods = useForm({
-    resolver:zodResolver(EditTenant),
+    resolver: zodResolver(EditTenant),
     defaultValues: {
       firstName: "",
       lastName: "",
@@ -40,8 +40,8 @@ const EditProfile = ({ TenantId,onClose }) => {
   const { register, reset, handleSubmit, formState: { errors } } = methods;
 
   const onSubmit = (formData) => {
-    const tenantPayload = {...formData,contactName:`${formData.firstName} ${formData.lastName}`,id:data.id,}
-     UpdateTenant({id:data.id,tenantPayload})
+    const tenantPayload = { ...formData, contactName: `${formData.firstName} ${formData.lastName}`, id: data.id, }
+    UpdateTenant({ id: data.id, tenantPayload })
   };
 
   useEffect(() => {
@@ -70,117 +70,117 @@ const EditProfile = ({ TenantId,onClose }) => {
 
 
   return (
-      <FormProvider {...methods}>
-    <form className="row g-6" onSubmit={handleSubmit(onSubmit)}>
-      <h6>Edit Tenant</h6>
+    <FormProvider {...methods}>
+      <form className="row g-6" onSubmit={handleSubmit(onSubmit)}>
+        <h6>Edit Tenant</h6>
 
-      <div className="col-sm-6 mt-1">
-        <Label htmlFor="firstName" required>First Name</Label>
-        <input id="firstName" type="text" className="form-control form-control-sm" {...register("firstName")} inputMode='text' />
-        {errors.firstName && <div className="danger-text">{errors.firstName.message}</div>}
-      </div>
+        <div className="col-sm-6 mt-1">
+          <Label htmlFor="firstName" required>First Name</Label>
+          <input id="firstName" type="text" className="form-control form-control-sm" {...register("firstName")} inputMode='text' />
+          {errors.firstName && <div className="danger-text">{errors.firstName.message}</div>}
+        </div>
 
-      <div className="col-sm-6 mt-1">
-        <Label htmlFor="lastName" required>Last Name</Label>
-        <input id="lastName" type="text" className="form-control form-control-sm" {...register("lastName")} />
-        {errors.lastName && <div className="danger-text">{errors.lastName.message}</div>}
-      </div>
+        <div className="col-sm-6 mt-1">
+          <Label htmlFor="lastName" required>Last Name</Label>
+          <input id="lastName" type="text" className="form-control form-control-sm" {...register("lastName")} />
+          {errors.lastName && <div className="danger-text">{errors.lastName.message}</div>}
+        </div>
 
 
 
-      <div className="col-sm-6 mt-1">
-        <Label htmlFor="contactNumber" required>Contact Number</Label>
-        <input id="contactNumber" type="text" className="form-control form-control-sm" {...register("contactNumber")} inputMode="tel"
-          placeholder="+91 9876543210" />
-        {errors.contactNumber && <div className="danger-text">{errors.contactNumber.message}</div>}
-      </div>
+        <div className="col-sm-6 mt-1">
+          <Label htmlFor="contactNumber" required>Contact Number</Label>
+          <input id="contactNumber" type="text" className="form-control form-control-sm" {...register("contactNumber")} inputMode="tel"
+            placeholder="+91 9876543210" />
+          {errors.contactNumber && <div className="danger-text">{errors.contactNumber.message}</div>}
+        </div>
 
-      <div className="col-sm-6 mt-1">
-        <Label htmlFor="domainName" required>Domain Name</Label>
-        <input id="domainName" type="text" className="form-control form-control-sm" {...register("domainName")} />
-        {errors.domainName && <div className="danger-text">{errors.domainName.message}</div>}
-      </div>
+        <div className="col-sm-6 mt-1">
+          <Label htmlFor="domainName" >Domain Name</Label>
+          <input id="domainName" type="text" className="form-control form-control-sm" {...register("domainName")} />
+          {errors.domainName && <div className="danger-text">{errors.domainName.message}</div>}
+        </div>
 
-      <div className="col-sm-6 mt-1">
-        <Label htmlFor="taxId" required>Tax ID</Label>
-        <input id="taxId" type="text" className="form-control form-control-sm" {...register("taxId")} />
-        {errors.taxId && <div className="danger-text">{errors.taxId.message}</div>}
-      </div>
+        <div className="col-sm-6 mt-1">
+          <Label htmlFor="taxId" >Tax ID</Label>
+          <input id="taxId" type="text" className="form-control form-control-sm" {...register("taxId")} />
+          {errors.taxId && <div className="danger-text">{errors.taxId.message}</div>}
+        </div>
 
-      <div className="col-sm-6 mt-1">
-        <Label htmlFor="officeNumber" required>Office Number</Label>
-        <input id="officeNumber" type="text" className="form-control form-control-sm" {...register("officeNumber")} />
-        {errors.officeNumber && <div className="danger-text">{errors.officeNumber.message}</div>}
-      </div>
+        <div className="col-sm-6 mt-1">
+          <Label htmlFor="officeNumber" >Office Number</Label>
+          <input id="officeNumber" type="text" className="form-control form-control-sm" {...register("officeNumber")} />
+          {errors.officeNumber && <div className="danger-text">{errors.officeNumber.message}</div>}
+        </div>
 
-      <div className="col-sm-6 mt-1">
-        <Label htmlFor="industryId" required>Industry</Label>
-        <select className="form-select form-select-sm" {...register("industryId")}>
-          {industryLoading ? <option value="">Loading...</option> :
-            Industries?.map((indu) => (
-              <option key={indu.id} value={indu.id}>{indu.name}</option>
-            ))
-          }
-        </select>
-        {errors.industryId && <div className="danger-text">{errors.industryId.message}</div>}
-      </div>
+        <div className="col-sm-6 mt-1">
+          <Label htmlFor="industryId" required>Industry</Label>
+          <select className="form-select form-select-sm" {...register("industryId")}>
+            {industryLoading ? <option value="">Loading...</option> :
+              Industries?.map((indu) => (
+                <option key={indu.id} value={indu.id}>{indu.name}</option>
+              ))
+            }
+          </select>
+          {errors.industryId && <div className="danger-text">{errors.industryId.message}</div>}
+        </div>
 
-      <div className="col-sm-6 mt-1">
-        <Label htmlFor="reference">Reference</Label>
-        <select className="form-select form-select-sm" {...register("reference")}>
-          {reference.map((org) => (
-            <option key={org.val} value={org.val}>{org.name}</option>
-          ))}
-        </select>
-        {errors.reference && <div className="danger-text">{errors.reference.message}</div>}
-      </div>
+        <div className="col-sm-6 mt-1">
+          <Label htmlFor="reference">Reference</Label>
+          <select className="form-select form-select-sm" {...register("reference")}>
+            {reference.map((org) => (
+              <option key={org.val} value={org.val}>{org.name}</option>
+            ))}
+          </select>
+          {errors.reference && <div className="danger-text">{errors.reference.message}</div>}
+        </div>
         <div className="col-sm-6">
-        <Label htmlFor="organizationSize" required>
-          Organization Size
-        </Label>
+          <Label htmlFor="organizationSize" required>
+            Organization Size
+          </Label>
 
-        <select
-          className="form-select form-select-sm"
-          {...register("organizationSize")}
-        >
-          {orgSize.map((org) => (
-            <option key={org.val} value={org.val}>
-              {org.name}
-            </option>
-          ))}
-        </select>
-        {errors.organizationSize && (
-          <div className="danger-text">{errors.organizationSize.message}</div>
-        )}
-      </div>
+          <select
+            className="form-select form-select-sm"
+            {...register("organizationSize")}
+          >
+            {orgSize.map((org) => (
+              <option key={org.val} value={org.val}>
+                {org.name}
+              </option>
+            ))}
+          </select>
+          {errors.organizationSize && (
+            <div className="danger-text">{errors.organizationSize.message}</div>
+          )}
+        </div>
 
-      <div className="col-12 mt-1">
-        <Label htmlFor="billingAddress" required>Billing Address</Label>
-        <textarea id="billingAddress" className="form-control" {...register("billingAddress")} rows={2} />
-        {errors.billingAddress && <div className="danger-text">{errors.billingAddress.message}</div>}
-      </div>
+        <div className="col-12 mt-1">
+          <Label htmlFor="billingAddress" required>Billing Address</Label>
+          <textarea id="billingAddress" className="form-control" {...register("billingAddress")} rows={2} />
+          {errors.billingAddress && <div className="danger-text">{errors.billingAddress.message}</div>}
+        </div>
 
-      <div className="col-12 mt-1">
-        <Label htmlFor="description">Description</Label>
-        <textarea id="description" className="form-control" {...register("description")} rows={2} />
-        {errors.description && <div className="danger-text">{errors.description.message}</div>}
-      </div>
+        <div className="col-12 mt-1">
+          <Label htmlFor="description">Description</Label>
+          <textarea id="description" className="form-control" {...register("description")} rows={2} />
+          {errors.description && <div className="danger-text">{errors.description.message}</div>}
+        </div>
 
-      <div className="col-sm-12">
-        <Label htmlFor="logImage">Logo Image</Label>
-        <LogoUpload
-          preview={logoPreview}
-          setPreview={setLogoPreview}
-          fileName={logoName}
-          setFileName={setLogoName}
-        />
-      </div>
+        <div className="col-sm-12">
+          <Label htmlFor="logImage">Logo Image</Label>
+          <LogoUpload
+            preview={logoPreview}
+            setPreview={setLogoPreview}
+            fileName={logoName}
+            setFileName={setLogoName}
+          />
+        </div>
 
-      <div className="d-flex justify-content-center gap-2 mt-3">
-        <button type="submit" disabled={isPending} className="btn btn-sm btn-primary">{isPending ? "Please Wait..." : "Submit"}</button>
-        <button type="button" disabled={isPending} className="btn btn-sm btn-secondary" onClick={onClose}>Cancel</button>
-      </div>
-    </form>
+        <div className="d-flex justify-content-center gap-2 mt-3">
+          <button type="submit" disabled={isPending} className="btn btn-sm btn-primary">{isPending ? "Please Wait..." : "Submit"}</button>
+          <button type="button" disabled={isPending} className="btn btn-sm btn-secondary" onClick={onClose}>Cancel</button>
+        </div>
+      </form>
     </FormProvider>
   );
 };
diff --git a/src/components/Tenant/OrganizationInfo.jsx b/src/components/Tenant/OrganizationInfo.jsx
index b465c4e1..9607a524 100644
--- a/src/components/Tenant/OrganizationInfo.jsx
+++ b/src/components/Tenant/OrganizationInfo.jsx
@@ -48,7 +48,7 @@ const OrganizationInfo = ({ onNext, onPrev, onSubmitTenant }) => {
       const data = getValues();
       // onSubmitTenant(data);
       // onNext();
-      const tenantPayload = {...data,onBoardingDate:  moment.utc(data.onBoardingDate, "DD-MM-YYYY").toISOString() }
+      const tenantPayload = { ...data, onBoardingDate: moment.utc(data.onBoardingDate, "DD-MM-YYYY").toISOString() }
       CreateTenant(tenantPayload);
     }
   };
@@ -73,7 +73,7 @@ const OrganizationInfo = ({ onNext, onPrev, onSubmitTenant }) => {
       </div>
 
       <div className="col-sm-6">
-        <Label htmlFor="officeNumber" required>
+        <Label htmlFor="officeNumber" >
           Office Number
         </Label>
         <input
@@ -87,7 +87,7 @@ const OrganizationInfo = ({ onNext, onPrev, onSubmitTenant }) => {
       </div>
 
       <div className="col-sm-6">
-        <Label htmlFor="domainName" required>
+        <Label htmlFor="domainName" >
           Domain Name
         </Label>
         <input
@@ -101,7 +101,7 @@ const OrganizationInfo = ({ onNext, onPrev, onSubmitTenant }) => {
       </div>
 
       <div className="col-sm-6">
-        <Label htmlFor="taxId" required>
+        <Label htmlFor="taxId" >
           Tax ID
         </Label>
         <input
@@ -138,8 +138,10 @@ const OrganizationInfo = ({ onNext, onPrev, onSubmitTenant }) => {
         </Label>
 
         <select
-          className="form-select form-select-sm"
-          {...register("organizationSize")}
+          id="organizationSize"
+          className="form-select shadow-none border py-1 px-2"
+          style={{ fontSize: "0.875rem" }} // Bootstrap's small text size
+          {...register("organizationSize", { required: "Organization size is required" })}
         >
           {orgSize.map((org) => (
             <option key={org.val} value={org.val}>
@@ -147,17 +149,20 @@ const OrganizationInfo = ({ onNext, onPrev, onSubmitTenant }) => {
             </option>
           ))}
         </select>
+
         {errors.organizationSize && (
           <div className="danger-text">{errors.organizationSize.message}</div>
         )}
       </div>
 
+
       <div className="col-sm-6">
         <Label htmlFor="industryId" required>
           Industry
         </Label>
         <select
-          className="form-select form-select-sm"
+          id="industryId"
+          className="form-select shadow-none border py-1 px-2 small"
           {...register("industryId")}
         >
           {industryLoading ? (
@@ -177,9 +182,9 @@ const OrganizationInfo = ({ onNext, onPrev, onSubmitTenant }) => {
 
       <div className="col-sm-6">
         <Label htmlFor="reference">Reference</Label>
- 
         <select
-          className="form-select form-select-sm"
+          id="reference"
+          className="form-select shadow-none border py-1 px-2 small"
           {...register("reference")}
         >
           {reference.map((org) => (
@@ -193,6 +198,7 @@ const OrganizationInfo = ({ onNext, onPrev, onSubmitTenant }) => {
         )}
       </div>
 
+
       <div className="col-sm-12">
         <Label htmlFor="description">Description</Label>
         <textarea
diff --git a/src/components/Tenant/TenantFilterPanel.jsx b/src/components/Tenant/TenantFilterPanel.jsx
index 97be13b5..8815ff37 100644
--- a/src/components/Tenant/TenantFilterPanel.jsx
+++ b/src/components/Tenant/TenantFilterPanel.jsx
@@ -1,5 +1,5 @@
 import { zodResolver } from "@hookform/resolvers/zod";
-import React, { useState,useCallback } from "react";
+import React, { useState, useCallback, useEffect } from "react";
 import { FormProvider, useForm, useFormContext } from "react-hook-form";
 import { defaultFilterValues, filterSchema } from "./TenantSchema";
 import Label from "../common/Label";
@@ -8,15 +8,16 @@ import { useIndustries } from "../../hooks/useTenant";
 import { reference, TENANT_STATUS } from "../../utils/constants";
 import { DateRangePicker1 } from "../common/DateRangePicker";
 import moment from "moment";
+import { useLocation } from "react-router-dom";
+
+const TenantFilterPanel = ({ onApply }) => {
+  const [resetKey, setResetKey] = useState(0);
 
-const TenantFilterPanel = ({onApply}) => {
-const [resetKey, setResetKey] = useState(0);
-  
   const methods = useForm({
     resolver: zodResolver(filterSchema),
     defaultValues: defaultFilterValues,
   });
-  
+
   const { handleSubmit, reset } = methods;
   const { data: industries = [], isLoading } = useIndustries();
 
@@ -36,6 +37,13 @@ const [resetKey, setResetKey] = useState(0);
     [onApply, handleClosePanel]
   );
 
+
+  // ✅ Close popup when navigating to another component
+  const location = useLocation();
+  useEffect(() => {
+    handleClosePanel();
+  }, [location]);
+
   const onClear = useCallback(() => {
     reset(defaultFilterValues);
     setResetKey((prev) => prev + 1); // triggers DateRangePicker reset
@@ -48,44 +56,44 @@ const [resetKey, setResetKey] = useState(0);
 
   return (
     <FormProvider {...methods}>
-      <form  onSubmit={handleSubmit(onSubmit)}>
+      <form onSubmit={handleSubmit(onSubmit)}>
         <div className="text-start mb-1">
           <div className="text-start my-2">
-             <DateRangePicker1
-            placeholder="DD-MM-YYYY To DD-MM-YYYY"
-            startField="startDate"
-            endField="endDate"
-            resetSignal={resetKey}
-            defaultRange={false}
-          />
+            <DateRangePicker1
+              placeholder="DD-MM-YYYY To DD-MM-YYYY"
+              startField="startDate"
+              endField="endDate"
+              resetSignal={resetKey}
+              defaultRange={false}
+            />
           </div>
           <div className="text-strat mb-2">
             <SelectMultiple
-            name="industryIds"
-            label="Industries"
-            options={industries}
-            labelKey="name"
-            valueKey="id"
-          />
+              name="industryIds"
+              label="Industries"
+              options={industries}
+              labelKey="name"
+              valueKey="id"
+            />
           </div>
-          
+
           <div className="text-start mb-2">
             <SelectMultiple
-            name="references"
-            label="References"
-            options={reference}
-            labelKey="name"
-            valueKey="val"
-          />
+              name="references"
+              label="References"
+              options={reference}
+              labelKey="name"
+              valueKey="val"
+            />
           </div>
-           <div className="text-start">
+          <div className="text-start">
             <SelectMultiple
-            name="tenantStatusIds"
-            label="Tenant Status"
-            options={TENANT_STATUS}
-            labelKey="name"
-            valueKey="id"
-          />
+              name="tenantStatusIds"
+              label="Tenant Status"
+              options={TENANT_STATUS}
+              labelKey="name"
+              valueKey="id"
+            />
           </div>
           {/* <SelectMultiple
               name="references"
@@ -100,7 +108,7 @@ const [resetKey, setResetKey] = useState(0);
             type="button"
             className="btn btn-secondary btn-xs"
             onClick={onClear}
-            
+
           >
             Clear
           </button>
diff --git a/src/components/Tenant/TenantSchema.js b/src/components/Tenant/TenantSchema.js
index 208f7c01..a9be211c 100644
--- a/src/components/Tenant/TenantSchema.js
+++ b/src/components/Tenant/TenantSchema.js
@@ -2,34 +2,34 @@ import { z } from "zod";
 
 export const newTenantSchema = z.object({
   firstName: z
-  .string().trim()
-  .min(1, { message: "First Name is required!" })
-  .regex(/^[A-Za-z]+$/, { message: "First Name should contain only letters!" }),
+    .string().trim()
+    .min(1, { message: "First Name is required!" })
+    .regex(/^[A-Za-z]+$/, { message: "First Name should contain only letters!" }),
   lastName: z
-  .string().trim()
-  .min(1, { message: "Last Name is required!" })
-  .regex(/^[A-Za-z]+$/, { message: "Last Name should contain only letters!" }),
+    .string().trim()
+    .min(1, { message: "Last Name is required!" })
+    .regex(/^[A-Za-z]+$/, { message: "Last Name should contain only letters!" }),
   email: z.string().trim().email("Invalid email address"),
   description: z.string().trim().optional(),
-  domainName: z.string().trim().nonempty("Domain name is required"),
+  domainName: z.string().trim().optional(),
   billingAddress: z.string().trim().nonempty("Billing address is required"),
-  taxId: z.string().trim().nonempty("Tax ID is required"),
+  taxId: z.string().trim().optional(),
   logoImage: z.string().trim().optional(),
   organizationName: z.string().trim().nonempty("Organization name is required"),
-  officeNumber: z.string().trim().nonempty("Office number is required"),
-  contactNumber:  z.string().trim()
-  .nonempty("Contact number is required")
-  .regex(/^\+?[1-9]\d{7,14}$/, "Enter a valid contact number"),
+  officeNumber: z.string().trim().optional(),
+  contactNumber: z.string().trim()
+    .nonempty("Contact number is required")
+    .regex(/^\+?[1-9]\d{7,14}$/, "Enter a valid contact number"),
   onBoardingDate: z.preprocess((val) => {
-  if (typeof val === "string" && val.includes("-")) {
-    const [day, month, year] = val.split("-");
-    return new Date(`${year}-${month}-${day}`);
-  }
-  return val;
-}, z.date({
-  required_error: "Onboarding date is required",
-  invalid_type_error: "Invalid date format",
-})),
+    if (typeof val === "string" && val.includes("-")) {
+      const [day, month, year] = val.split("-");
+      return new Date(`${year}-${month}-${day}`);
+    }
+    return val;
+  }, z.date({
+    required_error: "Onboarding date is required",
+    invalid_type_error: "Invalid date format",
+  })),
   organizationSize: z.string().nonempty("Organization size is required"),
   industryId: z.string().uuid("Invalid industry ID"),
   reference: z.string().nonempty("Reference is required"),
@@ -71,8 +71,8 @@ export const getSubscriptionSchema = (minUsers) =>
 
 export const subscriptionDefaultValues = {
   // tenantId: "",     
-  planId: "",        
-  currencyId: "",   
+  planId: "",
+  currencyId: "",
   maxUsers: 1,
   frequency: 1,
   isTrial: false,
@@ -84,8 +84,8 @@ export const filterSchema = z.object({
   // createdByIds: z.array(z.string()).optional(),
   tenantStatusIds: z.array(z.string()).optional(),
   references: z.array(z.string()).optional(),
-  startDate: z.string().optional(), 
-  endDate: z.string().optional(),  
+  startDate: z.string().optional(),
+  endDate: z.string().optional(),
 });
 export const defaultFilterValues = {
   industryIds: [],
@@ -133,23 +133,23 @@ export const getStepFields = (stepIndex) => {
 
 export const EditTenant = z.object({
   firstName: z
-  .string().trim()
-  .min(1, { message: "First Name is required!" })
-  .regex(/^[A-Za-z]+$/, { message: "First Name should contain only letters!" }),
-lastName: z
-  .string().trim()
-  .min(1, { message: "Last Name is required!" })
-  .regex(/^[A-Za-z]+$/, { message: "Last Name should contain only letters!" }),
+    .string().trim()
+    .min(1, { message: "First Name is required!" })
+    .regex(/^[A-Za-z]+$/, { message: "First Name should contain only letters!" }),
+  lastName: z
+    .string().trim()
+    .min(1, { message: "Last Name is required!" })
+    .regex(/^[A-Za-z]+$/, { message: "Last Name should contain only letters!" }),
   description: z.string().trim().optional(),
-  domainName: z.string().trim().min(1, { message: "Domain Name is required!" }),
+  domainName: z.string().trim().optional(),
   billingAddress: z.string().trim().min(1, { message: "Billing Address is required!" }),
-  taxId: z.string().trim().min(1, { message: "Tax ID is required!" }),
+  taxId: z.string().trim().optional(),
   logoImage: z.string().optional(),
-  officeNumber: z.string().trim().min(1, { message: "Office Number is required!" }),
+  officeNumber: z.string().trim().optional(),
   contactNumber: z.string().trim()
-  .nonempty("Contact number is required")
-  .regex(/^\+?[1-9]\d{7,14}$/, "Enter a valid contact number"),
+    .nonempty("Contact number is required")
+    .regex(/^\+?[1-9]\d{7,14}$/, "Enter a valid contact number"),
   organizationSize: z.string().min(1, { message: "Organization Size is required!" }),
-  industryId: z.string().min(1,{ message: "Invalid Industry ID!" }),
+  industryId: z.string().min(1, { message: "Invalid Industry ID!" }),
   reference: z.string().optional(),
 });
diff --git a/src/components/common/DateRangePicker.jsx b/src/components/common/DateRangePicker.jsx
index 9b7505fe..2dce634b 100644
--- a/src/components/common/DateRangePicker.jsx
+++ b/src/components/common/DateRangePicker.jsx
@@ -46,6 +46,12 @@ const DateRangePicker = ({
     };
   }, [onRangeChange, DateDifference, endDateMode]);
 
+  const handleIconClick = () => {
+    if (inputRef.current) {
+      inputRef.current._flatpickr.open(); // directly opens flatpickr
+    }
+  };
+
   return (
     <div className={`col-${sm} col-sm-${md} px-1`}>
       <input
@@ -57,7 +63,7 @@ const DateRangePicker = ({
       />
 
       <i
-        className="bx bx-calendar calendar-icon cursor-pointer position-relative top-50  translate-middle-y "
+        className="bx bx-calendar calendar-icon cursor-pointer position-relative top-50  translate-middle-y " onClick={handleIconClick}
         style={{ right: "22px", bottom: "-8px" }}
       ></i>
     </div>
@@ -77,7 +83,7 @@ export const DateRangePicker1 = ({
   className = "",
   allowText = false,
   resetSignal,
-  defaultRange = true, 
+  defaultRange = true,
   ...rest
 }) => {
   const inputRef = useRef(null);
diff --git a/src/components/common/FilterIcon.jsx b/src/components/common/FilterIcon.jsx
index 1c91a693..922af101 100644
--- a/src/components/common/FilterIcon.jsx
+++ b/src/components/common/FilterIcon.jsx
@@ -1,4 +1,5 @@
 import React, { useState, useEffect } from "react";
+import { useSelector } from "react-redux";
 
 const FilterIcon = ({
   taskListData,
@@ -7,15 +8,26 @@ const FilterIcon = ({
   currentSelectedFloors,
   currentSelectedActivities,
 }) => {
+  const selectedProject = useSelector((store) => store.localVariables.projectId);
+
   const [selectedBuilding, setSelectedBuilding] = useState(currentSelectedBuilding || "");
   const [selectedFloors, setSelectedFloors] = useState(currentSelectedFloors || []);
   const [selectedActivities, setSelectedActivities] = useState(currentSelectedActivities || []);
 
+  const [appliedBuilding, setAppliedBuilding] = useState(currentSelectedBuilding || "");
+  const [appliedFloors, setAppliedFloors] = useState(currentSelectedFloors || []);
+  const [appliedActivities, setAppliedActivities] = useState(currentSelectedActivities || []);
+
+  // Reset filters whenever inputs OR projectId changes
   useEffect(() => {
     setSelectedBuilding(currentSelectedBuilding || "");
     setSelectedFloors(currentSelectedFloors || []);
     setSelectedActivities(currentSelectedActivities || []);
-  }, [currentSelectedBuilding, currentSelectedFloors, currentSelectedActivities]);
+
+    setAppliedBuilding(currentSelectedBuilding || "");
+    setAppliedFloors(currentSelectedFloors || []);
+    setAppliedActivities(currentSelectedActivities || []);
+  }, [currentSelectedBuilding, currentSelectedFloors, currentSelectedActivities, selectedProject]);
 
   const getUniqueFilterValues = (key, overrideBuilding, overrideFloors) => {
     if (!taskListData) return [];
@@ -61,12 +73,11 @@ const FilterIcon = ({
     } else if (filterType === "floor") {
       if (updatedFloors.includes(value)) {
         updatedFloors = updatedFloors.filter((floor) => floor !== value);
+        const validActivities = getUniqueFilterValues("activity", updatedBuilding, updatedFloors);
+        updatedActivities = updatedActivities.filter((act) => validActivities.includes(act));
       } else {
         updatedFloors.push(value);
       }
-
-      const validActivities = getUniqueFilterValues("activity", updatedBuilding, updatedFloors);
-      updatedActivities = updatedActivities.filter((act) => validActivities.includes(act));
     } else if (filterType === "activity") {
       if (updatedActivities.includes(value)) {
         updatedActivities = updatedActivities.filter((act) => act !== value);
@@ -78,12 +89,20 @@ const FilterIcon = ({
     setSelectedBuilding(updatedBuilding);
     setSelectedFloors(updatedFloors);
     setSelectedActivities(updatedActivities);
+  };
+
+  const applyFilters = () => {
+    setAppliedBuilding(selectedBuilding);
+    setAppliedFloors(selectedFloors);
+    setAppliedActivities(selectedActivities);
 
     onApplyFilters({
-      selectedBuilding: updatedBuilding,
-      selectedFloors: updatedFloors,
-      selectedActivities: updatedActivities,
+      selectedBuilding,
+      selectedFloors,
+      selectedActivities,
     });
+
+    document.getElementById("filterDropdown").click();
   };
 
   const clearAllFilters = () => {
@@ -91,6 +110,10 @@ const FilterIcon = ({
     setSelectedFloors([]);
     setSelectedActivities([]);
 
+    setAppliedBuilding("");
+    setAppliedFloors([]);
+    setAppliedActivities([]);
+
     onApplyFilters({
       selectedBuilding: "",
       selectedFloors: [],
@@ -98,21 +121,51 @@ const FilterIcon = ({
     });
   };
 
+  // Count applied filters
+  const appliedFilterCount =
+    (appliedBuilding ? 1 : 0) + appliedFloors.length + appliedActivities.length;
+
   return (
-    <div className="dropdown" style={{marginLeft:"-14px"}}>
+    <div className="dropdown" style={{ marginLeft: "-14px", position: "relative" }}>
       <a
         className="dropdown-toggle hide-arrow cursor-pointer"
         id="filterDropdown"
         data-bs-toggle="dropdown"
         aria-expanded="false"
       >
-        {/* <i className="bx bx-slider-alt ms-1" /> */}
-        <i
-          className="bx bx-slider-alt"
-          style={{ color: selectedBuilding || selectedFloors.length > 0 || selectedActivities.length > 0 ? "#7161EF" : "gray" }}
-        ></i>
-
+        <div style={{ position: "relative", display: "inline-block" }}>
+          <i
+            className="bx bx-slider-alt"
+            style={{
+              color: appliedFilterCount > 0 ? "#7161EF" : "gray",
+              fontSize: "20px",
+            }}
+          ></i>
+          {appliedFilterCount > 0 && (
+            <span
+              style={{
+                position: "absolute",
+                top: "-11px",
+                right: "-6px",
+                backgroundColor: "#FFC107", // yellow
+                color: "white",
+                fontSize: "10px",
+                fontWeight: "bold",
+                borderRadius: "50%",
+                width: "18px",
+                height: "18px",
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                border: "1px solid white",
+              }}
+            >
+              {appliedFilterCount}
+            </span>
+          )}
+        </div>
       </a>
+
       <ul
         className="dropdown-menu p-2 mt-2"
         aria-labelledby="filterDropdown"
@@ -205,45 +258,30 @@ const FilterIcon = ({
         )}
 
         {/* Action Buttons */}
-        <li><hr className="my-1" /></li>
-        {(selectedBuilding || selectedFloors.length > 0 || selectedActivities.length > 0) && (
-          <li className="d-flex justify-content-end gap-2 px-2">
+        <li>
+          <hr className="my-1" />
+        </li>
+        {(appliedFilterCount > 0 ||
+          selectedBuilding ||
+          selectedFloors.length > 0 ||
+          selectedActivities.length > 0) && (
+          <li className="d-flex justify-content-end gap-2 px-2 mt-2 mb-2">
             <button
               type="button"
-              className="btn btn-sm"
-              style={{
-                backgroundColor: "#7161EF",
-                color: "white",
-                fontSize: "13px",
-                padding: "4px 16px",
-                borderRadius: "8px",
-                boxShadow: "0 1px 4px rgba(0,0,0,0.1)"
-              }}
+              className="btn btn-secondary btn-sm py-0 px-2"
               onClick={clearAllFilters}
             >
               Clear
             </button>
             <button
               type="button"
-              className="btn btn-sm"
-              style={{
-                backgroundColor: "#7161EF",
-                color: "white",
-                fontSize: "13px",
-                padding: "4px 16px",
-                borderRadius: "8px",
-                boxShadow: "0 1px 4px rgba(0,0,0,0.1)"
-              }}
-              onClick={() => {
-                document.getElementById("filterDropdown").click();
-              }}
+              className="btn btn-primary btn-sm py-0 px-2"
+              onClick={applyFilters}
             >
               Apply
             </button>
           </li>
         )}
-
-
       </ul>
     </div>
   );
diff --git a/src/components/master/CreateActivity.jsx b/src/components/master/CreateActivity.jsx
index bb366c9c..79f8ec3b 100644
--- a/src/components/master/CreateActivity.jsx
+++ b/src/components/master/CreateActivity.jsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect,useCallback } from "react";
+import React, { useState, useEffect, useCallback } from "react";
 import { useFieldArray, useForm } from "react-hook-form";
 import { z } from "zod";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -7,7 +7,7 @@ import { MasterRespository } from "../../repositories/MastersRepository";
 import { clearApiCacheKey } from "../../slices/apiCacheSlice";
 import { getCachedData, cacheData } from "../../slices/apiDataManager";
 import showToast from "../../services/toastService";
-import {useCreateActivity} from "../../hooks/masterHook/useMaster";
+import { useCreateActivity } from "../../hooks/masterHook/useMaster";
 
 const schema = z.object({
   activityName: z.string().min(1, { message: "Activity Name is required" }),
@@ -24,74 +24,74 @@ const schema = z.object({
 });
 
 const CreateActivity = ({ onClose }) => {
-const maxDescriptionLength = 255;
-const { mutate: createActivity, isPending: isLoading } = useCreateActivity(() => onClose?.());
+  const maxDescriptionLength = 255;
+  const { mutate: createActivity, isPending: isLoading } = useCreateActivity(() => onClose?.());
 
-const {
-  register,
-  handleSubmit,
-  control,
-  setValue,
-  clearErrors,
-  setError,
-  getValues,
-  reset,
-  formState: { errors },
-} = useForm({
-  resolver: zodResolver(schema),
-  defaultValues: {
-    activityName: "",
-    unitOfMeasurement: "",
-    checkList: [],
-  },
-});
+  const {
+    register,
+    handleSubmit,
+    control,
+    setValue,
+    clearErrors,
+    setError,
+    getValues,
+    reset,
+    formState: { errors },
+  } = useForm({
+    resolver: zodResolver(schema),
+    defaultValues: {
+      activityName: "",
+      unitOfMeasurement: "",
+      checkList: [],
+    },
+  });
 
-const {
-  fields: checkListItems,
-  append,
-  remove,
-} = useFieldArray({
-  control,
-  name: "checkList",
-});
+  const {
+    fields: checkListItems,
+    append,
+    remove,
+  } = useFieldArray({
+    control,
+    name: "checkList",
+  });
 
-const addChecklistItem = useCallback(() => {
-  const values = getValues("checkList");
-  const lastIndex = checkListItems.length - 1;
+  const addChecklistItem = useCallback(() => {
+    const values = getValues("checkList");
+    const lastIndex = checkListItems.length - 1;
 
-  if (
-    checkListItems.length > 0 &&
-    (!values?.[lastIndex] || values[lastIndex].description.trim() === "")
-  ) {
-    setError(`checkList.${lastIndex}.description`, {
-      type: "manual",
-      message: "Please fill this checklist item before adding another.",
-    });
-    return;
-  }
+    if (
+      checkListItems.length > 0 &&
+      (!values?.[lastIndex] || values[lastIndex].description.trim() === "")
+    ) {
+      setError(`checkList.${lastIndex}.description`, {
+        type: "manual",
+        message: "Please fill this checklist item before adding another.",
+      });
+      return;
+    }
 
-  clearErrors(`checkList.${lastIndex}.description`);
-  append({ id: null, description: "", isMandatory: false });
-}, [checkListItems, getValues, append, setError, clearErrors]);
+    clearErrors(`checkList.${lastIndex}.description`);
+    append({ id: null, description: "", isMandatory: false });
+  }, [checkListItems, getValues, append, setError, clearErrors]);
 
-const removeChecklistItem = useCallback((index) => {
-  remove(index);
-}, [remove]);
+  const removeChecklistItem = useCallback((index) => {
+    remove(index);
+  }, [remove]);
 
-const handleChecklistChange = useCallback((index, value) => {
-  setValue(`checkList.${index}`, value);
-}, [setValue]);
+  const handleChecklistChange = useCallback((index, value) => {
+    setValue(`checkList.${index}`, value);
+  }, [setValue]);
 
-const onSubmit = (formData) => {
-  createActivity(formData);
-};
+  const onSubmit = (formData) => {
+    createActivity(formData);
+  };
   // const onSubmit = (data) => {
   //   setIsLoading(true);
 
   //   MasterRespository.createActivity(data)
   //     .then( ( resp ) =>
   //     {
-        
+
   //       const cachedData = getCachedData("Activity");
   //       const updatedData = [ ...cachedData, resp?.data ];
   //       cacheData("Activity", updatedData);
@@ -104,15 +104,15 @@ const onSubmit = (formData) => {
   //       setIsLoading(false);
   //     });
   // };
-const handleClose = useCallback(() => {
-  reset();
-  onClose();
-}, [reset, onClose]);
+  const handleClose = useCallback(() => {
+    reset();
+    onClose();
+  }, [reset, onClose]);
 
-useEffect(() => {
-  const tooltipTriggerList = Array.from(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
-  tooltipTriggerList.forEach((el) => new bootstrap.Tooltip(el));
-}, []);
+  useEffect(() => {
+    const tooltipTriggerList = Array.from(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
+    tooltipTriggerList.forEach((el) => new bootstrap.Tooltip(el));
+  }, []);
 
   return (
     <form onSubmit={handleSubmit(onSubmit)}>
@@ -123,9 +123,8 @@ useEffect(() => {
           <input
             type="text"
             {...register("activityName")}
-            className={`form-control form-control-sm ${
-              errors.activityName ? "is-invalid" : ""
-            }`}
+            className={`form-control form-control-sm ${errors.activityName ? "is-invalid" : ""
+              }`}
           />
           {errors.activityName && (
             <p className="danger-text">{errors.activityName.message}</p>
@@ -137,9 +136,8 @@ useEffect(() => {
           <input
             type="text"
             {...register("unitOfMeasurement")}
-            className={`form-control form-control-sm ${
-              errors.unitOfMeasurement ? "is-invalid" : ""
-            }`}
+            className={`form-control form-control-sm ${errors.unitOfMeasurement ? "is-invalid" : ""
+              }`}
           />
           {errors.unitOfMeasurement && (
             <p className="danger-text">{errors.unitOfMeasurement.message}</p>
@@ -147,68 +145,68 @@ useEffect(() => {
         </div>
 
         <div className="col-md-12 text-start mt-1">
-          <p className="py-1 my-0">{checkListItems.length > 0 ? "Check List" : "Add Check List" }</p>
+          <p className="py-1 my-0">{checkListItems.length > 0 ? "Check List" : "Add Check List"}</p>
           {checkListItems.length > 0 && (
-          <table className="table mt-1  border-0">
-            <thead className="py-0 my-0 table-border-top-0">
-              <tr className="py-1">
-                <th colSpan={2} className="py-1">
-                  <small>Name</small>
-                </th>
-                <th colSpan={2} className="py-1 text-center">
-                  <small>Is Mandatory</small>
-                </th>
-                <th className="text-center py-1">Action</th>
-              </tr>
-            </thead>
-            <tbody className="table-border-bottom-0 ">
-              {checkListItems.map((item, index) => (
-                <tr key={index} className="border-top-0">
-                  <td colSpan={2} className="border-top-0 border-0">
-                    <input
-                      className="d-none"
-                      {...register(`checkList.${index}.id`)}
-                    ></input>
-                    <input
-                      {...register(`checkList.${index}.description`)}
-                      className="form-control form-control-sm"
-                      placeholder={`Checklist item ${index + 1}`}
-                      onChange={(e) =>
-                        handleChecklistChange(index, e.target.value)
-                      }
-                    />
-                    {errors.checkList?.[index]?.description && (
-                      <small
-                        style={{ fontSize: "10px" }}
-                        className="danger-text"
-                      >
-                        {errors.checkList[index]?.description?.message}
-                      </small>
-                    )}
-                  </td>
-                  <td colSpan={2} className="text-center border-0">
-                    <input
-                      className="form-check-input"
-                      type="checkbox"
-                      {...register(`checkList.${index}.isMandatory`)}
-                      defaultChecked={item.isMandatory}
-                    />
-                  </td>
-                  <td className="text-center border-0">
-                    <button
-                      type="button"
-                      onClick={() => removeChecklistItem(index)}
-                      className="btn btn-xs btn-icon btn-text-secondary"
-                    >
-                      <i className="bx bxs-minus-circle text-danger"  data-bs-toggle="tooltip"
-                title="Remove Check"
-                data-bs-original-title="Remove check"></i>
-                    </button>
-                  </td>
+            <table className="table mt-1  border-0">
+              <thead className="py-0 my-0 table-border-top-0">
+                <tr className="py-1">
+                  <th colSpan={2} className="py-1">
+                    <small>Name</small>
+                  </th>
+                  <th colSpan={2} className="py-1 text-center">
+                    <small>Is Mandatory</small>
+                  </th>
+                  <th className="text-center py-1">Action</th>
                 </tr>
-              ))}
-            </tbody>
-          </table>
+              </thead>
+              <tbody className="table-border-bottom-0 ">
+                {checkListItems.map((item, index) => (
+                  <tr key={index} className="border-top-0">
+                    <td colSpan={2} className="border-top-0 border-0">
+                      <input
+                        className="d-none"
+                        {...register(`checkList.${index}.id`)}
+                      ></input>
+                      <input
+                        {...register(`checkList.${index}.description`)}
+                        className="form-control form-control-sm"
+                        placeholder={`Checklist item ${index + 1}`}
+                        onChange={(e) =>
+                          handleChecklistChange(index, e.target.value)
+                        }
+                      />
+                      {errors.checkList?.[index]?.description && (
+                        <small
+                          style={{ fontSize: "10px" }}
+                          className="danger-text"
+                        >
+                          {errors.checkList[index]?.description?.message}
+                        </small>
+                      )}
+                    </td>
+                    <td colSpan={2} className="text-center border-0">
+                      <input
+                        className="form-check-input"
+                        type="checkbox"
+                        {...register(`checkList.${index}.isMandatory`)}
+                        defaultChecked={item.isMandatory}
+                      />
+                    </td>
+                    <td className="text-center border-0">
+                      <button
+                        type="button"
+                        onClick={() => removeChecklistItem(index)}
+                        className="btn btn-xs btn-icon btn-text-secondary"
+                      >
+                        <i className="bx bxs-minus-circle text-danger" data-bs-toggle="tooltip"
+                          title="Remove Check"
+                          data-bs-original-title="Remove check"></i>
+                      </button>
+                    </td>
+                  </tr>
+                ))}
+              </tbody>
+            </table>
           )}
           <button
             type="button"
@@ -216,8 +214,8 @@ useEffect(() => {
             onClick={addChecklistItem}
           >
             <i className="bx bx-plus-circle" data-bs-toggle="tooltip"
-                title="Add Check"
-                data-bs-original-title="Add check" ></i>
+              title="Add Check"
+              data-bs-original-title="Add check" ></i>
           </button>
         </div>
 
@@ -226,12 +224,13 @@ useEffect(() => {
             {isLoading ? "Please Wait" : "Submit"}
           </button>
           <button
-            type="reset"
+            type="button"   // ✅ change to button
             className="btn btn-sm btn-label-secondary"
             onClick={handleClose}
           >
             Cancel
           </button>
+
         </div>
       </div>
     </form>
diff --git a/src/components/master/CreateContactCategory.jsx b/src/components/master/CreateContactCategory.jsx
index e5923c91..14707a76 100644
--- a/src/components/master/CreateContactCategory.jsx
+++ b/src/components/master/CreateContactCategory.jsx
@@ -1,43 +1,43 @@
-import React, { useEffect,useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { MasterRespository } from '../../repositories/MastersRepository';
 import { clearApiCacheKey } from '../../slices/apiCacheSlice';
-import { getCachedData,cacheData } from '../../slices/apiDataManager';
+import { getCachedData, cacheData } from '../../slices/apiDataManager';
 import showToast from '../../services/toastService';
-import {useCreateContactCategory} from '../../hooks/masterHook/useMaster';
+import { useCreateContactCategory } from '../../hooks/masterHook/useMaster';
 
 
 const schema = z.object({
   name: z.string().min(1, { message: "Category name is required" }),
   description: z.string().min(1, { message: "Description is required" })
-  .max(255, { message: "Description cannot exceed 255 characters" }),
+    .max(255, { message: "Description cannot exceed 255 characters" }),
 });
 
-const CreateContactCategory = ({onClose}) => {
+const CreateContactCategory = ({ onClose }) => {
 
-const {
-  register,
-  handleSubmit,
-  formState: { errors },
-  reset,
-} = useForm({
-  resolver: zodResolver(schema),
-  defaultValues: {
-    name: "",
-    description: "",
-  },
-});
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+    reset,
+  } = useForm({
+    resolver: zodResolver(schema),
+    defaultValues: {
+      name: "",
+      description: "",
+    },
+  });
 
-const [descriptionLength, setDescriptionLength] = useState(0);
-const maxDescriptionLength = 255;
+  const [descriptionLength, setDescriptionLength] = useState(0);
+  const maxDescriptionLength = 255;
 
-const { mutate: createContactCategory, isPending: isLoading } = useCreateContactCategory(() => onClose?.());
+  const { mutate: createContactCategory, isPending: isLoading } = useCreateContactCategory(() => onClose?.());
 
-const onSubmit = (payload) => {
-  createContactCategory(payload);
-};
+  const onSubmit = (payload) => {
+    createContactCategory(payload);
+  };
   //  const onSubmit = (data) => {
   //     setIsLoading(true)    
   //     MasterRespository.createContactCategory(data).then((resp)=>{ 
@@ -54,27 +54,27 @@ const onSubmit = (payload) => {
   //       setIsLoading(false)
   //     })
   //   };
-const resetForm = () => {
-  reset({ name: "", description: "" });
-  setDescriptionLength(0);
-};
+  const resetForm = () => {
+    reset({ name: "", description: "" });
+    setDescriptionLength(0);
+  };
+
+  useEffect(() => {
+    return () => resetForm();
+  }, []);
 
-useEffect(() => {
-  return () => resetForm();
-}, []);
- 
   return (<>
-    <form  className="row g-2" onSubmit={handleSubmit(onSubmit)}>
-        <div className="col-12 col-md-12">
-          <label className="form-label">Category Name</label>
-          <input type="text" 
-           {...register("name")} 
-             className={`form-control ${errors.name ? 'is-invalids' : ''}`}
-          />
-          {errors.name && <p className="text-danger">{errors.name.message}</p>}
-        </div> 
-        <div className="col-12 col-md-12">
-          <label className="form-label" htmlFor="description">Description</label>
+    <form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
+      <div className="col-12 col-md-12">
+        <label className="form-label">Category Name</label>
+        <input type="text"
+          {...register("name")}
+          className={`form-control ${errors.name ? 'is-invalids' : ''}`}
+        />
+        {errors.name && <p className="text-danger">{errors.name.message}</p>}
+      </div>
+      <div className="col-12 col-md-12">
+        <label className="form-label" htmlFor="description">Description</label>
         <textarea
           rows="3"
           {...register("description")}
@@ -87,28 +87,31 @@ useEffect(() => {
         <div className="text-end small text-muted">
           {maxDescriptionLength - descriptionLength} characters left
         </div>
-          {errors.description && (
-            <p className="text-danger">{errors.description.message}</p>
-          )}
-        </div>
+        {errors.description && (
+          <p className="text-danger">{errors.description.message}</p>
+        )}
+      </div>
 
-        <div className="col-12 text-center">
-        <button type="submit" className="btn btn-sm btn-primary me-3">           
-         {isLoading? "Please Wait...":"Submit"}       
+      <div className="col-12 text-center">
+        <button type="submit" className="btn btn-sm btn-primary me-3">
+          {isLoading ? "Please Wait..." : "Submit"}
         </button>
         <button
-          type="reset"
-          className="btn btn-sm btn-label-secondary "
-          data-bs-dismiss="modal"
-          aria-label="Close"
+          type="button"   // ✅ not reset
+          className="btn btn-sm btn-label-secondary"
+          onClick={() => {
+            resetForm();   // clear inputs
+            onClose?.();   // close modal from parent
+          }}
         >
           Cancel
         </button>
+
       </div>
-     
+
     </form>
- 
-    </>
+
+  </>
   )
 }
 
diff --git a/src/components/master/CreateContactTag.jsx b/src/components/master/CreateContactTag.jsx
index 28fe9ab3..20a53399 100644
--- a/src/components/master/CreateContactTag.jsx
+++ b/src/components/master/CreateContactTag.jsx
@@ -1,42 +1,42 @@
-import React, { useEffect,useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { MasterRespository } from '../../repositories/MastersRepository';
 import { clearApiCacheKey } from '../../slices/apiCacheSlice';
-import { getCachedData,cacheData } from '../../slices/apiDataManager';
+import { getCachedData, cacheData } from '../../slices/apiDataManager';
 import showToast from '../../services/toastService';
-import {useCreateContactTag} from '../../hooks/masterHook/useMaster';
+import { useCreateContactTag } from '../../hooks/masterHook/useMaster';
 
 
 const schema = z.object({
   name: z.string().min(1, { message: "Tag name is required" }),
   description: z.string().min(1, { message: "Description is required" })
-  .max(255, { message: "Description cannot exceed 255 characters" }),
+    .max(255, { message: "Description cannot exceed 255 characters" }),
 });
 
-const CreateContactTag = ({onClose}) => {
-const {
-  register,
-  handleSubmit,
-  formState: { errors },
-  reset,
-} = useForm({
-  resolver: zodResolver(schema),
-  defaultValues: {
-    name: "",
-    description: "",
-  },
-});
+const CreateContactTag = ({ onClose }) => {
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+    reset,
+  } = useForm({
+    resolver: zodResolver(schema),
+    defaultValues: {
+      name: "",
+      description: "",
+    },
+  });
 
-const [descriptionLength, setDescriptionLength] = useState(0);
-const maxDescriptionLength = 255;
+  const [descriptionLength, setDescriptionLength] = useState(0);
+  const maxDescriptionLength = 255;
 
-const { mutate: createContactTag, isPending: isLoading } = useCreateContactTag(() => onClose?.());
+  const { mutate: createContactTag, isPending: isLoading } = useCreateContactTag(() => onClose?.());
 
-const onSubmit = (payload) => {
-  createContactTag(payload);
-};
+  const onSubmit = (payload) => {
+    createContactTag(payload);
+  };
   //  const onSubmit = (data) => {
   //     setIsLoading(true)    
   //     MasterRespository.createContactTag(data).then((resp)=>{ 
@@ -54,27 +54,27 @@ const onSubmit = (payload) => {
   //       setIsLoading(false)
   //     })
   //   };
-const resetForm = () => {
-  reset({ name: "", description: "" });
-  setDescriptionLength(0);
-};
+  const resetForm = () => {
+    reset({ name: "", description: "" });
+    setDescriptionLength(0);
+  };
+
+  useEffect(() => {
+    return () => resetForm();
+  }, []);
 
-useEffect(() => {
-  return () => resetForm();
-}, []);
-  
   return (<>
-    <form  className="row g-2" onSubmit={handleSubmit(onSubmit)}>
-        <div className="col-12 col-md-12">
-          <label className="form-label">Tag Name</label>
-          <input type="text" 
-           {...register("name")} 
-             className={`form-control ${errors.name ? 'is-invalids' : ''}`}
-          />
-          {errors.name && <p className="text-danger">{errors.name.message}</p>}
-        </div> 
-        <div className="col-12 col-md-12">
-          <label className="form-label" htmlFor="description">Description</label>
+    <form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
+      <div className="col-12 col-md-12">
+        <label className="form-label">Tag Name</label>
+        <input type="text"
+          {...register("name")}
+          className={`form-control ${errors.name ? 'is-invalids' : ''}`}
+        />
+        {errors.name && <p className="text-danger">{errors.name.message}</p>}
+      </div>
+      <div className="col-12 col-md-12">
+        <label className="form-label" htmlFor="description">Description</label>
         <textarea
           rows="3"
           {...register("description")}
@@ -87,28 +87,31 @@ useEffect(() => {
         <div className="text-end small text-muted">
           {maxDescriptionLength - descriptionLength} characters left
         </div>
-          {errors.description && (
-            <p className="text-danger">{errors.description.message}</p>
-          )}
-        </div>
+        {errors.description && (
+          <p className="text-danger">{errors.description.message}</p>
+        )}
+      </div>
 
-        <div className="col-12 text-center">
-        <button type="submit" className="btn btn-sm btn-primary me-3">           
-         {isLoading? "Please Wait...":"Submit"}       
+      <div className="col-12 text-center">
+        <button type="submit" className="btn btn-sm btn-primary me-3">
+          {isLoading ? "Please Wait..." : "Submit"}
         </button>
         <button
-          type="reset"
-          className="btn btn-sm btn-label-secondary "
-          data-bs-dismiss="modal"
-          aria-label="Close"
+          type="button"   // ✅ not reset
+          className="btn btn-sm btn-label-secondary"
+          onClick={() => {
+            resetForm();   // clear inputs
+            onClose?.();   // close modal from parent
+          }}
         >
           Cancel
         </button>
+
       </div>
-     
+
     </form>
- 
-    </>
+
+  </>
   )
 }
 
diff --git a/src/components/master/CreateJobRole.jsx b/src/components/master/CreateJobRole.jsx
index 97f22ee2..8a907458 100644
--- a/src/components/master/CreateJobRole.jsx
+++ b/src/components/master/CreateJobRole.jsx
@@ -1,21 +1,21 @@
-import React, { useEffect,useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { MasterRespository } from '../../repositories/MastersRepository';
 import { clearApiCacheKey } from '../../slices/apiCacheSlice';
-import { getCachedData,cacheData } from '../../slices/apiDataManager';
+import { getCachedData, cacheData } from '../../slices/apiDataManager';
 import showToast from '../../services/toastService';
-import {useCreateJobRole} from '../../hooks/masterHook/useMaster';
+import { useCreateJobRole } from '../../hooks/masterHook/useMaster';
 
 
 const schema = z.object({
   role: z.string().min(1, { message: "Role is required" }),
   description: z.string().min(1, { message: "Description is required" })
-  .max(255, { message: "Description cannot exceed 255 characters" }),
+    .max(255, { message: "Description cannot exceed 255 characters" }),
 });
 
-const CreateJobRole = ({onClose}) => {
+const CreateJobRole = ({ onClose }) => {
 
   const maxDescriptionLength = 255;
   const [descriptionLength, setDescriptionLength] = useState(0);
@@ -39,34 +39,34 @@ const CreateJobRole = ({onClose}) => {
     setDescriptionLength(0);
   };
 
-  const { mutate: createJobRole, isPending:isLoading } = useCreateJobRole(() => {
+  const { mutate: createJobRole, isPending: isLoading } = useCreateJobRole(() => {
     onClose?.();
-  } );
+  });
 
 
-   // const onSubmit = (data) => {
-    //   setIsLoading(true)
-    //   const result = {
-    //     name: data.role,
-    //     description: data.description,
-    //   };
-    
-    //   MasterRespository.createJobRole(result).then((resp)=>{ 
-    //     setIsLoading(false)
-    //     resetForm()
-    //     const cachedData = getCachedData("Job Role"); 
-    //     const updatedData = [...cachedData, resp?.data]; 
-    //     cacheData("Job Role", updatedData); 
-    //     showToast("JobRole Added successfully.", "success");
+  // const onSubmit = (data) => {
+  //   setIsLoading(true)
+  //   const result = {
+  //     name: data.role,
+  //     description: data.description,
+  //   };
 
-    //     onClose()
-    //   }).catch((error)=>{
-    //     showToast(error.message, "error");
-    //     setIsLoading(false)
-    //   })
-   
-     
-    // };
+  //   MasterRespository.createJobRole(result).then((resp)=>{ 
+  //     setIsLoading(false)
+  //     resetForm()
+  //     const cachedData = getCachedData("Job Role"); 
+  //     const updatedData = [...cachedData, resp?.data]; 
+  //     cacheData("Job Role", updatedData); 
+  //     showToast("JobRole Added successfully.", "success");
+
+  //     onClose()
+  //   }).catch((error)=>{
+  //     showToast(error.message, "error");
+  //     setIsLoading(false)
+  //   })
+
+
+  // };
   const onSubmit = (data) => {
     const payload = {
       name: data.role,
@@ -87,20 +87,20 @@ const CreateJobRole = ({onClose}) => {
   }, []);
 
   return (<>
-    <form  className="row g-2" onSubmit={handleSubmit(onSubmit)}>
+    <form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
       {/* <div className="col-12 col-md-12">
         <label className="fs-5 text-dark text-center d-flex align-items-center justify-content-center flex-wrap">Create Job Role</label>
       </div> */}
-        <div className="col-12 col-md-12">
-          <label className="form-label">Role</label>
-          <input type="text" 
-           {...register("role")} 
-             className={`form-control ${errors.role ? 'is-invalids' : ''}`}
-          />
-          {errors.role && <p className="text-danger">{errors.role.message}</p>}
-        </div> 
-        <div className="col-12 col-md-12">
-          <label className="form-label" htmlFor="description">Description</label>
+      <div className="col-12 col-md-12">
+        <label className="form-label">Role</label>
+        <input type="text"
+          {...register("role")}
+          className={`form-control ${errors.role ? 'is-invalids' : ''}`}
+        />
+        {errors.role && <p className="text-danger">{errors.role.message}</p>}
+      </div>
+      <div className="col-12 col-md-12">
+        <label className="form-label" htmlFor="description">Description</label>
         <textarea
           rows="3"
           {...register("description")}
@@ -113,28 +113,31 @@ const CreateJobRole = ({onClose}) => {
         <div className="text-end small text-muted">
           {maxDescriptionLength - descriptionLength} characters left
         </div>
-          {errors.description && (
-            <p className="text-danger">{errors.description.message}</p>
-          )}
-        </div>
+        {errors.description && (
+          <p className="text-danger">{errors.description.message}</p>
+        )}
+      </div>
 
-        <div className="col-12 text-center">
-        <button type="submit" className="btn btn-sm btn-primary me-3">           
-         {isLoading? "Please Wait...":"Submit"}       
+      <div className="col-12 text-center">
+        <button type="submit" className="btn btn-sm btn-primary me-3">
+          {isLoading ? "Please Wait..." : "Submit"}
         </button>
         <button
-          type="reset"
-          className="btn btn-sm btn-label-secondary "
-          data-bs-dismiss="modal"
-          aria-label="Close"
+          type="button"   // ✅ change from reset → button
+          className="btn btn-sm btn-label-secondary"
+          onClick={() => {
+            resetForm();   // optional: clears form
+            onClose?.();   // ✅ close modal via parent
+          }}
         >
           Cancel
         </button>
+
       </div>
-     
+
     </form>
- 
-    </>
+
+  </>
   )
 }
 
diff --git a/src/components/master/CreateRole.jsx b/src/components/master/CreateRole.jsx
index 14ca6c15..5469e179 100644
--- a/src/components/master/CreateRole.jsx
+++ b/src/components/master/CreateRole.jsx
@@ -233,13 +233,13 @@ const CreateRole = ({ modalType, onClose }) => {
             {isLoading ? "Please Wait..." : "Submit"}
           </button>
           <button
-            type="reset"
+            type="button"
             className="btn btn-sm btn-label-secondary"
-            data-bs-dismiss="modal"
-            aria-label="Close"
+            onClick={onClose}
           >
             Cancel
           </button>
+
         </div>
       )}
     </form>
diff --git a/src/components/master/CreateWorkCategory.jsx b/src/components/master/CreateWorkCategory.jsx
index 81b2eab9..2be01a42 100644
--- a/src/components/master/CreateWorkCategory.jsx
+++ b/src/components/master/CreateWorkCategory.jsx
@@ -1,96 +1,96 @@
-import React, { useEffect,useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { MasterRespository } from '../../repositories/MastersRepository';
 import { clearApiCacheKey } from '../../slices/apiCacheSlice';
-import { getCachedData,cacheData } from '../../slices/apiDataManager';
+import { getCachedData, cacheData } from '../../slices/apiDataManager';
 import showToast from '../../services/toastService';
-import {useCreateWorkCategory} from '../../hooks/masterHook/useMaster';
+import { useCreateWorkCategory } from '../../hooks/masterHook/useMaster';
 
 
 const schema = z.object({
   name: z.string().min(1, { message: "Category name is required" }),
   description: z.string().min(1, { message: "Description is required" })
-  .max(255, { message: "Description cannot exceed 255 characters" }),
+    .max(255, { message: "Description cannot exceed 255 characters" }),
 });
 
-const CreateWorkCategory = ({onClose}) => {
+const CreateWorkCategory = ({ onClose }) => {
 
- const {
-  register,
-  handleSubmit,
-  formState: { errors },
-  reset,
-} = useForm({
-  resolver: zodResolver(schema),
-  defaultValues: {
-    name: "",
-    description: "",
-  },
-});
-
-const [descriptionLength, setDescriptionLength] = useState(0);
-const maxDescriptionLength = 255;
-
-const { mutate: createWorkCategory, isPending: isLoading } = useCreateWorkCategory(() => {
-  resetForm();
-  onClose?.();
-});
-
-const onSubmit = (payload) => {
- createWorkCategory(payload)
-  };
-  
-     // const onSubmit = (data) => {
-    //   setIsLoading(true)
- 
-    
-    //   MasterRespository.createWorkCategory(data).then((resp)=>{ 
-    //     setIsLoading(false)
-    //     resetForm()
-    //     const cachedData = getCachedData("Work Category"); 
-    //     const updatedData = [...cachedData, resp?.data]; 
-    //     cacheData("Work Category", updatedData); 
-    //     showToast("Work Category Added successfully.", "success");
-
-    //     onClose()
-    //   }).catch((error)=>{
-    //     showToast(error?.response?.data?.message, "error");
-    //     setIsLoading(false)
-    //   })
-   
-     
-    // };
-
-const resetForm = () => {
-  reset({
-    name: "",
-    description: "",
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+    reset,
+  } = useForm({
+    resolver: zodResolver(schema),
+    defaultValues: {
+      name: "",
+      description: "",
+    },
   });
-  setDescriptionLength(0);
-};
 
-useEffect(() => {
-  return () => resetForm(); 
-}, []);
- 
+  const [descriptionLength, setDescriptionLength] = useState(0);
+  const maxDescriptionLength = 255;
+
+  const { mutate: createWorkCategory, isPending: isLoading } = useCreateWorkCategory(() => {
+    resetForm();
+    onClose?.();
+  });
+
+  const onSubmit = (payload) => {
+    createWorkCategory(payload)
+  };
+
+  // const onSubmit = (data) => {
+  //   setIsLoading(true)
+
+
+  //   MasterRespository.createWorkCategory(data).then((resp)=>{ 
+  //     setIsLoading(false)
+  //     resetForm()
+  //     const cachedData = getCachedData("Work Category"); 
+  //     const updatedData = [...cachedData, resp?.data]; 
+  //     cacheData("Work Category", updatedData); 
+  //     showToast("Work Category Added successfully.", "success");
+
+  //     onClose()
+  //   }).catch((error)=>{
+  //     showToast(error?.response?.data?.message, "error");
+  //     setIsLoading(false)
+  //   })
+
+
+  // };
+
+  const resetForm = () => {
+    reset({
+      name: "",
+      description: "",
+    });
+    setDescriptionLength(0);
+  };
+
+  useEffect(() => {
+    return () => resetForm();
+  }, []);
+
   return (<>
-    <form  className="row g-2" onSubmit={handleSubmit(onSubmit)}>
+    <form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
+      {/* <div className="col-12 col-md-12">
+        <label className="fs-5 text-dark text-center d-flex align-items-center justify-content-center flex-wrap">Create Work Category</label>
+      </div> */}
+
       <div className="col-12 col-md-12">
-        <label className="fs-5 text-dark text-center d-flex align-items-center justify-content-center flex-wrap">Create Work Category</label>        
+        <label className="form-label">Category Name</label>
+        <input type="text"
+          {...register("name")}
+          className={`form-control ${errors.name ? 'is-invalids' : ''}`}
+        />
+        {errors.name && <p className="text-danger">{errors.name.message}</p>}
       </div>
-      
-        <div className="col-12 col-md-12">
-          <label className="form-label">Category Name</label>
-          <input type="text" 
-           {...register("name")} 
-             className={`form-control ${errors.name ? 'is-invalids' : ''}`}
-          />
-          {errors.name && <p className="text-danger">{errors.name.message}</p>}
-        </div> 
-        <div className="col-12 col-md-12">
-          <label className="form-label" htmlFor="description">Description</label>
+      <div className="col-12 col-md-12">
+        <label className="form-label" htmlFor="description">Description</label>
         <textarea
           rows="3"
           {...register("description")}
@@ -103,28 +103,30 @@ useEffect(() => {
         <div className="text-end small text-muted">
           {maxDescriptionLength - descriptionLength} characters left
         </div>
-          {errors.description && (
-            <p className="text-danger">{errors.description.message}</p>
-          )}
-        </div>
+        {errors.description && (
+          <p className="text-danger">{errors.description.message}</p>
+        )}
+      </div>
 
-        <div className="col-12 text-center">
-        <button type="submit" className="btn btn-sm btn-primary me-3">           
-         {isLoading? "Please Wait...":"Submit"}       
+      <div className="col-12 text-center">
+        <button type="submit" className="btn btn-sm btn-primary me-3">
+          {isLoading ? "Please Wait..." : "Submit"}
         </button>
         <button
-          type="reset"
-          className="btn btn-sm btn-label-secondary "
-          data-bs-dismiss="modal"
-          aria-label="Close"
+          type="button"   // ✅ not reset
+          className="btn btn-sm btn-label-secondary"
+          onClick={() => {
+            resetForm();   // clear inputs
+            onClose?.();   // close modal from parent
+          }}
         >
           Cancel
         </button>
       </div>
-     
+
     </form>
- 
-    </>
+
+  </>
   )
 }
 
diff --git a/src/components/master/DeleteMaster.jsx b/src/components/master/DeleteMaster.jsx
index ca9998be..f6c877ec 100644
--- a/src/components/master/DeleteMaster.jsx
+++ b/src/components/master/DeleteMaster.jsx
@@ -34,13 +34,15 @@ const DeleteMaster = ({ master, onClose }) => {
           )}
         </button>
         <button
-          type="reset"
+          type="button"   // ✅ not reset
           className="btn btn-label-secondary"
-          data-bs-dismiss="modal"
-          aria-label="Close"
+          onClick={() => {
+            onClose?.(); // properly close modal
+          }}
         >
           Cancel
         </button>
+
       </div>
     </div>
   );
diff --git a/src/components/master/EditActivity.jsx b/src/components/master/EditActivity.jsx
index 61fcccf0..372c6377 100644
--- a/src/components/master/EditActivity.jsx
+++ b/src/components/master/EditActivity.jsx
@@ -241,7 +241,7 @@ useEffect(() => {
             {isLoading ? "Please Wait" : "Submit"}
           </button>
           <button
-            type="button"
+            type="button"   // ✅ change to button
             className="btn btn-sm btn-label-secondary"
             onClick={onClose}
           >
diff --git a/src/components/master/EditContactCategory.jsx b/src/components/master/EditContactCategory.jsx
index 5723eede..40e5b325 100644
--- a/src/components/master/EditContactCategory.jsx
+++ b/src/components/master/EditContactCategory.jsx
@@ -1,49 +1,49 @@
-import React, { useEffect,useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { MasterRespository } from '../../repositories/MastersRepository';
 import { clearApiCacheKey } from '../../slices/apiCacheSlice';
-import { getCachedData,cacheData } from '../../slices/apiDataManager';
+import { getCachedData, cacheData } from '../../slices/apiDataManager';
 import showToast from '../../services/toastService';
-import {useUpdateContactCategory} from '../../hooks/masterHook/useMaster';
+import { useUpdateContactCategory } from '../../hooks/masterHook/useMaster';
 
 
 const schema = z.object({
   name: z.string().min(1, { message: "Category name is required" }),
   description: z.string().min(1, { message: "Description is required" })
-  .max(255, { message: "Description cannot exceed 255 characters" }),
+    .max(255, { message: "Description cannot exceed 255 characters" }),
 });
 
-const EditContactCategory= ({data,onClose}) => {
-const {
-  register,
-  handleSubmit,
-  formState: { errors },
-  reset,
-} = useForm({
-  resolver: zodResolver(schema),
-  defaultValues: {
-    name: data?.name || "",
-    description: data?.description || "",
-  },
-});
+const EditContactCategory = ({ data, onClose }) => {
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+    reset,
+  } = useForm({
+    resolver: zodResolver(schema),
+    defaultValues: {
+      name: data?.name || "",
+      description: data?.description || "",
+    },
+  });
 
-const [descriptionLength, setDescriptionLength] = useState(data?.description?.length || 0);
-const maxDescriptionLength = 255;
+  const [descriptionLength, setDescriptionLength] = useState(data?.description?.length || 0);
+  const maxDescriptionLength = 255;
 
-const { mutate: updateContactCategory, isPending: isLoading } = useUpdateContactCategory(() => onClose?.());
+  const { mutate: updateContactCategory, isPending: isLoading } = useUpdateContactCategory(() => onClose?.());
 
-const onSubmit = (formData) => {
-  const payload = {
-    id: data?.id,
-    name: formData.name,
-    description: formData.description,
+  const onSubmit = (formData) => {
+    const payload = {
+      id: data?.id,
+      name: formData.name,
+      description: formData.description,
+    };
+
+    updateContactCategory({ id: data?.id, payload });
   };
-
-  updateContactCategory({id:data?.id,payload});
-  };
-    // const onSubmit = (formdata) => {
+  // const onSubmit = (formdata) => {
   //     setIsLoading(true)
   //     const result = {
   //       id:data?.id,
@@ -51,8 +51,8 @@ const onSubmit = (formData) => {
   //       description: formdata.description,  
   //     };
 
-     
-    
+
+
   //     MasterRespository.updateContactCategory(data?.id,result).then((resp)=>{
   //       setIsLoading(false) 
   //       showToast("Contact Category Updated successfully.", "success");
@@ -70,30 +70,30 @@ const onSubmit = (formData) => {
   //        showToast(error?.response?.data?.message, "error")
   //       setIsLoading(false)
   //     })
-     
+
   //   };
 
-const resetForm = () => {
-  reset({ name: "", description: "" });
-  setDescriptionLength(0);
-};
+  const resetForm = () => {
+    reset({ name: "", description: "" });
+    setDescriptionLength(0);
+  };
+
+  useEffect(() => {
+    return () => resetForm();
+  }, []);
 
-useEffect(() => {
-  return () => resetForm();
-}, []);
-   
   return (<>
-    <form  className="row g-2" onSubmit={handleSubmit(onSubmit)}>
-        <div className="col-12 col-md-12">
-          <label className="form-label">Category Name</label>
-          <input type="text" 
-           {...register("name")} 
-             className={`form-control ${errors.name ? 'is-invalids' : ''}`}
-          />
-          {errors.name && <p className="text-danger">{errors.name.message}</p>}
-        </div> 
-        <div className="col-12 col-md-12">
-          <label className="form-label" htmlFor="description">Description</label>
+    <form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
+      <div className="col-12 col-md-12">
+        <label className="form-label">Category Name</label>
+        <input type="text"
+          {...register("name")}
+          className={`form-control ${errors.name ? 'is-invalids' : ''}`}
+        />
+        {errors.name && <p className="text-danger">{errors.name.message}</p>}
+      </div>
+      <div className="col-12 col-md-12">
+        <label className="form-label" htmlFor="description">Description</label>
         <textarea
           rows="3"
           {...register("description")}
@@ -106,28 +106,30 @@ useEffect(() => {
         <div className="text-end small text-muted">
           {maxDescriptionLength - descriptionLength} characters left
         </div>
-          {errors.description && (
-            <p className="text-danger">{errors.description.message}</p>
-          )}
-        </div>
+        {errors.description && (
+          <p className="text-danger">{errors.description.message}</p>
+        )}
+      </div>
 
-        <div className="col-12 text-center">
-        <button type="submit" className="btn btn-sm btn-primary me-3">           
-         {isLoading? "Please Wait...":"Submit"}       
+      <div className="col-12 text-center">
+        <button type="submit" className="btn btn-sm btn-primary me-3">
+          {isLoading ? "Please Wait..." : "Submit"}
         </button>
         <button
-          type="button"
-          className="btn btn-sm btn-label-secondary "
-          data-bs-dismiss="modal"
-          aria-label="Close"
+          type="button"   // ✅ not reset
+          className="btn btn-sm btn-label-secondary"
+          onClick={() => {
+            resetForm();   // clear inputs
+            onClose?.();   // close modal from parent
+          }}
         >
           Cancel
         </button>
       </div>
-     
+
     </form>
- 
-    </>
+
+  </>
   )
 }
 
diff --git a/src/components/master/EditContactTag.jsx b/src/components/master/EditContactTag.jsx
index 9b3783ba..2eca508f 100644
--- a/src/components/master/EditContactTag.jsx
+++ b/src/components/master/EditContactTag.jsx
@@ -1,49 +1,49 @@
-import React,{useState,useEffect} from 'react'
-import {useForm} from 'react-hook-form';
+import React, { useState, useEffect } from 'react'
+import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { MasterRespository } from '../../repositories/MastersRepository';
 import { clearApiCacheKey } from '../../slices/apiCacheSlice';
-import { getCachedData,cacheData } from '../../slices/apiDataManager';
+import { getCachedData, cacheData } from '../../slices/apiDataManager';
 import showToast from '../../services/toastService';
-import {useUpdateContactTag} from '../../hooks/masterHook/useMaster';
+import { useUpdateContactTag } from '../../hooks/masterHook/useMaster';
 
 
 const schema = z.object({
   name: z.string().min(1, { message: "Tag name is required" }),
   description: z.string().min(1, { message: "Description is required" })
-  .max(255, { message: "Description cannot exceed 255 characters" }),
+    .max(255, { message: "Description cannot exceed 255 characters" }),
 });
 
-const EditContactTag= ({data,onClose}) => {
-const {
-  register,
-  handleSubmit,
-  formState: { errors },
-  reset
-} = useForm({
-  resolver: zodResolver(schema),
-  defaultValues: {
-    name: data?.name || "",
-    description: data?.description || "",
-  },
-});
+const EditContactTag = ({ data, onClose }) => {
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+    reset
+  } = useForm({
+    resolver: zodResolver(schema),
+    defaultValues: {
+      name: data?.name || "",
+      description: data?.description || "",
+    },
+  });
 
-const [descriptionLength, setDescriptionLength] = useState(data?.description?.length || 0);
-const maxDescriptionLength = 255;
+  const [descriptionLength, setDescriptionLength] = useState(data?.description?.length || 0);
+  const maxDescriptionLength = 255;
 
-const { mutate: updateContactTag, isPending: isLoading } = useUpdateContactTag(() => onClose?.());
+  const { mutate: updateContactTag, isPending: isLoading } = useUpdateContactTag(() => onClose?.());
 
-const onSubmit = (formData) => {
-  const payload = {
-    id: data?.id,
-    name: formData.name,
-    description: formData.description,
-  };
-  debugger
-  updateContactTag({ id: data?.id, payload} );
+  const onSubmit = (formData) => {
+    const payload = {
+      id: data?.id,
+      name: formData.name,
+      description: formData.description,
+    };
+    debugger
+    updateContactTag({ id: data?.id, payload });
   }
-    // const onSubmit = (formdata) => {
+  // const onSubmit = (formdata) => {
   //     setIsLoading(true)
   //     const result = {
   //       id:data?.id,
@@ -51,8 +51,8 @@ const onSubmit = (formData) => {
   //       description: formdata.description,  
   //     };
 
-     
-    
+
+
   //     MasterRespository.updateContactTag(data?.id,result).then((resp)=>{
   //       setIsLoading(false) 
   //       showToast("Contact Tag Updated successfully.", "success");
@@ -70,30 +70,30 @@ const onSubmit = (formData) => {
   //        showToast(error?.response?.data?.message, "error")
   //       setIsLoading(false)
   //     })
-     
+
   //   };
 
-const resetForm = () => {
-  reset({ name: "", description: "" });
-  setDescriptionLength(0);
-};
+  const resetForm = () => {
+    reset({ name: "", description: "" });
+    setDescriptionLength(0);
+  };
+
+  useEffect(() => {
+    return () => resetForm();
+  }, []);
 
-useEffect(() => {
-  return () => resetForm();
-}, []);
-   
   return (<>
-    <form  className="row g-2" onSubmit={handleSubmit(onSubmit)}>
-        <div className="col-12 col-md-12">
-          <label className="form-label">Tag Name</label>
-          <input type="text" 
-           {...register("name")} 
-             className={`form-control ${errors.name ? 'is-invalids' : ''}`}
-          />
-          {errors.name && <p className="text-danger">{errors.name.message}</p>}
-        </div> 
-        <div className="col-12 col-md-12">
-          <label className="form-label" htmlFor="description">Description</label>
+    <form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
+      <div className="col-12 col-md-12">
+        <label className="form-label">Tag Name</label>
+        <input type="text"
+          {...register("name")}
+          className={`form-control ${errors.name ? 'is-invalids' : ''}`}
+        />
+        {errors.name && <p className="text-danger">{errors.name.message}</p>}
+      </div>
+      <div className="col-12 col-md-12">
+        <label className="form-label" htmlFor="description">Description</label>
         <textarea
           rows="3"
           {...register("description")}
@@ -106,28 +106,30 @@ useEffect(() => {
         <div className="text-end small text-muted">
           {maxDescriptionLength - descriptionLength} characters left
         </div>
-          {errors.description && (
-            <p className="text-danger">{errors.description.message}</p>
-          )}
-        </div>
+        {errors.description && (
+          <p className="text-danger">{errors.description.message}</p>
+        )}
+      </div>
 
-        <div className="col-12 text-center">
-        <button type="submit" className="btn btn-sm btn-primary me-3">           
-         {isLoading? "Please Wait...":"Submit"}       
+      <div className="col-12 text-center">
+        <button type="submit" className="btn btn-sm btn-primary me-3">
+          {isLoading ? "Please Wait..." : "Submit"}
         </button>
         <button
-          type="button"
-          className="btn btn-sm btn-label-secondary "
-          data-bs-dismiss="modal"
-          aria-label="Close"
+          type="button"   // ✅ not reset
+          className="btn btn-sm btn-label-secondary"
+          onClick={() => {
+            resetForm();   // clear inputs
+            onClose?.();   // close modal from parent
+          }}
         >
           Cancel
         </button>
       </div>
-     
+
     </form>
- 
-    </>
+
+  </>
   )
 }
 
diff --git a/src/components/master/EditJobRole.jsx b/src/components/master/EditJobRole.jsx
index 63c3a7c6..2d4eba69 100644
--- a/src/components/master/EditJobRole.jsx
+++ b/src/components/master/EditJobRole.jsx
@@ -1,24 +1,24 @@
-import React, { useEffect,useState } from 'react'
-import { useForm ,Controller} from 'react-hook-form';
+import React, { useEffect, useState } from 'react'
+import { useForm, Controller } from 'react-hook-form';
 import { set, z } from 'zod';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { MasterRespository } from '../../repositories/MastersRepository';
-import { cacheData,getCachedData } from '../../slices/apiDataManager';
+import { cacheData, getCachedData } from '../../slices/apiDataManager';
 import showToast from '../../services/toastService';
-import {useUpdateJobRole} from '../../hooks/masterHook/useMaster';
+import { useUpdateJobRole } from '../../hooks/masterHook/useMaster';
 
 
 
 const schema = z.object({
   role: z.string().min(1, { message: "Role is required" }),
   description: z.string().min(1, { message: "Description is required" })
-  .max(255, { message: "Description cannot exceed 255 characters" }),
+    .max(255, { message: "Description cannot exceed 255 characters" }),
 });
 
 
 
-const EditJobRole = ({data,onClose}) => {
-const [descriptionLength, setDescriptionLength] = useState(data?.description?.length || 0);
+const EditJobRole = ({ data, onClose }) => {
+  const [descriptionLength, setDescriptionLength] = useState(data?.description?.length || 0);
   const maxDescriptionLength = 255;
 
   const {
@@ -35,38 +35,38 @@ const [descriptionLength, setDescriptionLength] = useState(data?.description?.le
     },
   });
 
-  const { mutate: updateJobRole, isPendin:isLoading } = useUpdateJobRole(() => {
+  const { mutate: updateJobRole, isPendin: isLoading } = useUpdateJobRole(() => {
     onClose?.();
   });
-// const onSubmit = (formdata) => {
-    //   setIsLoading(true)
-    //   const result = {
-    //     id:data?.id,
-    //     name: formdata?.role,
-    //     description: formdata.description,  
-    //   };
+  // const onSubmit = (formdata) => {
+  //   setIsLoading(true)
+  //   const result = {
+  //     id:data?.id,
+  //     name: formdata?.role,
+  //     description: formdata.description,  
+  //   };
 
-     
-    
-    //   MasterRespository.updateJobRole(data?.id,result).then((resp)=>{
-    //     setIsLoading(false) 
-    //     showToast("JobRole Update successfully.", "success");
-    //     const cachedData = getCachedData("Job Role");
-    //     if (cachedData) {
 
-    //       const updatedData = cachedData.map((role) =>
-    //         role.id === data?.id ? { ...role, ...resp.data } : role
-    //       );
-    //       cacheData("Job Role", updatedData);
-    //     }
 
-    //     onClose()
-    //   }).catch((error)=>{
-    //      showToast(error.message, "error")
-    //     setIsLoading(false)
-    //   })
-     
-    // };
+  //   MasterRespository.updateJobRole(data?.id,result).then((resp)=>{
+  //     setIsLoading(false) 
+  //     showToast("JobRole Update successfully.", "success");
+  //     const cachedData = getCachedData("Job Role");
+  //     if (cachedData) {
+
+  //       const updatedData = cachedData.map((role) =>
+  //         role.id === data?.id ? { ...role, ...resp.data } : role
+  //       );
+  //       cacheData("Job Role", updatedData);
+  //     }
+
+  //     onClose()
+  //   }).catch((error)=>{
+  //      showToast(error.message, "error")
+  //     setIsLoading(false)
+  //   })
+
+  // };
 
   const onSubmit = (formData) => {
     updateJobRole({
@@ -93,22 +93,22 @@ const [descriptionLength, setDescriptionLength] = useState(data?.description?.le
     });
     return () => sub.unsubscribe();
   }, [watch]);
-     
+
   return (<>
-    <form  className="row g-2" onSubmit={handleSubmit(onSubmit)}>
+    <form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
       {/* <div className="col-12 col-md-12">
         <label className="fs-5 text-dark text-center d-flex align-items-center justify-content-center flex-wrap">Edit Job Role</label>        
       </div> */}
-        <div className="col-12 col-md-12">
-          <label className="form-label">Role</label>
-          <input type="text" 
-           {...register("role")} 
-             className={`form-control ${errors.role ? 'is-invalids' : ''}`}
-          />
-          {errors.role && <p className="text-danger">{errors.role.message}</p>}
-        </div> 
-        <div className="col-12 col-md-12">
-          <label className="form-label" htmlFor="description">Description</label>
+      <div className="col-12 col-md-12">
+        <label className="form-label">Role</label>
+        <input type="text"
+          {...register("role")}
+          className={`form-control ${errors.role ? 'is-invalids' : ''}`}
+        />
+        {errors.role && <p className="text-danger">{errors.role.message}</p>}
+      </div>
+      <div className="col-12 col-md-12">
+        <label className="form-label" htmlFor="description">Description</label>
         <textarea
           rows="3"
           {...register("description")}
@@ -125,25 +125,25 @@ const [descriptionLength, setDescriptionLength] = useState(data?.description?.le
           <p className="text-danger">{errors.description.message}</p>
         )}
 
-        </div>
+      </div>
 
-        <div className="col-12 text-center">
-        <button type="submit" className="btn btn-sm btn-primary me-3">           
-         {isLoading? "Please Wait...":"Submit"}       
+      <div className="col-12 text-center">
+        <button type="submit" className="btn btn-sm btn-primary me-3">
+          {isLoading ? "Please Wait..." : "Submit"}
         </button>
         <button
           type="button"
           className="btn btn-sm btn-label-secondary"
-          data-bs-dismiss="modal"
-          aria-label="Close"
+          onClick={onClose}   // 👈 This will now close the popup
         >
           Cancel
         </button>
       </div>
-     
+
+
     </form>
- 
-    </>
+
+  </>
   )
 }
 
diff --git a/src/components/master/EditRole.jsx b/src/components/master/EditRole.jsx
index 9d40a10c..04511399 100644
--- a/src/components/master/EditRole.jsx
+++ b/src/components/master/EditRole.jsx
@@ -190,87 +190,87 @@ const EditMaster = ({ master, onClose }) => {
         )}
       </div>
 
-     <div className="col-12 text-start">
-  {/* Scrollable Container with Border */}
-  <div
-    className="border rounded p-3"
-    style={{
-      maxHeight: "350px",
-      overflowY: "auto",
-      overflowX: "hidden", // Prevent horizontal scrollbar
-      paddingRight: "10px",
-    }}
-  >
-    {masterFeatures.map((feature, featureIndex) => (
-      <div key={feature.id} className="mb-3">
-        {/* Feature Group Title */}
-        <div className="fw-semibold mb-2">{feature.name}</div>
+      <div className="col-12 text-start">
+        {/* Scrollable Container with Border */}
+        <div
+          className="border rounded p-3"
+          style={{
+            maxHeight: "350px",
+            overflowY: "auto",
+            overflowX: "hidden", // Prevent horizontal scrollbar
+            paddingRight: "10px",
+          }}
+        >
+          {masterFeatures.map((feature, featureIndex) => (
+            <div key={feature.id} className="mb-3">
+              {/* Feature Group Title */}
+              <div className="fw-semibold mb-2">{feature.name}</div>
 
-        {/* Permissions Grid */}
-        <div className="row">
-          {feature.featurePermissions.map((perm, permIndex) => {
-            const refIndex = featureIndex * 10 + permIndex;
-            return (
-              <div
-                key={perm.id}
-                className="col-12 col-sm-6 col-md-4 mb-3 d-flex align-items-start"
-              >
-                <label
-                  className="form-check-label d-flex align-items-center"
-                  htmlFor={perm.id}
-                >
-                  <input
-                    type="checkbox"
-                    className="form-check-input me-2"
-                    id={perm.id}
-                    {...register(`permissions.${perm.id}`, {
-                      value: initialPermissions[perm.id] || false,
-                    })}
-                  />
-                  {perm.name}
-                </label>
-
-                {/* Info Icon */}
-                <div style={{ display: "flex", alignItems: "center" }}>
-                  <div
-                    ref={(el) => (popoverRefs.current[refIndex] = el)}
-                    tabIndex="0"
-                    className="d-flex align-items-center justify-content-center"
-                    data-bs-toggle="popover"
-                    data-bs-trigger="focus"
-                    data-bs-placement="right"
-                    data-bs-html="true"
-                    data-bs-content={`<div class="border border-secondary rounded custom-popover p-2 px-3">${perm.description}</div>`}
-                  >
-                    &nbsp;
-                    <svg
-                      xmlns="http://www.w3.org/2000/svg"
-                      width="13"
-                      height="13"
-                      fill="currentColor"
-                      className="bi bi-info-circle"
-                      viewBox="0 0 16 16"
+              {/* Permissions Grid */}
+              <div className="row">
+                {feature.featurePermissions.map((perm, permIndex) => {
+                  const refIndex = featureIndex * 10 + permIndex;
+                  return (
+                    <div
+                      key={perm.id}
+                      className="col-12 col-sm-6 col-md-4 mb-3 d-flex align-items-start"
                     >
-                      <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z" />
-                      <path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.547 1.11l1.91-2.011c.241-.256.384-.592.287-.984-.172-.439-.58-.827-1.13-.967a.664.664 0 0 1-.58-.309l-.15-.241-.002-.002zM8 4c-.535 0-.943.372-.943.836 0 .464.408.836.943.836.535 0 .943-.372.943-.836 0-.464-.408-.836-.943-.836z" />
-                    </svg>
-                  </div>
-                </div>
+                      <label
+                        className="form-check-label d-flex align-items-center"
+                        htmlFor={perm.id}
+                      >
+                        <input
+                          type="checkbox"
+                          className="form-check-input me-2"
+                          id={perm.id}
+                          {...register(`permissions.${perm.id}`, {
+                            value: initialPermissions[perm.id] || false,
+                          })}
+                        />
+                        {perm.name}
+                      </label>
+
+                      {/* Info Icon */}
+                      <div style={{ display: "flex", alignItems: "center" }}>
+                        <div
+                          ref={(el) => (popoverRefs.current[refIndex] = el)}
+                          tabIndex="0"
+                          className="d-flex align-items-center justify-content-center"
+                          data-bs-toggle="popover"
+                          data-bs-trigger="focus"
+                          data-bs-placement="right"
+                          data-bs-html="true"
+                          data-bs-content={`<div class="border border-secondary rounded custom-popover p-2 px-3">${perm.description}</div>`}
+                        >
+                          &nbsp;
+                          <svg
+                            xmlns="http://www.w3.org/2000/svg"
+                            width="13"
+                            height="13"
+                            fill="currentColor"
+                            className="bi bi-info-circle"
+                            viewBox="0 0 16 16"
+                          >
+                            <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z" />
+                            <path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.547 1.11l1.91-2.011c.241-.256.384-.592.287-.984-.172-.439-.58-.827-1.13-.967a.664.664 0 0 1-.58-.309l-.15-.241-.002-.002zM8 4c-.535 0-.943.372-.943.836 0 .464.408.836.943.836.535 0 .943-.372.943-.836 0-.464-.408-.836-.943-.836z" />
+                          </svg>
+                        </div>
+                      </div>
+                    </div>
+                  );
+                })}
               </div>
-            );
-          })}
+
+              <hr className="my-2" />
+            </div>
+          ))}
         </div>
 
-        <hr className="my-2" />
+        {/* Error Display */}
+        {errors.permissions && (
+          <p className="text-danger">{errors.permissions.message}</p>
+        )}
       </div>
-    ))}
-  </div>
-
-  {/* Error Display */}
-  {errors.permissions && (
-    <p className="text-danger">{errors.permissions.message}</p>
-  )}
-</div>
 
 
 
@@ -280,11 +280,11 @@ const EditMaster = ({ master, onClose }) => {
         <button
           type="button"
           className="btn btn-sm btn-label-secondary"
-          data-bs-dismiss="modal"
-          aria-label="Close"
+          onClick={onClose}
         >
           Cancel
         </button>
+
       </div>
 
     </form>
diff --git a/src/components/master/EditWorkCategory.jsx b/src/components/master/EditWorkCategory.jsx
index 723e5f24..8a4c4072 100644
--- a/src/components/master/EditWorkCategory.jsx
+++ b/src/components/master/EditWorkCategory.jsx
@@ -1,103 +1,103 @@
-import React, { useEffect,useState } from 'react'
-import { useForm ,Controller} from 'react-hook-form';
+import React, { useEffect, useState } from 'react'
+import { useForm, Controller } from 'react-hook-form';
 import { set, z } from 'zod';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { MasterRespository } from '../../repositories/MastersRepository';
-import { cacheData,getCachedData } from '../../slices/apiDataManager';
+import { cacheData, getCachedData } from '../../slices/apiDataManager';
 import showToast from '../../services/toastService';
-import {useUpdateWorkCategory} from '../../hooks/masterHook/useMaster';
+import { useUpdateWorkCategory } from '../../hooks/masterHook/useMaster';
 
 
 
 const schema = z.object({
   name: z.string().min(1, { message: "Work Category is required" }),
   description: z.string().min(1, { message: "Description is required" })
-  .max(255, { message: "Description cannot exceed 255 characters" }),
+    .max(255, { message: "Description cannot exceed 255 characters" }),
 });
 
 
 
-const EditWorkCategory = ({data,onClose}) => {
-   
-const {
-  register,
-  handleSubmit,
-  formState: { errors },
-  reset,
-} = useForm({
-  resolver: zodResolver(schema),
-  defaultValues: {
-    name: data?.name || "",
-    description: data?.description || "",
-  },
-});
+const EditWorkCategory = ({ data, onClose }) => {
 
-const [descriptionLength, setDescriptionLength] = useState(data?.description?.length || 0);
-const maxDescriptionLength = 255;
+  const {
+    register,
+    handleSubmit,
+    formState: { errors },
+    reset,
+  } = useForm({
+    resolver: zodResolver(schema),
+    defaultValues: {
+      name: data?.name || "",
+      description: data?.description || "",
+    },
+  });
 
-const { mutate: updateWorkCategory, isPending: isLoading } = useUpdateWorkCategory(() => onClose?.());
+  const [descriptionLength, setDescriptionLength] = useState(data?.description?.length || 0);
+  const maxDescriptionLength = 255;
 
-const onSubmit = (formdata) => {
-  const payload = {
-    id: data?.id,
-    name: formdata.name,
-    description: formdata.description,
+  const { mutate: updateWorkCategory, isPending: isLoading } = useUpdateWorkCategory(() => onClose?.());
+
+  const onSubmit = (formdata) => {
+    const payload = {
+      id: data?.id,
+      name: formdata.name,
+      description: formdata.description,
+    };
+
+    updateWorkCategory({ id: data?.id, payload });
   };
 
-  updateWorkCategory({id:data?.id,payload});
-};
-
-    //  const onSubmit = (formdata) => {
-    //   setIsLoading(true)
-    //   const result = {
-    //     id:data?.id,
-    //     name: formdata?.name,
-    //     description: formdata.description,  
-    //   };
-
-     
-    
-    //   MasterRespository.updateWorkCategory(data?.id,result).then((resp)=>{
-    //     setIsLoading(false) 
-    //     showToast("Work Category Update successfully.", "success");
-    //     const cachedData = getCachedData("Work Category");
-    //     if (cachedData) {
-
-    //       const updatedData = cachedData.map((category) =>
-    //         category.id === data?.id ? { ...category, ...resp.data } : category
-    //       );
-    //       cacheData("Work Category", updatedData);
-    //     }
-
-    //     onClose()
-    //   }).catch((error)=>{
-    //      showToast(error?.response?.data?.message, "error")
-    //     setIsLoading(false)
-    //   })
-     
-    // };
-useEffect(() => {
-  reset({
-    name: data?.name || "",
-    description: data?.description || "",
-  });
-  setDescriptionLength(data?.description?.length || 0);
-}, [data, reset]);
+  //  const onSubmit = (formdata) => {
+  //   setIsLoading(true)
+  //   const result = {
+  //     id:data?.id,
+  //     name: formdata?.name,
+  //     description: formdata.description,  
+  //   };
+
+
+
+  //   MasterRespository.updateWorkCategory(data?.id,result).then((resp)=>{
+  //     setIsLoading(false) 
+  //     showToast("Work Category Update successfully.", "success");
+  //     const cachedData = getCachedData("Work Category");
+  //     if (cachedData) {
+
+  //       const updatedData = cachedData.map((category) =>
+  //         category.id === data?.id ? { ...category, ...resp.data } : category
+  //       );
+  //       cacheData("Work Category", updatedData);
+  //     }
+
+  //     onClose()
+  //   }).catch((error)=>{
+  //      showToast(error?.response?.data?.message, "error")
+  //     setIsLoading(false)
+  //   })
+
+  // };
+  useEffect(() => {
+    reset({
+      name: data?.name || "",
+      description: data?.description || "",
+    });
+    setDescriptionLength(data?.description?.length || 0);
+  }, [data, reset]);
+
 
 
-     
   return (<>
-    <form  className="row g-2" onSubmit={handleSubmit(onSubmit)}>
-        <div className="col-12 col-md-12">
-          <label className="form-label">Category Name</label>
-          <input type="text" 
-           {...register("name")} 
-             className={`form-control ${errors.name ? 'is-invalids' : ''}`}
-          />
-          {errors.name && <p className="text-danger">{errors.name.message}</p>}
-        </div> 
-        <div className="col-12 col-md-12">
-          <label className="form-label" htmlFor="description">Description</label>
+    <form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
+      <div className="col-12 col-md-12">
+        <label className="form-label">Category Name</label>
+        <input type="text"
+          {...register("name")}
+          className={`form-control ${errors.name ? 'is-invalids' : ''}`}
+        />
+        {errors.name && <p className="text-danger">{errors.name.message}</p>}
+      </div>
+      <div className="col-12 col-md-12">
+        <label className="form-label" htmlFor="description">Description</label>
         <textarea
           rows="3"
           {...register("description")}
@@ -114,25 +114,25 @@ useEffect(() => {
           <p className="text-danger">{errors.description.message}</p>
         )}
 
-        </div>
+      </div>
 
-        <div className="col-12 text-center">
-        <button type="submit" className="btn btn-sm btn-primary me-3">           
-         {isLoading? "Please Wait...":"Submit"}       
+      <div className="col-12 text-center">
+        <button type="submit" className="btn btn-sm btn-primary me-3">
+          {isLoading ? "Please Wait..." : "Submit"}
         </button>
         <button
-          type="reset"
+          type="button"
           className="btn btn-sm btn-label-secondary"
-          data-bs-dismiss="modal"
-          aria-label="Close"
+          onClick={onClose}
         >
           Cancel
         </button>
+
       </div>
-     
+
     </form>
- 
-    </>
+
+  </>
   )
 }
 
diff --git a/src/components/master/ManagePaymentMode.jsx b/src/components/master/ManagePaymentMode.jsx
index b05856db..761711d0 100644
--- a/src/components/master/ManagePaymentMode.jsx
+++ b/src/components/master/ManagePaymentMode.jsx
@@ -17,31 +17,31 @@ const ManagePaymentMode = ({ data = null, onClose }) => {
     formState: { errors },
   } = useForm({
     resolver: zodResolver(ExpnseSchema),
-    defaultValues: { name: "",  description: "" },
+    defaultValues: { name: "", description: "" },
   });
 
   const { mutate: CreatePaymentMode, isPending } = useCreatePaymentMode(() =>
     onClose?.()
   );
-  const {mutate:UpdatePaymentMode,isPending:Updating} = useUpdatePaymentMode(()=>onClose?.())
+  const { mutate: UpdatePaymentMode, isPending: Updating } = useUpdatePaymentMode(() => onClose?.())
 
   const onSubmit = (payload) => {
-    if(data){
-        UpdatePaymentMode({id:data.id,payload:{...payload,id:data.id}})
-    }else(
-        CreatePaymentMode(payload)
+    if (data) {
+      UpdatePaymentMode({ id: data.id, payload: { ...payload, id: data.id } })
+    } else (
+      CreatePaymentMode(payload)
     )
-    
+
   };
 
-  useEffect(()=>{
-    if(data){ 
+  useEffect(() => {
+    if (data) {
       reset({
-        name:data.name ?? "",
-        description:data.description ?? ""
+        name: data.name ?? "",
+        description: data.description ?? ""
       })
     }
-  },[data])
+  }, [data])
 
 
   return (
@@ -76,17 +76,17 @@ const ManagePaymentMode = ({ data = null, onClose }) => {
           className="btn btn-sm btn-primary me-3"
           disabled={isPending || Updating}
         >
-          {isPending || Updating? "Please Wait..." : Updating ? "Update" : "Submit"}
+          {isPending || Updating ? "Please Wait..." : Updating ? "Update" : "Submit"}
         </button>
         <button
-          type="reset"
-          className="btn btn-sm btn-label-secondary "
-          data-bs-dismiss="modal"
-          aria-label="Close"
+          type="button"
+          className="btn btn-sm btn-label-secondary"
+          onClick={onClose}   // ✅ call onClose here
           disabled={isPending || Updating}
         >
           Cancel
         </button>
+
       </div>
     </form>
   );
diff --git a/src/hooks/useAttendance.js b/src/hooks/useAttendance.js
index 022db4c2..708cde50 100644
--- a/src/hooks/useAttendance.js
+++ b/src/hooks/useAttendance.js
@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react";
-import { cacheData, getCachedData, useSelectedproject } from "../slices/apiDataManager";
+import { cacheData, getCachedData, useSelectedProject } from "../slices/apiDataManager";
 import AttendanceRepository from "../repositories/AttendanceRepository";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import showToast from "../services/toastService";
@@ -143,8 +143,7 @@ export const useRegularizationRequests = (projectId) => {
 
 export const useMarkAttendance = () => {
   const queryClient = useQueryClient();
-  // const selectedProject = useSelector((store)=>store.localVariables.projectId)
-  const selectedProject = useSelectedproject();
+  const selectedProject = useSelectedProject();
   const selectedDateRange = useSelector((store)=>store.localVariables.defaultDateRange)
 
   return useMutation({
diff --git a/src/hooks/useExpense.js b/src/hooks/useExpense.js
index ec1a45bf..41976103 100644
--- a/src/hooks/useExpense.js
+++ b/src/hooks/useExpense.js
@@ -17,13 +17,13 @@ const cleanFilter = (filter) => {
   });
 
   // moment.utc() to get consistent UTC ISO strings
-  if (!cleaned.startDate) {
-    cleaned.startDate = moment.utc().subtract(7, "days").startOf("day").toISOString();
-  }
+  // if (!cleaned.startDate) {
+  //   cleaned.startDate = moment.utc().subtract(7, "days").startOf("day").toISOString();
+  // }
 
-  if (!cleaned.endDate) {
-    cleaned.endDate = moment.utc().startOf("day").toISOString();
-  }
+  // if (!cleaned.endDate) {
+  //   cleaned.endDate = moment.utc().startOf("day").toISOString();
+  // }
 
   return cleaned;
 };
diff --git a/src/pages/Activities/AttendancePage.jsx b/src/pages/Activities/AttendancePage.jsx
index d2b87e22..c2c65623 100644
--- a/src/pages/Activities/AttendancePage.jsx
+++ b/src/pages/Activities/AttendancePage.jsx
@@ -4,7 +4,7 @@ import {
   clearCacheKey,
   getCachedData,
   getCachedProfileData,
-  useSelectedproject,
+  useSelectedProject,
 } from "../../slices/apiDataManager";
 import Breadcrumb from "../../components/common/Breadcrumb";
 import AttendanceLog from "../../components/Activities/AttendcesLogs";
@@ -26,11 +26,11 @@ import { useQueryClient } from "@tanstack/react-query";
 const AttendancePage = () => {
   const [activeTab, setActiveTab] = useState("all");
   const [ShowPending, setShowPending] = useState(false);
-  const [searchTerm, setSearchTerm] = useState(""); // 🔹 New state for search
+  const [searchTerm, setSearchTerm] = useState(""); 
   const queryClient = useQueryClient();
   const loginUser = getCachedProfileData();
-  // const selectedProject = useSelector((store) => store.localVariables.projectId);
-  const selectedProject = useSelectedproject();
+
+  const selectedProject = useSelectedProject();
   const dispatch = useDispatch();
 
   const [attendances, setAttendances] = useState();
diff --git a/src/pages/Activities/DailyTask.jsx b/src/pages/Activities/DailyTask.jsx
index 1837f6fa..73f1ccba 100644
--- a/src/pages/Activities/DailyTask.jsx
+++ b/src/pages/Activities/DailyTask.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useMemo, useRef, useState } from "react";
+import React, { useEffect, useMemo, useState } from "react";
 import { useDispatch } from "react-redux";
 import { useTaskList } from "../../hooks/useTasks";
 import { useProjectName } from "../../hooks/useProjects";
@@ -13,13 +13,13 @@ import SubTask from "../../components/Activities/SubTask";
 import { formatNumber, formatUTCToLocalTime } from "../../utils/dateUtils";
 import { useHasUserPermission } from "../../hooks/useHasUserPermission";
 import { APPROVE_TASK, ASSIGN_REPORT_TASK } from "../../utils/constants";
-import { useSelectedproject } from "../../slices/apiDataManager";
+import { useSelectedProject } from "../../slices/apiDataManager";
 import moment from "moment";
 import Loader from "../../components/common/Loader";
 
 const DailyTask = () => {
   const dispatch = useDispatch();
-  const selectedProject = useSelectedproject();
+  const selectedProject = useSelectedProject();
   const { projectNames } = useProjectName();
   const ApprovedTaskRights = useHasUserPermission(APPROVE_TASK);
   const ReportTaskRights = useHasUserPermission(ASSIGN_REPORT_TASK);
@@ -41,10 +41,20 @@ const DailyTask = () => {
   // Ensure project is set
   useEffect(() => {
     if (!selectedProject && projectNames.length > 0) {
+      debugger
       dispatch(setProjectId(projectNames[0].id));
     }
   }, [selectedProject, projectNames, dispatch]);
 
+  // 🔹 Reset filters when project changes
+  useEffect(() => {
+    setFilters({
+      selectedBuilding: "",
+      selectedFloors: [],
+      selectedActivities: [],
+    });
+  }, [selectedProject]);
+
   //  Memoized filtering
   const filteredTasks = useMemo(() => {
     if (!TaskList) return [];
@@ -91,8 +101,8 @@ const DailyTask = () => {
       data-bs-content={`
         <div class="border border-secondary rounded custom-popover p-2 px-3">
           ${task.teamMembers
-            .map(
-              (m) => `
+          .map(
+            (m) => `
             <div class="d-flex align-items-center gap-2 mb-2">
               <div class="avatar avatar-xs">
                 <span class="avatar-initial rounded-circle bg-label-primary">
@@ -101,8 +111,8 @@ const DailyTask = () => {
               </div>
               <span>${m.firstName} ${m.lastName}</span>
             </div>`
-            )
-            .join("")}
+          )
+          .join("")}
         </div>
       `}
     >
@@ -163,6 +173,7 @@ const DailyTask = () => {
                 currentSelectedBuilding={filters.selectedBuilding}
                 currentSelectedFloors={filters.selectedFloors}
                 currentSelectedActivities={filters.selectedActivities}
+                selectedProject={selectedProject} 
               />
             </div>
 
diff --git a/src/pages/Activities/TaskPlannng.jsx b/src/pages/Activities/TaskPlannng.jsx
index ed51490c..09acc21f 100644
--- a/src/pages/Activities/TaskPlannng.jsx
+++ b/src/pages/Activities/TaskPlannng.jsx
@@ -4,21 +4,19 @@ import InfraPlanning from "../../components/Activities/InfraPlanning";
 import { useProjectName } from "../../hooks/useProjects";
 import { useDispatch, useSelector } from "react-redux";
 import { setProjectId } from "../../slices/localVariablesSlice";
-import { useSelectedproject } from "../../slices/apiDataManager";
+import { useSelectedProject } from "../../slices/apiDataManager";
 
 const TaskPlannng = () => {
-  const selectedProject = useSelectedproject();
-  const dispatch = useDispatch();
-  const { projectNames, loading: projectLoading } = useProjectName();
+const selectedProject = useSelectedProject();
+const dispatch = useDispatch();
+const { projectNames = [], loading: projectLoading } = useProjectName();
 
-   const initialized = useRef(false); 
+useEffect(() => {
+  if (!selectedProject) {
+    dispatch(setProjectId(projectNames[0].id));
+  }
+}, [projectNames, selectedProject?.id, dispatch]);
 
-  useEffect(() => {
-    if (!initialized.current && projectNames.length > 0 && !selectedProject?.id) {
-      dispatch(setProjectId(projectNames[0].id));
-      initialized.current = true; 
-    }
-  }, [projectNames, selectedProject, dispatch]);
 
   return (
     <div className="container-fluid">
diff --git a/src/pages/authentication/LoginPage.jsx b/src/pages/authentication/LoginPage.jsx
index c9eb5e0d..3f91e29a 100644
--- a/src/pages/authentication/LoginPage.jsx
+++ b/src/pages/authentication/LoginPage.jsx
@@ -210,7 +210,7 @@ const LoginPage = () => {
             Login With Password
           </a>
         ) : (
-          <Link to="/auth/reqest/demo" className="registration-link">
+           <Link to="/market/enquire" className="registration-link">
             Request a Demo
           </Link>
         )}
diff --git a/src/pages/employee/EmployeeList.jsx b/src/pages/employee/EmployeeList.jsx
index 935add9b..5cd7ab2d 100644
--- a/src/pages/employee/EmployeeList.jsx
+++ b/src/pages/employee/EmployeeList.jsx
@@ -18,7 +18,7 @@ import {
   VIEW_ALL_EMPLOYEES,
   VIEW_TEAM_MEMBERS,
 } from "../../utils/constants";
-import { clearCacheKey, useSelectedproject } from "../../slices/apiDataManager";
+import { clearCacheKey, useSelectedProject } from "../../slices/apiDataManager";
 import { useHasUserPermission } from "../../hooks/useHasUserPermission";
 import SuspendEmp from "../../components/Employee/SuspendEmp"; // Keep if you use SuspendEmp
 import {
@@ -41,7 +41,7 @@ const EmployeeList = () => {
   // const selectedProjectId = useSelector(
   //   (store) => store.localVariables.projectId
   // );
-  const selectedProjectId = useSelectedproject();
+  const selectedProjectId = useSelectedProject();
   const { projectNames, loading: projectLoading, fetchData } = useProjectName();
 
   const dispatch = useDispatch();
diff --git a/src/pages/master/MasterPage.jsx b/src/pages/master/MasterPage.jsx
index 72710679..564fc036 100644
--- a/src/pages/master/MasterPage.jsx
+++ b/src/pages/master/MasterPage.jsx
@@ -122,14 +122,17 @@ const MasterPage = () => {
                             onChange={(e) => dispatch(changeMaster(e.target.value))}
                             name="DataTables_Table_0_length"
                             aria-controls="DataTables_Table_0"
-                            className="form-select form-select-sm"
+                            className="form-select py-1 px-2"
+                            style={{ fontSize: "0.875rem", height: "32px", width: "150px" }}
                             value={selectedMaster}
                           >
-                            {isLoading && (<option  value={null}>Loading...</option>)}
-                            {(!isLoading && data) && data?.map((item) => (
-
-                              <option key={item.id} value={item.name}>{item.name}</option>
-                            ))}
+                            {isLoading && <option value="">Loading...</option>}
+                            {!isLoading &&
+                              data?.map((item) => (
+                                <option key={item.id} value={item.name}>
+                                  {item.name}
+                                </option>
+                              ))}
                           </select>
                         </label>
                       </div>
diff --git a/src/pages/project/ProjectDetails.jsx b/src/pages/project/ProjectDetails.jsx
index 75f7705b..1df27bb9 100644
--- a/src/pages/project/ProjectDetails.jsx
+++ b/src/pages/project/ProjectDetails.jsx
@@ -13,7 +13,7 @@ import {
   cacheData,
   clearCacheKey,
   getCachedData,
-  useSelectedproject,
+  useSelectedProject,
 } from "../../slices/apiDataManager";
 import "./ProjectDetails.css";
 import {
@@ -29,7 +29,7 @@ import { setProjectId } from "../../slices/localVariablesSlice";
 
 const ProjectDetails = () => {
 
-  const projectId = useSelectedproject()
+  const projectId = useSelectedProject()
 
   const { projectNames, fetchData } = useProjectName();
   const dispatch = useDispatch()
diff --git a/src/repositories/DirectoryRepository.jsx b/src/repositories/DirectoryRepository.jsx
index e19571cc..aa630338 100644
--- a/src/repositories/DirectoryRepository.jsx
+++ b/src/repositories/DirectoryRepository.jsx
@@ -34,6 +34,8 @@ export const DirectoryRepository = {
   DeleteNote: (id, isActive) =>
     api.delete(`/api/directory/note/${id}?active=${isActive}`),
 
-  GetNotes: (pageSize, pageNumber) =>
-    api.get(`/api/directory/notes?pageSize=${pageSize}&pageNumber=${pageNumber}`),
+  GetNotes: (pageSize, pageNumber, projectId) =>
+  api.get(
+    `/api/directory/notes?pageSize=${pageSize}&pageNumber=${pageNumber}&projectId=${projectId}`
+  ),
 };
diff --git a/src/repositories/MarketRepository.jsx b/src/repositories/MarketRepository.jsx
index 4baa3c74..e71393d8 100644
--- a/src/repositories/MarketRepository.jsx
+++ b/src/repositories/MarketRepository.jsx
@@ -1,6 +1,6 @@
 import { api } from "../utils/axiosClient";
 
 export const MarketRepository = {
-  requestDemo: (data) => api.post("/api/market/inquiry", data),
+  requestDemo: (data) => api.post("/api/market/enquire", data),
   getIndustries: () => api.get("api/market/industries"),
 };
diff --git a/src/router/AppRoutes.jsx b/src/router/AppRoutes.jsx
index 0e269a6f..019a3e8d 100644
--- a/src/router/AppRoutes.jsx
+++ b/src/router/AppRoutes.jsx
@@ -52,7 +52,7 @@ const router = createBrowserRouter(
       children: [
         { path: "/auth/login", element: <LoginPage /> },
         { path: "/auth/login-otp", element: <LoginWithOtp /> },
-        { path: "/auth/reqest/demo", element: <RegisterPage /> },
+         { path: "/market/enquire", element: <RegisterPage /> },
         { path: "/auth/forgot-password", element: <ForgotPasswordPage /> },
         { path: "/reset-password", element: <ResetPasswordPage /> },
         { path: "/legal-info", element: <LegalInfoCard /> },
diff --git a/src/slices/apiDataManager.jsx b/src/slices/apiDataManager.jsx
index d0f8bc67..97f6dcb5 100644
--- a/src/slices/apiDataManager.jsx
+++ b/src/slices/apiDataManager.jsx
@@ -33,13 +33,12 @@ export const clearAllCache = () => {
 export const cacheProfileData = ( data) => {
   store.dispatch(setLoginUserPermmisions(data));
 };
-
 // Get cached data
 export const getCachedProfileData = () => {
   return store.getState().globalVariables.loginUser;
 };
 
-export const useSelectedproject = () => {
+export const useSelectedProject = () => {
   const selectedProject = useSelector((store)=> store.localVariables.projectId);
   var project = localStorage.getItem("project");
   if(project){
@@ -47,7 +46,7 @@ export const useSelectedproject = () => {
   } else{
     return selectedProject
   }
-  // return project ? selectedProject
+ 
   
   
 }; 
\ No newline at end of file