diff --git a/ui/src/components/Modals/AddUserModal/AddUserModal.sass b/ui/src/components/Modals/AddUserModal/AddUserModal.sass
index 06dfc9e98..cc1bc8549 100644
--- a/ui/src/components/Modals/AddUserModal/AddUserModal.sass
+++ b/ui/src/components/Modals/AddUserModal/AddUserModal.sass
@@ -1 +1 @@
-.AddUserModal {}
\ No newline at end of file
+// .AddUserModal {}
\ No newline at end of file
diff --git a/ui/src/components/Modals/AddUserModal/AddUserModal.tsx b/ui/src/components/Modals/AddUserModal/AddUserModal.tsx
index 7223d7560..1e63d9c46 100644
--- a/ui/src/components/Modals/AddUserModal/AddUserModal.tsx
+++ b/ui/src/components/Modals/AddUserModal/AddUserModal.tsx
@@ -1,6 +1,6 @@
 import React, { FC, useEffect, useState } from 'react';
 import ConfirmationModal from '../../UI/Modals/ConfirmationModal';
-import './AddUserModal.less';
+import './AddUserModal.sass';
 
 interface AddUserModalProps {
   isOpen : boolean
diff --git a/ui/src/components/Modals/AddWorkspaceModal/AddWorkspaceModal.ts b/ui/src/components/Modals/AddWorkspaceModal/AddWorkspaceModal.tsx
similarity index 76%
rename from ui/src/components/Modals/AddWorkspaceModal/AddWorkspaceModal.ts
rename to ui/src/components/Modals/AddWorkspaceModal/AddWorkspaceModal.tsx
index 9e5c18996..daef3e025 100644
--- a/ui/src/components/Modals/AddWorkspaceModal/AddWorkspaceModal.ts
+++ b/ui/src/components/Modals/AddWorkspaceModal/AddWorkspaceModal.tsx
@@ -2,11 +2,11 @@ import React, { FC, useEffect, useState } from 'react';
 import ConfirmationModal from '../../UI/Modals/ConfirmationModal';
 // import './AddUserModal.sass';
 
-interface AddUserModalProps {
+interface AddWorkspaceModal {
   isOpen : boolean
 }
 
-const AddUserModal: FC<AddUserModalProps> = ({isOpen}) => {
+const AddWorkspaceModal: FC<AddWorkspaceModal> = ({isOpen,children}) => {
 
   const [isOpenModal,setIsOpen] = useState(isOpen)
 
@@ -20,9 +20,9 @@ const AddUserModal: FC<AddUserModalProps> = ({isOpen}) => {
 
   return (<>
     <ConfirmationModal isOpen={isOpenModal} onClose={onClose} onConfirm={onConfirm} title=''>
-      
+      {children}
     </ConfirmationModal>
     </>); 
 };
 
-export default AddUserModal;
+export default AddWorkspaceModal;
diff --git a/ui/src/components/WorkspaceSettings/WorkspaceSettings.tsx b/ui/src/components/WorkspaceSettings/WorkspaceSettings.tsx
index d279cfa26..ad6cefe3c 100644
--- a/ui/src/components/WorkspaceSettings/WorkspaceSettings.tsx
+++ b/ui/src/components/WorkspaceSettings/WorkspaceSettings.tsx
@@ -2,6 +2,8 @@ import "../UserSettings/UserSettings.sass"
 import {ColsType, FilterableTableAction} from "../UI/FilterableTableAction"
 // import Api from "../../helpers/api"
 import { useEffect, useState } from "react";
+import AddWorkspaceModal from "../Modals/AddWorkspaceModal/AddWorkspaceModal";
+import SelectList from "../UI/SelectList";
 
 interface Props {}
 
@@ -10,7 +12,10 @@ interface Props {}
 export const WorkspaceSettings : React.FC<Props> = ({}) => {
 
     const [workspacesRows, setWorkspaces] = useState([]);
-    const cols : ColsType[] = [{field : "id",header:"Id"},{field : "name",header:"Name"}]
+    const [isOpenModal,setIsOpen] = useState(false);
+    const cols : ColsType[] = [{field : "id",header:"Id"},{field : "name",header:"Name"}];
+
+    const namespaces = {"default": false, "blabla": false, "test":true};
 
 
     useEffect(() => {
@@ -25,10 +30,8 @@ export const WorkspaceSettings : React.FC<Props> = ({}) => {
     },[])
 
     const filterFuncFactory = (searchQuery: string) => {
-        return (row) => {
-            return row.name.toLowerCase().includes(searchQuery.toLowerCase())
+            return (row) => row.name.toLowerCase().includes(searchQuery.toLowerCase())
         }
-    }
 
     const searchConfig = { searchPlaceholder: "Search Workspace",filterRows: filterFuncFactory}
     
@@ -42,10 +45,17 @@ export const WorkspaceSettings : React.FC<Props> = ({}) => {
 
     }
 
-    const buttonConfig = {onClick: () => {}, text:"Add Workspace"}
+    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}>
+            <SelectList valuesListInput={namespaces} tableName={"Namespaces"} multiSelect={false} setValues={function (newValues: any): void {
+                throw new Error("Function not implemented.");
+            } } tabelClassName={undefined}></SelectList>
+            
+        </AddWorkspaceModal>
     </>);
 }
+