feat: add asset thumbnail fetching and update worker data display in Hrm component

app/src/components/layout/sidebarRight/resourceManagement/hrm/Hrm.tsx

@@ -3,6 +3,7 @@ import { ClockThreeIcon, LocationPinIcon, TargetIcon } from '../../../../icons/E
 import { useSceneContext } from '../../../../../modules/scene/sceneContext';
 import RenameInput from '../../../../ui/inputs/RenameInput';
 import { useResourceManagementId } from '../../../../../store/builder/store';
+import { getAssetThumbnail } from '../../../../../services/factoryBuilder/asset/assets/getAssetThumbnail';
 // import NavigateCatagory from '../NavigateCatagory'
 
 const Hrm = () => {
@@ -12,13 +13,26 @@ const Hrm = () => {
     const { assetStore } = useSceneContext();
     const { assets: allAssets } = assetStore();
 
+    async function getAsset(assetId: string) {
+        let thumbnail = await getAssetThumbnail(assetId)
+        if (thumbnail.thumbnail) {
+            let assetImage = thumbnail.thumbnail
+            return assetImage;
+        }
+    }
+
    useEffect(() => {
     if (allAssets.length > 0) {
-            const formattedWorkers = allAssets
-                .filter((worker: any) => worker.eventData.type === "Human")
-                .map((worker: any, index: number) => ({
+        const fetchWorkers = async () => {
+            const humans = allAssets.filter((worker: any) => worker.eventData.type === "Human");
+
+            const formattedWorkers = await Promise.all(
+                humans.map(async (worker: any, index: number) => {
+                    const assetImage = await getAsset(worker.assetId);
+
+                    return {
                         employee: {
-                        image: "",
+                            image: assetImage,
                             name: worker.modelName,
                             modelId: worker.modelUuid,
                             employee_id: `HR-${204 + index}`,
@@ -29,27 +43,28 @@ const Hrm = () => {
                             title: worker.taskTitle ?? "No Task Assigned",
                             location: {
                                 floor: worker.floor ?? 0,
-                            zone: worker.zone ?? "N/A"
+                                zone: worker.zone ?? "N/A",
                             },
                             planned_time_hours: worker.plannedTime ?? 0,
                             time_spent_hours: worker.timeSpent ?? 0,
                             total_tasks: worker.totalTasks ?? 0,
-                        completed_tasks: worker.completedTasks ?? 0
+                            completed_tasks: worker.completedTasks ?? 0,
                         },
-                    actions: [
-                        "Assign Task",
-                        "Reassign Task",
-                        "Pause",
-                        "Emergency Stop"
-                    ],
-                    location: `Floor ${worker.floor || "-"} . Zone ${worker.zone || "-"}`
-                }));
+                        actions: ["Assign Task", "Reassign Task", "Pause", "Emergency Stop"],
+                        location: `Floor ${worker.floor || "-"} . Zone ${worker.zone || "-"}`,
+                    };
+                })
+            );
 
             setWorkers(formattedWorkers);
+        };
+
+        fetchWorkers();
     }
 }, [allAssets]);
 
 
+
 // const employee_details = [
 //     {
 //         "employee": {

app/src/styles/layout/resourceManagement.scss

@@ -117,6 +117,12 @@
             border-radius: 50%;
             background-color: #fff;
             position: relative;
+            overflow: hidden;
+            .user-image{
+              height: 300%;
+              width: 300%;
+              transform: translate(-26px, -12px);
+            }
 
             .status {
               border-radius: 50%;