From 8b83694c8120df4748cca83864694b3d27699078 Mon Sep 17 00:00:00 2001
From: yash <yp969803@gmail.com>
Date: Mon, 22 Jan 2024 00:24:39 +0530
Subject: [PATCH] feat: add people in workspace

---
 src/app/routes/BasicRoutes.tsx                |   2 +
 src/features/WorkspaceAddMember/index.tsx     | 150 +++---------------
 .../components/MemberCard.tsx                 |   5 +-
 3 files changed, 25 insertions(+), 132 deletions(-)

diff --git a/src/app/routes/BasicRoutes.tsx b/src/app/routes/BasicRoutes.tsx
index af764be..99206de 100644
--- a/src/app/routes/BasicRoutes.tsx
+++ b/src/app/routes/BasicRoutes.tsx
@@ -11,6 +11,7 @@ import Workspace from 'features/workspace';
 import EditWorkspace from 'features/EditWorkspace';
 import EditProject from 'features/EditProject';
 import WorkspaceMembers from 'features/workspace-members ';
+import WorkspaceAddMember from 'features/WorkspaceAddMember';
 
 const BasicRoutes = () => {
   return (
@@ -24,6 +25,7 @@ const BasicRoutes = () => {
       <Route path={'/editWorkspace/:spaceName'} element ={<EditWorkspace/>} />
       <Route path={'/editProject/:spaceName/:projectName'} element={<EditProject/>}/>
       <Route path={'/workspaceMembers/:spaceName'} element={<WorkspaceMembers/>}/>
+      <Route path={"/workspaceAddMembers/:spaceName"} element={<WorkspaceAddMember/>} />
       <Route path={'/*'} element={<Error />} />
       {/* <Route path={'/testing'} element={<ProjectMembers />} /> */}
     </Routes>
diff --git a/src/features/WorkspaceAddMember/index.tsx b/src/features/WorkspaceAddMember/index.tsx
index de46672..2075c46 100644
--- a/src/features/WorkspaceAddMember/index.tsx
+++ b/src/features/WorkspaceAddMember/index.tsx
@@ -1,9 +1,9 @@
 import { getAllUser, getUser } from 'app/api/user';
 import React, { ChangeEvent, useContext, useEffect, useState } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, useParams } from 'react-router-dom';
 import { useQuery } from 'react-query';
 import toast from 'react-hot-toast';
-import { addOrg, addOrgMembers, getAllOrgs } from 'app/api/organization';
+import { addOrg, addOrgMembers, getAllOrgs, getOrgMembers } from 'app/api/organization';
 import { uploadIcon } from 'app/api/file';
 
 import './index.scss';
@@ -14,35 +14,27 @@ const WorkspaceAddMember = () => {
   const token = localStorage.getItem('token');
   const userContext = useContext(UserContext);
 
-  const [selectedFile, setSelectedFile] = useState<File | null>(null);
-  const [name, SetName] = useState<string | null>(null);
-  const [description, setDiscription] = useState<string | null>(null);
-  const [validDescription, setValidDescription] = useState<boolean>(true);
-  const [validName, setValidName] = useState<boolean>(false);
-  const [uniqueName, setUniqueName] = useState<boolean>(false);
   const [members, setMembers] = useState<string[]>([]);
   const [memberName, setMemberName] = useState<string | null>(null);
-
+  const [orgMembers, setOrgMembers] = useState<string[]>([])
   const [users, setUsers] = useState<string[]>([]);
-  const [orgs, setOrgs] = useState<string[]>([]);
+  const {spaceName} = useParams()
 
   const dataFetch = async () => {
     try {
-      if (token) {
+      if (token&&spaceName) {
         const users_aray: string[] = [];
-        const org_aray: string[] = [];
+    
         const allUser = await getAllUser(token);
-        const allOrgs = await getAllOrgs(token);
+        const orgMembers = await getOrgMembers(token,spaceName)
         allUser.data.users.forEach((user) => {
           users_aray.push(user.username);
         });
+        setOrgMembers(Object.keys(orgMembers.data.members))
 
-        allOrgs.data.organizations.forEach((org) => {
-          org_aray.push(org.name);
-        });
 
         setUsers(users_aray);
-        setOrgs(org_aray);
+     
       }
     } catch (e) {}
   };
@@ -51,52 +43,17 @@ const WorkspaceAddMember = () => {
     dataFetch();
   }, []);
 
-  const allowedFieTypes = ['image/jpeg', 'image/jpg', 'image/png'];
-
-  const handleFileChange = (event: ChangeEvent<HTMLInputElement>) => {
-    const file = event.target.files?.[0];
 
-    if (file) {
-      if (allowedFieTypes.includes(file.type)) {
-        setSelectedFile(file);
-      } else {
-        setSelectedFile(null);
-        toast.error('Invalid file type');
-      }
-    }
-  };
 
-  function valid_name(str: string): boolean {
-    // Define a regular expression for special characters (excluding letters, digits, and spaces)
-    const specialCharacters = /^[a-zA-Z0-9_-]+$/;
 
-    // Check if the string contains any special characters
-    return specialCharacters.test(str) && !str.endsWith('-userspace');
-  }
-
-  function isUniqueName(str: string): boolean {
-    return !orgs.includes(str);
-  }
-
-  const handleNameChange = (event: ChangeEvent<HTMLInputElement>) => {
-    SetName(event.target.value);
-    setUniqueName(() => isUniqueName(event.target.value));
-    setValidName(() => valid_name(event.target.value));
-  };
-
-  const handleDesriptionChange = (event: ChangeEvent<HTMLInputElement>) => {
-    setDiscription(event.target.value);
-    if (description?.length) {
-      setValidDescription(description.length < 200);
-    }
-  };
 
   const addMembers = () => {
     if (memberName) {
       if (
         users.includes(memberName) &&
         memberName != userContext?.username &&
-        !members.includes(memberName)
+        !members.includes(memberName)&&
+        !orgMembers.includes(memberName)
       ) {
         setMembers([...members, memberName]);
         setMemberName(null);
@@ -120,36 +77,23 @@ const WorkspaceAddMember = () => {
   };
   const SubmitHandler = async (): Promise<void> => {
     if (
-      description &&
-      token &&
-      name &&
-      validName &&
-      uniqueName &&
-      validDescription
+
+      token 
+   
     ) {
       const func = async (): Promise<void> => {
-        const dataRes = await addOrg(token, {
-          name: name,
-          description: description,
-        });
-
-        try {
-          if (selectedFile != null) {
-            const fileRes = uploadIcon(token, name, selectedFile);
-          }
-        } catch (e) {}
-        if (members.length > 0) {
+        if (members.length > 0&&spaceName) {
           try {
-            const addMmebersRes = await addOrgMembers(token, name, members);
+            const addMmebersRes = await addOrgMembers(token, spaceName, members);
           } catch (e) {}
         }
         navigate('/');
       };
 
       toast.promise(func(), {
-        loading: 'Saving Workspace',
-        success: <b>Workspace saved</b>,
-        error: <b>Could not save</b>,
+        loading: 'On Progress',
+        success: <b>Members added</b>,
+        error: <b>Could not add</b>,
       });
     } else {
       toast.error('Invalid inputs');
@@ -159,60 +103,10 @@ const WorkspaceAddMember = () => {
   return (
     <div className='main_aworkspace_container'>
       <div className='addworkspace-form-container'>
+      
+        
         <div className='single-form-element-container'>
-          <label className='label'>Add Icon</label>
-          <div className='file-input-container'>
-            <label htmlFor='icon-file' className='file-label'>
-              Choose image files here
-            </label>
-            <input
-              type='file'
-              id='icon-file'
-              className='custom-file-input'
-              onChange={handleFileChange}
-            />
-            <p>Supported formats: JPEG, JPG, PNG</p>
-            <p>Selected File: {selectedFile?.name}</p>
-          </div>
-        </div>
-        <div className='single-form-element-container'>
-          <label className='label' htmlFor='workspace-name'>
-            Name
-          </label>
-          <input
-            type='text'
-            className='custom-input'
-            id='workspace-name'
-            value={name ? name : ''}
-            onChange={handleNameChange}
-            placeholder='workspace name'
-          />
-          {!name ? <p>Name feild should not be empty</p> : <></>}
-          {!validName && name ? <p>Not a valid name</p> : <></>}
-          {!uniqueName && name ? (
-            <p>Name already taken. Try another name</p>
-          ) : (
-            <></>
-          )}
-        </div>
-        <div className='single-form-element-container'>
-          <label className='label' htmlFor='workspace-description'>
-            Description
-          </label>
-          <input
-            id='workspace-description'
-            type='text'
-            className='custom-input'
-            value={description ? description : ''}
-            onChange={handleDesriptionChange}
-            placeholder='workspace description'
-          />
-          {!description ? <p>Description feild should not be empty</p> : <></>}
-          {!validDescription ? (
-            <p>Characters length should be less than 200</p>
-          ) : (
-            <></>
-          )}
+         
           <div className='add-member-container'>
             <input
               type='text'
diff --git a/src/features/workspace-members /components/MemberCard.tsx b/src/features/workspace-members /components/MemberCard.tsx
index f3a5011..fe4a561 100644
--- a/src/features/workspace-members /components/MemberCard.tsx	
+++ b/src/features/workspace-members /components/MemberCard.tsx	
@@ -38,11 +38,8 @@ const MemberCard = ({
   const HandleRoleChange= async(event:ChangeEvent<HTMLSelectElement>)=>{
     
     const new_role= event.target.value
-    console.log("helo")
     if(token&&spaceName&&orgMembers&&new_role!=role){
-        console.log("chu")
-        console.log({[name]:new_role})
-        
+    
 
         const func= async()=>{
           console.log({[name]:new_role})