Correction in Date format in Attendance logs, and adding spinnerloade at attendance tab.

src/components/Activities/Attendance.jsx

@@ -11,6 +11,7 @@ import { useSelector } from "react-redux";
 import { useQueryClient } from "@tanstack/react-query";
 import eventBus from "../../services/eventBus";
 import { useSelectedProject } from "../../slices/apiDataManager";
+import { SpinnerLoader } from "../common/Loader";
 
 const Attendance = ({ getRole, handleModalData, searchTerm, projectId, organizationId, }) => {
   const queryClient = useQueryClient();
@@ -133,12 +134,18 @@ const Attendance = ({ getRole, handleModalData, searchTerm, projectId, organizat
         </div>
       </div>
       <div
-        className="table-responsive text-nowrap h-100"
+        className="table-responsive modal-min-h text-nowrap h-100"
         style={{ minHeight: "200px" }}   // Ensures fixed height
       >
         {attLoading ? (
-          <div>Loading...</div>
+          <div
+            className="d-flex justify-content-center align-items-center"
+            style={{ minHeight: "50vh" }}
+          >
+            <SpinnerLoader />
+          </div>
         ) : currentItems?.length > 0 ? (
+
           <>
             <table className="table ">
               <thead>

src/components/Activities/AttendcesLogs.jsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState, useMemo, useCallback } 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 { useSelector, useDispatch } from "react-redux";
 import DateRangePicker from "../common/DateRangePicker";
@@ -16,6 +16,7 @@ import { useAttendancesLogs } from "../../hooks/useAttendance";
 import { queryClient } from "../../layouts/AuthLayout";
 import { ITEMS_PER_PAGE } from "../../utils/constants";
 import { useNavigate } from "react-router-dom";
+import { SpinnerLoader } from "../common/Loader";
 
 const usePagination = (data, itemsPerPage) => {
   const [currentPage, setCurrentPage] = useState(1);
@@ -207,17 +208,18 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
 
 
       <div
-        className="table-responsive text-nowrap"
+        className="table-responsive modal-min-h text-nowrap"
         style={{ minHeight: "200px" }}
       >
         {isLoading ? (
           <div
             className="d-flex justify-content-center align-items-center"
-            style={{ height: "200px" }}
+           style={{ minHeight: "50vh" }}
           >
-            <p className="text-secondary">Loading...</p>
+            <SpinnerLoader />
           </div>
         ) : filteredSearchData?.length > 0 ? (
+
           <table className="table mb-0">
             <thead>
               <tr>
@@ -257,7 +259,7 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
                     >
                       <td colSpan={8} className="text-start">
                         <strong className="d-inline-block my-1 ms-2">
-                          {moment(currentDate).format("DD-MM-YYYY")}
+                          {formatUTCToLocalTime(currentDate)}
                         </strong>
                       </td>
                     </tr>

src/components/Activities/Regularization.jsx

@@ -15,6 +15,7 @@ import {
 import { useQueryClient } from "@tanstack/react-query";
 import Pagination from "../../components/common/Pagination";
 import { useNavigate } from "react-router-dom";
+import { SpinnerLoader } from "../common/Loader";
 
 const Regularization = ({
   handleRequest,
@@ -106,15 +107,15 @@ const Regularization = ({
   return (
     <div>
       <div
-        className="table-responsive pt-3 text-nowrap pb-4"
+        className="table-responsive modal-min-h pt-3 text-nowrap pb-4"
         style={{ minHeight: "200px" }}
       >
         {loading ? (
           <div
             className="d-flex justify-content-center align-items-center"
-            style={{ height: "200px" }}
+            style={{ minHeight: "50vh" }}
           >
-            <p className="text-secondary">Loading...</p>
+            <SpinnerLoader />
           </div>
         ) : currentItems?.length > 0 ? (
           <table className="table mb-0">

src/components/Dashboard/AttendanceChart.jsx

@@ -4,6 +4,7 @@ import ReactApexChart from "react-apexcharts";
 import { useAttendanceOverviewData } from "../../hooks/useDashboard_Data";
 import flatColors from "../Charts/flatColor";
 import ChartSkeleton from "../Charts/Skelton";
+import { SpinnerLoader } from "../common/Loader";
 
 const formatDate = (dateStr) => {
   const date = new Date(dateStr);
@@ -138,9 +139,9 @@ const AttendanceOverview = () => {
       </div>
 
       {/* Content */}
-      <div className="flex-grow-1 d-flex align-items-center justify-content-center">
+      <div className="flex-grow-1 d-flex  align-items-center modal-min-h justify-content-center">
         {loading ? (
-          <ChartSkeleton />
+          <SpinnerLoader />
         ) : error ? (
           <p className="text-danger">{error}</p>
         ) : view === "chart" ? (

src/components/Dashboard/Tasks.jsx

@@ -44,9 +44,9 @@ const TasksCard = () => {
           </span>
         </div>
       ) : (
-        <div className="d-flex justify-content-around align-items-start flex-wrap mt-n2">
+        <div className="d-flex justify-content-around align-items-start mt-n2">
           {/* Total Tasks */}
-          <div className="text-center flex-fill p-2">
+          <div>
             <h4 className="mb-0 fw-bold text-truncate">
               {formatFigure(tasksCardData?.totalTasks ?? 0, {
                 notation: "compact",
@@ -56,7 +56,7 @@ const TasksCard = () => {
           </div>
 
           {/* Completed Tasks */}
-          <div className="text-center flex-fill p-2">
+          <div>
             <h4 className="mb-0 fw-bold text-truncate">
               {formatFigure(tasksCardData?.completedTasks ?? 0, {
                 notation: "compact",

src/pages/Directory/DirectoryPage.jsx

@@ -44,7 +44,7 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
   const [searchNote, setSearchNote] = useState("");
   const [activeTab, setActiveTab] = useState("notes");
   const { setActions } = useFab();
-  const [gridView, setGridView] = useState(false);
+  const [gridView, setGridView] = useState(true);
   const [isOpenBucket, setOpenBucket] = useState(false);
   const [isManageContact, setManageContact] = useState({
     isOpen: false,