refactor: clean up code and improve readability in SidePannel, FileMenu, Scene, and detectModifierKeys and remove settimeout in scene

app/src/components/Dashboard/SidePannel.tsx

@@ -42,7 +42,7 @@ const SidePannel: React.FC<SidePannelProps> = ({ setActiveTab, activeTab }) => {
       const projectId = generateProjectId();
       useSocketStore.getState().initializeSocket(email, organization, token);
 
-   
+
       //API for creating new Project
       // const project = await createProject(
       //   projectId,
@@ -163,7 +163,10 @@ const SidePannel: React.FC<SidePannelProps> = ({ setActiveTab, activeTab }) => {
             <SettingsIcon />
             Settings
           </div>
-          <div className="option-list" style={{ cursor: "pointer" }}>
+          <div className="option-list" style={{ cursor: "pointer" }} onClick={() => {
+            localStorage.clear();
+            navigate("/");
+          }}>
             <LogoutIcon />
             Log out
           </div>

app/src/components/ui/FileMenu.tsx

@@ -93,9 +93,7 @@ const FileMenu: React.FC = () => {
       //     console.log('Project update response:', data);
       //     dashBoardSocket.off("v1-project:response:update", handleResponse); // Clean up
       //   };
-
       //   dashBoardSocket.on("v1-project:response:update", handleResponse);
-
       //   dashBoardSocket.emit("v1:project:update", updateProjects);
       // }
 
@@ -108,9 +106,7 @@ const FileMenu: React.FC = () => {
         projectName
       );
       // 
-    } catch (error) {
+    } catch (error) {}
-
-    }
   };
   return (
     <button

app/src/modules/scene/scene.tsx

@@ -24,53 +24,30 @@ export default function Scene({ layout }: { readonly layout: 'Main Layout' | 'Co
     ], []);
     const { assets } = useAssetsStore();
     const { userId, organization } = getUserData();
-    const { activeModule } = useModuleStore();
     const { projectId } = useParams();
     const { projectSocket } = useSocketStore();
+    const { activeModule } = useModuleStore();
     const { loadingProgress } = useLoadingProgress();
     const handleUpdatingProject = async () => {
-        if (!projectId) return;
+        if (!projectId && loadingProgress > 1) return;
         try {
             const projects = await getAllProjects(userId, organization);
             let projectUuid = projects.Projects.find(
                 (val: any) => val.projectUuid === projectId || val._id === projectId
             );
-
+            const canvas =
-
+                document.getElementById("sceneCanvas")?.children[0]?.children[0];
-            if (activeModule === "builder" && loadingProgress !== 1) {
+            const screenshotDataUrl = (canvas as HTMLCanvasElement)?.toDataURL("image/png");
-                const canvas =
+            const updateProjects = {
-                    document.getElementById("sceneCanvas")?.children[0]?.children[0];
+                projectId: projectUuid,
-                const screenshotDataUrl = (canvas as HTMLCanvasElement)?.toDataURL("image/png");
+                organization,
-                setTimeout(() => {
+                userId,
-                    const updateProjects = {
+                projectName: projectUuid.projectName,
-                        projectId: projectUuid,
+                thumbnail: screenshotDataUrl,
-                        organization,
+            };
-                        userId,
+            if (projectSocket) {
-                        projectName: projectUuid.projectName,
+                projectSocket.emit("v1:project:update", updateProjects);
-                        thumbnail: screenshotDataUrl,
-                    };
-                    if (projectSocket) {
-                        projectSocket.emit("v1:project:update", updateProjects);
-                    }
-                }, 8000);
-            } else {
-                const canvas =
-                    document.getElementById("sceneCanvas")?.children[0]?.children[0];
-                const screenshotDataUrl = (canvas as HTMLCanvasElement)?.toDataURL("image/png");
-                const updateProjects = {
-                    projectId: projectUuid,
-                    organization,
-                    userId,
-                    projectName: projectUuid.projectName,
-                    thumbnail: screenshotDataUrl,
-                };
-                // console.log('screenshotDataUrl: ', screenshotDataUrl);
-                // console.log('updateProjects: ', updateProjects);
-                if (projectSocket) {
-                    projectSocket.emit("v1:project:update", updateProjects);
-                }
             }
-
         } catch (error) { }
     };
     useEffect(() => {

app/src/utils/shortcutkeys/detectModifierKeys.ts

@@ -1,31 +1,35 @@
 // Function to detect if Shift, Ctrl, Alt, or combinations are pressed
 // and return the corresponding key combination string
 export const detectModifierKeys = (event: KeyboardEvent): string => {
-    const modifiers = [
+  const modifiers = [
-        event.ctrlKey ? "Ctrl" : "",
+    event.ctrlKey ? "Ctrl" : "",
-        event.altKey ? "Alt" : "",
+    event.altKey ? "Alt" : "",
-        event.shiftKey ? "Shift" : "",
+    event.shiftKey ? "Shift" : "",
-        event.metaKey ? "Meta" : "" // Add support for Command/Win key
+    event.metaKey ? "Meta" : "", // Add support for Command/Win key
-    ].filter(Boolean);
+  ].filter(Boolean);
 
-    // Ignore modifier keys when they're pressed alone
+  // Ignore modifier keys when they're pressed alone
-    const isModifierKey = [
+  const isModifierKey = [
-        "Control", "Shift", "Alt", "Meta",
+    "Control",
-        "Ctrl", "AltGraph", "OS" // Additional modifier key aliases
+    "Shift",
-    ].includes(event.key);
+    "Alt",
+    "Meta",
+    "Ctrl",
+    "AltGraph",
+    "OS", // Additional modifier key aliases
+  ].includes(event.key);
 
-    const mainKey = isModifierKey ? "" : event.key.toUpperCase();
+  const mainKey = isModifierKey ? "" : event.key.toUpperCase();
 
-    // Handle special cases for keys with different representations
+  // Handle special cases for keys with different representations
-    const normalizedKey = mainKey === " " ? "Space" : mainKey;
+  const normalizedKey = mainKey === " " ? "Space" : mainKey;
-  
 
-    // Build the combination string
+  // Build the combination string
-    if (modifiers.length > 0 && normalizedKey) {
+  if (modifiers.length > 0 && normalizedKey) {
-        return `${modifiers.join("+")}+${normalizedKey}`;
+    return `${modifiers.join("+")}+${normalizedKey}`;
-    } else if (modifiers.length > 0) {
+  } else if (modifiers.length > 0) {
-        return modifiers.join("+");
+    return modifiers.join("+");
-    } else {
+  } else {
-        return normalizedKey;
+    return normalizedKey;
-    }
+  }
 };