From 7ac3268514f58c541b5d6058edd5a11e0096bf9f Mon Sep 17 00:00:00 2001
From: Kartik Sharma <kartik.sharma@marcoaiot.com>
Date: Fri, 26 Sep 2025 12:15:12 +0530
Subject: [PATCH] =?UTF-8?q?Add=20an=20info=20(=E2=84=B9=EF=B8=8F)=20icon?=
 =?UTF-8?q?=20to=20the=20Daily=20Progress=20Report=E2=80=99s=20Total=20Pen?=
 =?UTF-8?q?ding=20Task?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../DailyProgressRport/TaskReportList.jsx     | 29 ++++++++++++-------
 src/components/common/HoverPopup.jsx          |  4 +--
 2 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/src/components/DailyProgressRport/TaskReportList.jsx b/src/components/DailyProgressRport/TaskReportList.jsx
index 254b1ddf..c46e07ae 100644
--- a/src/components/DailyProgressRport/TaskReportList.jsx
+++ b/src/components/DailyProgressRport/TaskReportList.jsx
@@ -40,7 +40,7 @@ const TaskReportList = () => {
     service
   );
 
-const ProgrssReportColumn = [
+  const ProgrssReportColumn = [
     {
       key: "activity",
       label: "Activity",
@@ -149,20 +149,19 @@ const ProgrssReportColumn = [
       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">
-                  ${m?.firstName?.charAt(0) || ""}${
-                m?.lastName?.charAt(0) || ""
+                  ${m?.firstName?.charAt(0) || ""}${m?.lastName?.charAt(0) || ""
               }
                 </span>
               </div>
               <span>${m.firstName} ${m.lastName}</span>
             </div>`
-            )
-            .join("")}
+          )
+          .join("")}
         </div>
       `}
     >
@@ -194,17 +193,27 @@ const ProgrssReportColumn = [
   if (isError) return <div>Loading....</div>;
   return (
     <div className="mt-2">
-     <table className="table">
+      <table className="table">
         <thead>
           <tr>
             <th className="text-start">Activity</th>
-            <th>Total Pending</th>
+            <th>
+              <span>
+                Total Pending{" "}
+                <HoverPopup
+                  title="Total Pending Task"
+                  content={<p>This shows the total pending tasks for each activity on that date.</p>}
+                >
+                  <i className="bx bx-xs ms-1 bx-info-circle cursor-pointer"></i>
+                </HoverPopup>
+              </span>
+            </th>
             <th>
               <span>
                 Reported/Planned{" "}
                 <HoverPopup
                   title="Reported and Planned Task"
-                  content={<p>This shows the reported versus planned tasks for each activity. on that Date</p>}
+                  content={<p>This shows the reported versus planned tasks for each activity on that date.</p>}
                 >
                   <i className="bx bx-xs ms-1 bx-info-circle cursor-pointer"></i>
                 </HoverPopup>
diff --git a/src/components/common/HoverPopup.jsx b/src/components/common/HoverPopup.jsx
index ddf0a062..d65f365e 100644
--- a/src/components/common/HoverPopup.jsx
+++ b/src/components/common/HoverPopup.jsx
@@ -53,8 +53,8 @@ const HoverPopup = ({ title, content, children }) => {
             marginTop: "8px",
           }}
         >
-          {title && <h6 className="mb-2">{title}</h6>}
-          <div>{content}</div>
+          {title && <h6 className="mb-2 text-capitalize">{title}</h6>}
+          <div className="text-capitalize">{content}</div>
         </div>
       )}
     </div>