From b73bb69491afe3e54490d9e75235ced29d49c0ee Mon Sep 17 00:00:00 2001
From: Amit Fainholts <amit@up9.com>
Date: Wed, 26 Jan 2022 20:31:04 +0200
Subject: [PATCH] edit mode added

---
 .../Modals/AddUserModal/AddUserModal.tsx        |  4 ++--
 .../AddWorkspaceModal/AddWorkspaceModal.tsx     | 14 +++++++++-----
 .../WorkspaceSettings/WorkspaceSettings.tsx     | 17 +++++++++++------
 3 files changed, 22 insertions(+), 13 deletions(-)

diff --git a/ui/src/components/Modals/AddUserModal/AddUserModal.tsx b/ui/src/components/Modals/AddUserModal/AddUserModal.tsx
index 7b5e24d32..2e80baf98 100644
--- a/ui/src/components/Modals/AddUserModal/AddUserModal.tsx
+++ b/ui/src/components/Modals/AddUserModal/AddUserModal.tsx
@@ -1,6 +1,6 @@
 import { Button, FormControl, InputLabel, MenuItem, Select } from '@material-ui/core';
 import { FC, useEffect, useState } from 'react';
-// import Api from '../../../helpers/api';
+import Api from '../../../helpers/api';
 import { useCommonStyles } from '../../../helpers/commonStyle';
 import ConfirmationModal from '../../UI/Modals/ConfirmationModal';
 import SelectList from '../../UI/SelectList';
@@ -19,7 +19,7 @@ interface AddUserModalProps {
   userData : UserData;
 }
 
-// const api = Api.getInstance();
+const api = Api.getInstance();
 
 export const AddUserModal: FC<AddUserModalProps> = ({isOpen, onCloseModal, userData = {}}) => {
 
diff --git a/ui/src/components/Modals/AddWorkspaceModal/AddWorkspaceModal.tsx b/ui/src/components/Modals/AddWorkspaceModal/AddWorkspaceModal.tsx
index 66c57692a..d88d150d4 100644
--- a/ui/src/components/Modals/AddWorkspaceModal/AddWorkspaceModal.tsx
+++ b/ui/src/components/Modals/AddWorkspaceModal/AddWorkspaceModal.tsx
@@ -13,17 +13,21 @@ export type WorkspaceData = {
 interface AddWorkspaceModalProp {
   isOpen : boolean,
   onCloseModal: () => void,
-  workspaceData: WorkspaceData
+  workspaceData: WorkspaceData,
+  onEdit: boolean
 }
 
 const api = Api.getInstance();
 
-const AddWorkspaceModal: FC<AddWorkspaceModalProp> = ({isOpen,onCloseModal, workspaceData ={}}) => {
+const AddWorkspaceModal: FC<AddWorkspaceModalProp> = ({isOpen,onCloseModal, workspaceData ={}, onEdit}) => {
 
   const [workspaceDataModel, setUserData] = useState(workspaceData as WorkspaceData);
   const [searchValue, setSearchValue] = useState("");
   const classes = useCommonStyles()
-  const [namespaces, setNamespaces] = useState({})
+  const [namespaces, setNamespaces] = useState({});
+
+  const title = onEdit ? "Edit Workspace" : "Add Workspace";
+
 
   useEffect(() => {
     if(!isOpen) return;
@@ -51,10 +55,10 @@ const AddWorkspaceModal: FC<AddWorkspaceModalProp> = ({isOpen,onCloseModal, work
   const onConfirm = () => {}
 
   return (<>
-    <ConfirmationModal isOpen={isOpen} onClose={onCloseModal} onConfirm={onConfirm} title='Add Workspace'>
+    <ConfirmationModal isOpen={isOpen} onClose={onCloseModal} onConfirm={onConfirm} title={title}>
     <h3 className='headline'>DETAILS</h3>
       <div>
-        <input type="text" value={workspaceDataModel?.name ?? ""} className={classes.textField + " workspace__name"} placeholder={"Workspace Name"} 
+        <input type="text" value={workspaceData?.name ?? ""} className={classes.textField + " workspace__name"} placeholder={"Workspace Name"} 
                onChange={(e) => {}}></input>
         </div>
         <h3 className='headline'>TAP SETTINGS</h3>     
diff --git a/ui/src/components/WorkspaceSettings/WorkspaceSettings.tsx b/ui/src/components/WorkspaceSettings/WorkspaceSettings.tsx
index 8e2030e02..8c3a0ff9c 100644
--- a/ui/src/components/WorkspaceSettings/WorkspaceSettings.tsx
+++ b/ui/src/components/WorkspaceSettings/WorkspaceSettings.tsx
@@ -10,17 +10,20 @@ interface Props {}
 
 export const WorkspaceSettings : React.FC<Props> = ({}) => {
 
-    const [workspacesRows, setWorkspaces] = useState([]);
+    const [workspacesRows, setWorkspacesRows] = useState([]);
     const [workspaceData,SetWorkspaceData] = useState({} as WorkspaceData);
     const [isOpenModal,setIsOpen] = useState(false);
+    const [isEditMode,setIsEditMode] = useState(false);
+
     const cols : ColsType[] = [{field : "id",header:"Id"},{field : "name",header:"Name"}];
 
+    const buttonConfig = {onClick: () => {setIsOpen(true); setIsEditMode(false);SetWorkspaceData({} as WorkspaceData)}, text:"Add Workspace"}
 
     useEffect(() => {
         (async () => {
             try {
                 const workspacesDemo = [{id:"1", name:"Worksapce1"}] 
-                setWorkspaces(workspacesDemo)                  
+                setWorkspacesRows(workspacesDemo)                  
             } catch (e) {
                 console.error(e);
             }
@@ -36,19 +39,21 @@ export const WorkspaceSettings : React.FC<Props> = ({}) => {
     const onRowDelete = (row) => {
         const filterFunc = filterFuncFactory(row.name)
         const newWorkspaceList = workspacesRows.filter(filterFunc)
-        setWorkspaces(newWorkspaceList)
+        setWorkspacesRows(newWorkspaceList)
     }
 
     const onRowEdit = (row) => {
-
+       setIsOpen(true);
+       setIsEditMode(true);
+       SetWorkspaceData(row);
     }
 
-    const buttonConfig = {onClick: () => {setIsOpen(true)}, text:"Add Workspace"}
+    
     return (<>
         <FilterableTableAction onRowEdit={onRowEdit} onRowDelete={onRowDelete} searchConfig={searchConfig} 
                                buttonConfig={buttonConfig} rows={workspacesRows} cols={cols}>
         </FilterableTableAction>
-        <AddWorkspaceModal isOpen={isOpenModal} workspaceData={workspaceData} onCloseModal={() => { setIsOpen(false); } } >
+        <AddWorkspaceModal isOpen={isOpenModal} workspaceData={workspaceData} onEdit={isEditMode} onCloseModal={() => { setIsOpen(false);} } >
 
             
         </AddWorkspaceModal>