From b963f6bad94d1d51950fe789411a911c98ccc9eb Mon Sep 17 00:00:00 2001
From: Vikas Nale <vikas@marcoaiot.com>
Date: Thu, 17 Apr 2025 17:52:09 +0530
Subject: [PATCH] Fix loading error. Hide existing content and then show
 loading

---
 src/components/Activities/Regularization.jsx | 78 ++++++++++----------
 1 file changed, 41 insertions(+), 37 deletions(-)

diff --git a/src/components/Activities/Regularization.jsx b/src/components/Activities/Regularization.jsx
index 19c2b6b9..0c76cd06 100644
--- a/src/components/Activities/Regularization.jsx
+++ b/src/components/Activities/Regularization.jsx
@@ -34,45 +34,49 @@ const Regularization = ({ handleRequest }) => {
         </thead>
         <tbody>
           {loading && <td colSpan={5}>Loading...</td>}
-          {regularizes?.length > 0 ? (
-            regularizes?.map((att, index) => (
-              <tr key={index}>
-                <td colSpan={2}>
-                  <div className="d-flex justify-content-start align-items-center">
-                    <Avatar
-                      firstName={att.firstName}
-                      lastName={att.lastName}
-                    ></Avatar>
-                    <div className="d-flex flex-column">
-                      <a href="#" className="text-heading text-truncate">
-                        <span className="fw-medium">
-                          {att.firstName} {att.lastName}
-                        </span>
-                      </a>
+
+          {!loading &&
+            (regularizes?.length > 0 ? (
+              regularizes?.map((att, index) => (
+                <tr key={index}>
+                  <td colSpan={2}>
+                    <div className="d-flex justify-content-start align-items-center">
+                      <Avatar
+                        firstName={att.firstName}
+                        lastName={att.lastName}
+                      ></Avatar>
+                      <div className="d-flex flex-column">
+                        <a href="#" className="text-heading text-truncate">
+                          <span className="fw-medium">
+                            {att.firstName} {att.lastName}
+                          </span>
+                        </a>
+                      </div>
                     </div>
-                  </div>
-                </td>
-                <td>{moment(att.checkOutTime).format("DD-MMM-YYYY")}</td>
-                <td>{convertShortTime(att.checkInTime)}</td>
-                <td>
-                  {att.checkOutTime ? convertShortTime(att.checkOutTime) : "--"}
-                </td>
-                <td className="text-center ">
-                  {/* <div className='d-flex  justify-content-center align-items-center gap-3'> */}
-                  <RegularizationActions
-                    attendanceData={att}
-                    handleRequest={handleRequest}
-                    refresh={refetch}
-                  />
-                  {/* </div> */}
-                </td>
+                  </td>
+                  <td>{moment(att.checkOutTime).format("DD-MMM-YYYY")}</td>
+                  <td>{convertShortTime(att.checkInTime)}</td>
+                  <td>
+                    {att.checkOutTime
+                      ? convertShortTime(att.checkOutTime)
+                      : "--"}
+                  </td>
+                  <td className="text-center ">
+                    {/* <div className='d-flex  justify-content-center align-items-center gap-3'> */}
+                    <RegularizationActions
+                      attendanceData={att}
+                      handleRequest={handleRequest}
+                      refresh={refetch}
+                    />
+                    {/* </div> */}
+                  </td>
+                </tr>
+              ))
+            ) : (
+              <tr>
+                <td colSpan={5}>No Record Found</td>
               </tr>
-            ))
-          ) : (
-            <tr>
-              <td colSpan={5}>No Record Found</td>
-            </tr>
-          )}
+            ))}
         </tbody>
       </table>
     </div>