fix: Fix an issue where add/edit workspace is not working properly (#99)

awslabs · Mar 13, 2024 · 42e35b1 · 42e35b1
1 parent 168e32e
commit 42e35b1
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 10 deletions.
diff --git a/packages/threat-composer/src/components/workspaces/EditWorkspace/index.tsx b/packages/threat-composer/src/components/workspaces/EditWorkspace/index.tsx
@@ -21,7 +21,7 @@ import { InputProps } from '@cloudscape-design/components/input';
 import Modal from '@cloudscape-design/components/modal';
 import SpaceBetween from '@cloudscape-design/components/space-between';
 import React, { FC, RefObject, useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { WorkspaceSchema } from '../../../customTypes';
+import { WorkspaceSchema, Workspace } from '../../../customTypes';
 import Input from '../../generic/Input';
 
 export interface EditWorkspaceProps {
@@ -30,22 +30,36 @@ export interface EditWorkspaceProps {
   onConfirm: (workspace: string) => Promise<void>;
   value?: string;
   editMode?: boolean;
+  currentWorkspace?: Workspace;
+  workspaceList: Workspace[];
 }
 
 const EditWorkspace: FC<EditWorkspaceProps> = ({
   visible,
   setVisible,
   onConfirm,
   editMode = false,
+  workspaceList,
+  currentWorkspace,
   ...props
 }) => {
-  const inputRef= useRef<InputProps.Ref>();
+  const inputRef = useRef<InputProps.Ref>();
   const [value, setValue] = useState(props.value || '');
+  const [errorText, setErrorText] = useState('');
+
+  useEffect(() => {
+    setErrorText('');
+  }, [value]);
 
   const handleConfirm = useCallback(async () => {
-    await onConfirm(value);
-    setVisible(false);
-  }, [onConfirm, value]);
+    setErrorText('');
+    if (workspaceList.find(x => x.name === value && (!currentWorkspace || currentWorkspace.id !== x.id))) {
+      setErrorText('A workspace already exists with that name');
+    } else {
+      await onConfirm(value);
+      setVisible(false);
+    }
+  }, [onConfirm, value, workspaceList, currentWorkspace]);
 
   useEffect(() => {
     inputRef.current?.focus();
@@ -71,6 +85,7 @@ const EditWorkspace: FC<EditWorkspaceProps> = ({
     <SpaceBetween direction="vertical" size="m">
       <FormField
         label="Workspace name"
+        errorText={errorText}
       >
         <Input ref={inputRef as RefObject<InputProps.Ref>}
           value={value}

diff --git a/packages/threat-composer/src/components/workspaces/WorkspaceSelector/index.tsx b/packages/threat-composer/src/components/workspaces/WorkspaceSelector/index.tsx
@@ -41,7 +41,7 @@ import {
 import useImportExport from '../../../hooks/useExportImport';
 import useRemoveData from '../../../hooks/useRemoveData';
 import isWorkspaceExample from '../../../utils/isWorkspaceExample';
-import AddWorkspace from '../../workspaces/EditWorkspace';
+import EditWorkspace from '../../workspaces/EditWorkspace';
 import FileImport from '../../workspaces/FileImport';
 
 export interface WorkspaceSelectorProps {
@@ -367,23 +367,26 @@ const WorkspaceSelector: FC<PropsWithChildren<WorkspaceSelectorProps>> = ({
         />
       )}
       {addWorkspaceModalVisible && (
-        <AddWorkspace
+        <EditWorkspace
           visible={addWorkspaceModalVisible}
           setVisible={setAddWorkspaceModalVisible}
           onConfirm={async (workspaceName: string) => {
             await addWorkspace(workspaceName);
           }}
+          workspaceList={workspaceList}
         />
       )}
       {editWorkspaceModalVisible && currentWorkspace && (
-        <AddWorkspace
+        <EditWorkspace
           visible={editWorkspaceModalVisible}
           setVisible={setEditWorkspaceModalVisible}
           editMode
           value={currentWorkspace.name}
           onConfirm={(newWorkspaceName) =>
             renameWorkspace(currentWorkspace.id, newWorkspaceName)
           }
+          currentWorkspace={currentWorkspace}
+          workspaceList={workspaceList}
         />
       )}
       {removeDataModalVisible && (

diff --git a/packages/threat-composer/src/contexts/WorkspacesContext/index.tsx b/packages/threat-composer/src/contexts/WorkspacesContext/index.tsx
@@ -92,7 +92,7 @@ const WorkspacesContextProvider: FC<WorkspacesContextProviderProps> = ({
       storageType,
       metadata,
     };
-    setWorkspaceList(prev => prev.find(p => p.name === workspaceName) ? [...prev] : [...prev, newWorkspace]);
+    setWorkspaceList(prev => [...prev, newWorkspace]);
     setCurrentWorkspace(newWorkspace);
     onWorkspaceChanged?.(newWorkspace.id);
     return newWorkspace;
@@ -105,7 +105,7 @@ const WorkspacesContextProvider: FC<WorkspacesContextProviderProps> = ({
   const handleRenameWorkspace = useCallback(async (id: string, newWorkspaceName: string) => {
     setWorkspaceList(prev => {
       const index = prev.findIndex(w => w.id === id);
-      const newList = [... index <= 1 ? [] : prev.slice(0, index - 1), {
+      const newList = [... index < 1 ? [] : prev.slice(0, index), {
         id,
         name: newWorkspaceName,
       }, ...prev.slice(index + 1)];