From 2ceb605b7b446707d3ef835de0209e10c39a81f2 Mon Sep 17 00:00:00 2001
From: salam dalloul <salamdalloul93@gmail.com>
Date: Thu, 8 Aug 2024 23:06:43 +0200
Subject: [PATCH] update the workspaces, selected workspaces and view mode
 properly when creating the workspace

---
 .../frontend/src/components/AppLauncher.tsx   |  5 ++--
 .../src/components/ViewerContainer/Header.tsx | 12 ++++++----
 .../src/components/WorkspaceComponent.tsx     | 24 +++++++++++++------
 3 files changed, 28 insertions(+), 13 deletions(-)

diff --git a/applications/visualizer/frontend/src/components/AppLauncher.tsx b/applications/visualizer/frontend/src/components/AppLauncher.tsx
index 90352b47..4c1a966b 100644
--- a/applications/visualizer/frontend/src/components/AppLauncher.tsx
+++ b/applications/visualizer/frontend/src/components/AppLauncher.tsx
@@ -4,14 +4,14 @@ import { useGlobalContext } from "../contexts/GlobalContext.tsx";
 import { parseURLParams } from "../helpers/parseURLHelper.ts";
 import { TEMPLATE_ACTIVE_DATASETS, TEMPLATE_ACTIVE_NEURONS } from "../settings/templateWorkspaceSettings.ts";
 function AppLauncher() {
-  const { workspaces, createWorkspace, setCurrentWorkspace } = useGlobalContext();
+  const { workspaces, createWorkspace, setCurrentWorkspace, setSelectedWorkspacesIds } = useGlobalContext();
 
   const handleTemplateClick = async () => {
     const workspaceId = `workspace-${Date.now()}`;
     const workspaceName = `Template Workspace ${Object.keys(workspaces).length + 1}`;
-
     createWorkspace(workspaceId, workspaceName, new Set(TEMPLATE_ACTIVE_DATASETS), new Set(TEMPLATE_ACTIVE_NEURONS));
     setCurrentWorkspace(workspaceId);
+    setSelectedWorkspacesIds(new Set<string>([workspaceId]));
   };
 
   const handleBlankClick = () => {
@@ -20,6 +20,7 @@ function AppLauncher() {
 
     createWorkspace(workspaceId, workspaceName, new Set(TEMPLATE_ACTIVE_DATASETS));
     setCurrentWorkspace(workspaceId);
+    setSelectedWorkspacesIds(new Set<string>([workspaceId]));
   };
 
   const handlePasteUrlClick = () => {
diff --git a/applications/visualizer/frontend/src/components/ViewerContainer/Header.tsx b/applications/visualizer/frontend/src/components/ViewerContainer/Header.tsx
index b8402c15..f72e97f6 100644
--- a/applications/visualizer/frontend/src/components/ViewerContainer/Header.tsx
+++ b/applications/visualizer/frontend/src/components/ViewerContainer/Header.tsx
@@ -121,18 +121,22 @@ const Header = ({
   const onClick = (_: React.MouseEvent, index: number) => {
     updateActiveState(index);
   };
-
   const onClose = () => {
     setShowModal(false);
     const newIndex = Array.from(selectedWorkspacesIds).length >= 2 ? 1 : 0;
-    setActive(newIndex);
-    setViewMode(ViewMode.Compare);
+    if (Object.keys(workspaces).length > 1) {
+      setActive(newIndex);
+      setViewMode(ViewMode.Compare);
+    } else {
+      setActive(0);
+      setViewMode(ViewMode.Default);
+    }
   };
 
   useEffect(() => {
     const newIndex = Array.from(selectedWorkspacesIds).length >= 2 ? 1 : 0;
     setActive(newIndex);
-  }, [selectedWorkspacesIds, viewMode]);
+  }, [selectedWorkspacesIds]);
 
   return (
     <>
diff --git a/applications/visualizer/frontend/src/components/WorkspaceComponent.tsx b/applications/visualizer/frontend/src/components/WorkspaceComponent.tsx
index 0c712603..c57c0953 100644
--- a/applications/visualizer/frontend/src/components/WorkspaceComponent.tsx
+++ b/applications/visualizer/frontend/src/components/WorkspaceComponent.tsx
@@ -34,7 +34,7 @@ const LoadingComponent = () => (
 
 function WorkspaceComponent({ sidebarOpen }) {
   const dispatch = useDispatch();
-  const { workspaces, setCurrentWorkspace, removeWorkspace, selectedWorkspacesIds, setSelectedWorkspacesIds, setAllWorkspaces, setViewMode } =
+  const { workspaces, setCurrentWorkspace, removeWorkspace, selectedWorkspacesIds, setSelectedWorkspacesIds, setAllWorkspaces, setViewMode, viewMode } =
     useGlobalContext();
 
   const workspaceId = useSelector((state: RootState) => state.workspaceId);
@@ -66,13 +66,10 @@ function WorkspaceComponent({ sidebarOpen }) {
   };
 
   const onClickWorkspace = (workspace) => {
-    const updatedIds = Array.from(selectedWorkspacesIds);
+    let updatedIds = Array.from(selectedWorkspacesIds);
     const index = updatedIds.indexOf(workspaceId);
-    if (index !== -1) {
-      updatedIds[index] = workspace.id;
-    } else {
-      updatedIds.push(workspace.id);
-    }
+
+    updatedIds = updateIds(updatedIds, index, workspace.id, viewMode);
 
     const newSelectedWorkspacesIds = new Set(updatedIds);
     setCurrentWorkspace(workspace.id);
@@ -94,6 +91,19 @@ function WorkspaceComponent({ sidebarOpen }) {
 
     setAllWorkspaces(sortedWorkspacesRecord);
   };
+
+  const updateIds = (ids, index, id, viewMode) => {
+    if (index !== -1) {
+      ids[index] = id;
+    } else {
+      if (viewMode === ViewMode.Compare) {
+        ids.push(id);
+      } else {
+        ids = [id];
+      }
+    }
+    return ids;
+  };
   const handleMouseEnter = (workspaceId) => {
     setHoveredWorkspaceId(workspaceId);
   };