fixed move figure out f card - using type= compact

src/components/Dashboard/Tasks.jsx

@@ -2,6 +2,7 @@ import React from "react";
 import { useSelectedProject } from "../../slices/apiDataManager";
 import { useDashboardTasksCardData } from "../../hooks/useDashboard_Data";
 import { TasksSkeleton } from "./DashboardSkeleton";
+import { formatCurrency, formatFigure } from "../../utils/appUtils";
 
 const TasksCard = () => {
   const projectId = useSelectedProject();
@@ -31,10 +32,14 @@ const TasksCard = () => {
             {error?.message || "Unable to load data at the moment."}
           </small>
           <span
-        className={`text-muted ${isFetching ? "cursor-wait" : "cursor-pointer"}`}
+            className={`text-muted ${
+              isFetching ? "cursor-wait" : "cursor-pointer"
+            }`}
             onClick={refetch}
           >
-        <i className={`bx bx-refresh me-1 ${isFetching ? "bx-spin" : ""}`}></i>
+            <i
+              className={`bx bx-refresh me-1 ${isFetching ? "bx-spin" : ""}`}
+            ></i>
             Retry
           </span>
         </div>
@@ -42,23 +47,26 @@ const TasksCard = () => {
         <div className="d-flex justify-content-around align-items-start flex-wrap mt-n2">
           {/* Total Tasks */}
           <div className="text-center flex-fill p-2">
-        <h4 className="mb-0 fw-bold text-truncate" style={{ wordBreak: "break-word" }}>
-          {tasksCardData?.totalTasks?.toLocaleString() ?? 0}
+            <h4 className="mb-0 fw-bold text-truncate">
+              {formatFigure(tasksCardData?.totalTasks ?? 0, {
+                notation: "compact",
+              })}
             </h4>
             <small className="text-muted d-block">Total</small>
           </div>
 
           {/* Completed Tasks */}
           <div className="text-center flex-fill p-2">
-        <h4 className="mb-0 fw-bold text-truncate" style={{ wordBreak: "break-word" }}>
-          {tasksCardData?.completedTasks?.toLocaleString() ?? 0}
+            <h4 className="mb-0 fw-bold text-truncate">
+              {formatFigure(tasksCardData?.completedTasks ?? 0, {
+                notation: "compact",
+              })}
             </h4>
             <small className="text-muted d-block">Completed</small>
           </div>
         </div>
       )}
-</div>
-
+    </div>
   );
 };