diff --git a/src/components/Project/Infrastructure/WorkItem.jsx b/src/components/Project/Infrastructure/WorkItem.jsx
index 682b208a..956991da 100644
--- a/src/components/Project/Infrastructure/WorkItem.jsx
+++ b/src/components/Project/Infrastructure/WorkItem.jsx
@@ -32,6 +32,11 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
   };
 
   const hasWorkItem = NewWorkItem && NewWorkItem;
+  useEffect(() => {
+    const tooltipTriggerList = Array.from(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
+    tooltipTriggerList.forEach((el) => new bootstrap.Tooltip(el));
+  }, []);
+  
 
   return (
     <>
@@ -56,10 +61,7 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
         </td>
         {/* for mobile view */}
         <td className="text-center d-sm-none d-sm-table-cell">
-          {hasWorkItem
-            ? NewWorkItem?.workItem?.completedWork || workItem?.completedWork
-            : "NA"}
-          /{" "}
+          {NewWorkItem?.workItem?.completedWork}/{" "}
           {hasWorkItem
             ? NewWorkItem?.workItem?.plannedWork || workItem?.plannedWork
             : "NA"}
@@ -71,9 +73,7 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
             : "NA"}
         </td>
         <td className="text-center d-none d-md-table-cell">
-          {hasWorkItem
-            ? NewWorkItem?.workItem?.completedWork || workItem?.completedWork
-            : "NA"}
+          {NewWorkItem?.workItem?.completedWork}
         </td>
         {/* ************************************************ */}
         <td className="text-center" style={{ width: "15%" }}>
@@ -89,12 +89,7 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
                 ),
                 height: "5px",
               }}
-              aria-valuenow={
-                hasWorkItem
-                  ? NewWorkItem?.workItem?.completedWork ||
-                    workItem?.completedWork
-                  : 0
-              }
+              aria-valuenow={NewWorkItem?.workItem?.completedWor}
               aria-valuemin="0"
               aria-valuemax={
                 hasWorkItem
@@ -126,14 +121,23 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
               type="button"
               className="btn p-0 dropdown-toggle hide-arrow"
             >
-              <i className="bx bxs-edit me-2 text-primary"></i>
+              <i
+                className="bx bxs-edit me-2 text-primary"
+                data-bs-toggle="tooltip"
+                data-bs-placement="top"
+                title="Edit Activity"
+                data-bs-original-title="Edit Activity"
+              ></i>
             </button>
             <button
               aria-label="Delete"
               type="button"
               className="btn p-0 dropdown-toggle hide-arrow"
             >
-              <i className="bx bx-trash me-1 text-danger"></i>
+              <i className="bx bx-trash me-1 text-danger"    data-bs-toggle="tooltip"
+                data-bs-placement="top"
+                title="Delete Activity"
+                data-bs-original-title="Delete Activity"></i>
             </button>
           </div>
         </td>
@@ -149,7 +153,7 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
 
             <div className="dropdown-menu dropdown-menu-end m-0">
               {" "}
-              <a className="dropdown-item">
+              <a className="dropdown-item ">
                 {" "}
                 <i className="bx bxs-edit me-2 text-primary"></i>Edit
               </a>