edit mode added

This commit is contained in:
Amit Fainholts
2022-01-26 20:31:04 +02:00
parent e39641f59a
commit b73bb69491
3 changed files with 22 additions and 13 deletions

View File

@@ -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 = {}}) => {

View File

@@ -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>

View File

@@ -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>