From 4b0d9a5c90559f8504c81c0cd55e4434fa20eb53 Mon Sep 17 00:00:00 2001 From: Karthik Ayangar Date: Sun, 19 May 2024 10:06:27 +0530 Subject: [PATCH 1/8] chore: changed feild to field --- frontend/src/features/AddProject/index.tsx | 6 +++--- frontend/src/features/AddWorkspace/index.tsx | 4 ++-- frontend/src/features/EditProject/index.tsx | 6 +++--- frontend/src/features/EditWorkspace/index.tsx | 4 ++-- 4 files changed, 10 insertions(+), 10 deletions(-) diff --git a/frontend/src/features/AddProject/index.tsx b/frontend/src/features/AddProject/index.tsx index d55504c..b6d20b7 100644 --- a/frontend/src/features/AddProject/index.tsx +++ b/frontend/src/features/AddProject/index.tsx @@ -102,7 +102,7 @@ const AddProject = () => { onChange={nameChange} value={name ? name : ''} /> - {!name ? 'Name feild should not be empty' : <>} + {!name ? 'Name field should not be empty' : <>} {name && !isValidName(name) && 'Not a valid name'} {name && !isUnique(name) && 'This project name already exists'}
Project link
@@ -112,7 +112,7 @@ const AddProject = () => { onChange={linkChange} placeholder='Github link of project' /> - {!link ? 'Link feild should not be empty' : <>} + {!link ? 'Link field should not be empty' : <>} {link && !isGitHubRepositoryLink(link) && 'Not a valid github repository link'} @@ -125,7 +125,7 @@ const AddProject = () => { } placeholder='Details about project' /> - {!description ? 'Description feild should not be empty' : <>} + {!description ? 'Description field should not be empty' : <>} {description && description.length >= 200 && 'Description length should not be greater than 200'} diff --git a/frontend/src/features/AddWorkspace/index.tsx b/frontend/src/features/AddWorkspace/index.tsx index 3372f93..ac26709 100644 --- a/frontend/src/features/AddWorkspace/index.tsx +++ b/frontend/src/features/AddWorkspace/index.tsx @@ -191,7 +191,7 @@ const AddWorkspace = () => { onChange={handleNameChange} placeholder='workspace name' /> - {!name ?

Name feild should not be empty

: <>} + {!name ?

Name field should not be empty

: <>} {!validName && name ?

Not a valid name

: <>} {!uniqueName && name ? (

Name already taken. Try another name

@@ -211,7 +211,7 @@ const AddWorkspace = () => { onChange={handleDesriptionChange} placeholder='workspace description' /> - {!description ?

Description feild should not be empty

: <>} + {!description ?

Description field should not be empty

: <>} {!validDescription ? (

Characters length should be less than 200

) : ( diff --git a/frontend/src/features/EditProject/index.tsx b/frontend/src/features/EditProject/index.tsx index b7dd1e8..ea628d4 100644 --- a/frontend/src/features/EditProject/index.tsx +++ b/frontend/src/features/EditProject/index.tsx @@ -111,7 +111,7 @@ const EditProject = () => { onChange={nameChange} value={name ? name : ''} /> - {!name ? 'Name feild should not be empty' : <>} + {!name ? 'Name field should not be empty' : <>} {name && !isValidName(name) && 'Not a valid name'} {name && name != projectName && @@ -124,7 +124,7 @@ const EditProject = () => { onChange={linkChange} placeholder='Github link of project' /> - {!link ? 'Link feild should not be empty' : <>} + {!link ? 'Link field should not be empty' : <>} {link && !isGitHubRepositoryLink(link) && 'Not a valid github repository link'} @@ -137,7 +137,7 @@ const EditProject = () => { } placeholder='Details about project' /> - {!description ? 'Description feild should not be empty' : <>} + {!description ? 'Description field should not be empty' : <>} {description && description.length >= 200 && 'Description length should not be greater than 200'} diff --git a/frontend/src/features/EditWorkspace/index.tsx b/frontend/src/features/EditWorkspace/index.tsx index 4bc35a9..267d9fd 100644 --- a/frontend/src/features/EditWorkspace/index.tsx +++ b/frontend/src/features/EditWorkspace/index.tsx @@ -173,7 +173,7 @@ const EditWorkspace = () => { onChange={handleNameChange} placeholder='workspace name' /> - {!name ?

Name feild should not be empty

: <>} + {!name ?

Name field should not be empty

: <>} {name != spaceName && !validName && name ? (

Not a valid name

) : ( @@ -197,7 +197,7 @@ const EditWorkspace = () => { onChange={handleDesriptionChange} placeholder='workspace description' /> - {!description ?

Description feild should not be empty

: <>} + {!description ?

Description field should not be empty

: <>} {!validDescription ? (

Characters length should be less than 200

) : ( From a04ebd839a031f2ce4c3e27fc06eb84d66030024 Mon Sep 17 00:00:00 2001 From: Karthik Ayangar Date: Sun, 19 May 2024 13:11:06 +0530 Subject: [PATCH 2/8] feat: restructured whole add project form, new validation handler and more Signed-off-by: Karthik Ayangar --- frontend/src/features/AddProject/index.scss | 57 +++-- frontend/src/features/AddProject/index.tsx | 270 ++++++++++++-------- frontend/src/features/AddProject/types.ts | 20 ++ frontend/src/features/AddProject/utils.ts | 14 + 4 files changed, 228 insertions(+), 133 deletions(-) create mode 100644 frontend/src/features/AddProject/types.ts create mode 100644 frontend/src/features/AddProject/utils.ts diff --git a/frontend/src/features/AddProject/index.scss b/frontend/src/features/AddProject/index.scss index f1e4f07..f5211d7 100644 --- a/frontend/src/features/AddProject/index.scss +++ b/frontend/src/features/AddProject/index.scss @@ -1,18 +1,25 @@ .add-project-container { - width: 70vw; - height: 76.5vh; - margin: 60px auto; + width: 80% !important; + margin: 60px auto !important; background: linear-gradient(110.51deg, #141432 0.9%, #2a2a4b 101.51%); border-radius: 20px; display: flex; align-items: center; justify-content: center; position: relative; + max-height: 60vh; +} + +.add-project-form { + width: 100%; + padding: 2rem 4rem; + height: 100%; + overflow-y: scroll; } .add-project-form input { box-sizing: border-box; - + width: 100%; /* Auto layout */ border: 0.8px solid #402aa4; border-radius: 14px; @@ -29,7 +36,10 @@ line-height: 30px; /* identical to box height */ - color: rgba(173, 173, 255, 0.75); + color: rgba(173, 173, 255, 0.957); +} +.add-project-form input::placeholder { + color: rgba(173, 173, 255, 0.957); } .input-title { @@ -43,29 +53,17 @@ color: #8181ff; } -.add-project-btn { +.add-project-btnn { position: absolute; right: 66px; - bottom: 44px; - font-family: 'Poppins'; - font-style: normal; - font-weight: 400; - font-size: 15px; - line-height: 22px; - /* identical to box height */ - - display: flex; - align-items: center; - display: flex; - flex-direction: row; - align-items: flex-start; - padding: 10px 16px; - gap: 2px; - flex: none; - order: 1; - flex-grow: 0; + bottom: 14px; + outline: none; + border: none; + padding: 1rem; + border-radius: 2rem; + font-size: 1rem; + padding: 1rem 2rem; background: #402aa4; - border-radius: 14px; color: #ffffff; } @@ -73,3 +71,12 @@ padding-top: 3px; padding-right: 4px; } + +.form-error { + color: red; + font-size: 14px; /* Adjust as necessary */ + word-wrap: break-word; /* Allows breaking long words */ + white-space: normal; /* Ensures normal word wrapping */ + margin-top: 5px; /* Adds some spacing above the error message */ + +} diff --git a/frontend/src/features/AddProject/index.tsx b/frontend/src/features/AddProject/index.tsx index b6d20b7..24e8589 100644 --- a/frontend/src/features/AddProject/index.tsx +++ b/frontend/src/features/AddProject/index.tsx @@ -1,140 +1,194 @@ -import { ChangeEvent, useEffect, useState } from 'react'; import './index.scss'; -import tick from '../../app/assets/images/tick.png'; +import { useEffect, useState } from 'react'; import { useNavigate, useParams } from 'react-router-dom'; -import toast from 'react-hot-toast'; import { addProject } from 'app/api/project'; -import { Projects, getOrgProjects } from 'app/api/organization'; - +import { Projects, getOrgProjects } from 'app/api/organization'; +import { isGitHubRepositoryLink, isValidName } from './utils'; +import { + _ADD_PROJECT_FORM, + _ADD_PROJECT_FORM_CHANGE, + _ADD_PROJECT_FORM_ERROR, + _FORM_SUBMIT, + _VALIDATE_PROPS, +} from './types'; +import toast from 'react-hot-toast'; +import tick from '../../app/assets/images/tick.png'; const AddProject = () => { const navigate = useNavigate(); const token = localStorage.getItem('token'); const { spaceName } = useParams(); - const [name, setName] = useState(null); - const [description, setDescription] = useState(null); - const [link, setLink] = useState(null); - const [orgProject, setOrgProjects] = useState(null); - const fetchData = async () => { - if (token && spaceName) { - try { - const res = await getOrgProjects(token, spaceName); - setOrgProjects(res.data.projects); - } catch (e) {} + const isUnique = (name: string) => { + if (orgProject && name in orgProject) { + return false; } + return true; }; - useEffect(() => { - fetchData(); - }, [spaceName]); + // form section + const [form, setForm] = useState<_ADD_PROJECT_FORM>({ + name: '', + description: '', + link: '', + }); + const [formErrors, setFormErrors] = useState<_ADD_PROJECT_FORM_ERROR>( + {} as _ADD_PROJECT_FORM_ERROR + ); - const linkChange = async (event: ChangeEvent) => { - setLink(event.target.value); + const validate: _VALIDATE_PROPS = (name, value) => { + switch (name) { + case 'name': + if (!value) { + return 'Name is required'; + } else if (!isValidName(value)) { + return 'Name can only contain alphanumeric characters, hyphens, and underscores'; + } else if (!isUnique(value)) { + return 'Project name already exist'; + } + return ''; + case 'link': + if (!value) { + return 'Project link is required'; + } else if (!isGitHubRepositoryLink(value)) { + return 'Invalid GitHub project link. Ensure it follows the format: https://github.com/username/repo[.git]'; + } + return ''; + case 'description': + if (value.length > 200) { + return 'Description length should not be greater than 200'; + } + return ''; + default: + return ''; + } }; - const nameChange = async (event: ChangeEvent) => { - setName(event.target.value); + const handleChange: _ADD_PROJECT_FORM_CHANGE = (event) => { + const { name, value } = event.target; + setForm({ + ...form, + [name]: value, + }); + }; + const handleBlur = (e: React.FocusEvent) => { + const { name, value } = e.target; + const error = validate(name, value); + setFormErrors({ + ...formErrors, + [name]: error, + }); }; - function isGitHubRepositoryLink(link: string): boolean { - // Define a regular expression pattern for a GitHub repository URL - const githubRepoPattern = - /^https:\/\/github\.com\/[a-zA-Z0-9-]+\/[a-zA-Z0-9-]+(\.git)?$/; - - // Check if the provided link matches the pattern - return githubRepoPattern.test(link); - } - - function isValidName(input: string): boolean { - // Regular expression to match only alphanumeric characters, hyphens, and underscores - const regex = /^[a-zA-Z0-9-_]+$/; + const handleSubmit: _FORM_SUBMIT = (event) => { + event.preventDefault(); + const newErrors: _ADD_PROJECT_FORM_ERROR = Object.keys(form).reduce( + (acc, key) => { + const error = validate(key, form[key as keyof _ADD_PROJECT_FORM]); + if (error) { + acc[key as keyof _ADD_PROJECT_FORM_ERROR] = error; + } + return acc; + }, + {} as _ADD_PROJECT_FORM_ERROR + ); - // Test if the input string matches the regular expression - return regex.test(input); - } + setFormErrors(newErrors); - const isUnique = (name: string) => { - if (orgProject && name in orgProject) { - return false; + if (Object.values(newErrors).every((error) => !error)) { + if (spaceName && token) { + const func = async () => { + const updatedForm = { ...form }; + if (updatedForm.link && !updatedForm.link.endsWith('.git')) { + updatedForm.link = `${updatedForm.link.trim()}.git`; + } + if (!updatedForm.description) { + updatedForm.description = ' '; + } + const res = await addProject(token, spaceName, updatedForm); + // console.log(res); + // TODO: Update some stuff if the link is case sensitive + navigate(`/workspace/${spaceName}`); + }; + toast.promise(func(), { + loading: 'Saving Project', + success: Project saved, + error: Could not save, + }); + } else { + toast.error('Invalid inputs'); + } + } else { + toast.error('Form contains errors'); } - return true; + console.log('sanas'); }; - const SubmitHandler = async () => { - if ( - spaceName && - token && - name && - link && - isValidName(name) && - isGitHubRepositoryLink(link) && - description && - description?.length < 200 - ) { - const func = async () => { - const res = await addProject(token, spaceName, { - name: name, - description: description, - link: link, - }); - navigate(`/workspace/${spaceName}`); - }; - toast.promise(func(), { - loading: 'Saving Project', - success: Project saved, - error: Could not save, - }); - } else { - toast.error('Invalid inputs'); + const fetchData = async () => { + if (token && spaceName) { + try { + const res = await getOrgProjects(token, spaceName); + setOrgProjects(res.data.projects); + } catch (e) {} } }; + useEffect(() => { + fetchData(); + }, [spaceName]); + return ( -
-
-
-
Name
- - {!name ? 'Name field should not be empty' : <>} - {name && !isValidName(name) && 'Not a valid name'} - {name && !isUnique(name) && 'This project name already exists'} -
Project link
- - {!link ? 'Link field should not be empty' : <>} - {link && - !isGitHubRepositoryLink(link) && - 'Not a valid github repository link'} -
Description
- ) => - setDescription(event.target.value) - } - placeholder='Details about project' - /> - {!description ? 'Description field should not be empty' : <>} - {description && - description.length >= 200 && - 'Description length should not be greater than 200'} -
- -
+
); }; diff --git a/frontend/src/features/AddProject/types.ts b/frontend/src/features/AddProject/types.ts new file mode 100644 index 0000000..5a3fc2f --- /dev/null +++ b/frontend/src/features/AddProject/types.ts @@ -0,0 +1,20 @@ +import { ChangeEvent, FormEvent } from 'react'; + +export type _ADD_PROJECT_FORM_ERROR = { + name: string | null; + description: string | null; + link: string | null; +}; +export type _ADD_PROJECT_FORM = { + name: string; + description: string; + link: string; +}; +export type _ADD_PROJECT_FORM_CHANGE = ( + event: ChangeEvent, + index?: number +) => void; + +export type _FORM_SUBMIT = (event: FormEvent) => void; + +export type _VALIDATE_PROPS = (name: string, value: string) => string; diff --git a/frontend/src/features/AddProject/utils.ts b/frontend/src/features/AddProject/utils.ts new file mode 100644 index 0000000..bfa3530 --- /dev/null +++ b/frontend/src/features/AddProject/utils.ts @@ -0,0 +1,14 @@ +export function isGitHubRepositoryLink(link: string): boolean { + const githubRepoPattern = + /^https:\/\/github\.com\/[a-zA-Z0-9-]+\/[a-zA-Z0-9-]+$/; + const githubRepoPattern2 = + /^https:\/\/github\.com\/[a-zA-Z0-9-]+\/[a-zA-Z0-9-]+(\.git)?$/; + return (githubRepoPattern.test(link) || githubRepoPattern2.test(link)); +} + +export function isValidName(input: string): boolean { + // Regular expression to match only alphanumeric characters, hyphens, and underscores + const regex = /^[a-zA-Z0-9-_]+$/; + // Test if the input string matches the regular expression + return regex.test(input); +} From deaa11f59d151f8a2edadea3c2a334d2f1a9c48a Mon Sep 17 00:00:00 2001 From: Karthik Ayangar Date: Sun, 19 May 2024 16:36:19 +0530 Subject: [PATCH 3/8] feat: restructured workspace add form Signed-off-by: Karthik Ayangar --- frontend/src/features/AddProject/index.tsx | 4 +- frontend/src/features/AddWorkspace/index.scss | 8 + frontend/src/features/AddWorkspace/index.tsx | 336 ++++++++++-------- frontend/src/features/AddWorkspace/types.ts | 23 ++ 4 files changed, 218 insertions(+), 153 deletions(-) create mode 100644 frontend/src/features/AddWorkspace/types.ts diff --git a/frontend/src/features/AddProject/index.tsx b/frontend/src/features/AddProject/index.tsx index 24e8589..2a7a0bc 100644 --- a/frontend/src/features/AddProject/index.tsx +++ b/frontend/src/features/AddProject/index.tsx @@ -147,7 +147,7 @@ const AddProject = () => { autoComplete='off' noValidate > -
Name
+
Name*
{ required /> {formErrors.name &&

{formErrors.name}

} -
Project link
+
Project link*
{ const navigate = useNavigate(); const token = localStorage.getItem('token'); const userContext = useContext(UserContext); - - const [selectedFile, setSelectedFile] = useState(null); - const [name, SetName] = useState(null); - const [description, setDiscription] = useState(null); - const [validDescription, setValidDescription] = useState(true); - const [validName, setValidName] = useState(false); - const [uniqueName, setUniqueName] = useState(false); - const [members, setMembers] = useState([]); - const [memberName, setMemberName] = useState(null); + const [form, setForm] = useState<_WORKSPACE_FORM>({ + workspace: '', + description: '', + members: [], + image: undefined, + member: '', + }); + const [formErrors, setFormErrors] = useState<_WORKSPACE_FORM_ERROR>( + {} as _WORKSPACE_FORM_ERROR + ); const [users, setUsers] = useState([]); const [orgs, setOrgs] = useState([]); - const dataFetch = async () => { - try { - if (token) { - const users_aray: string[] = []; - const org_aray: string[] = []; - const allUser = await getAllUser(token); - const allOrgs = await getAllOrgs(token); - allUser.data.users.forEach((user) => { - users_aray.push(user.username); - }); - - allOrgs.data.organizations.forEach((org) => { - org_aray.push(org.name); - }); - - setUsers(users_aray); - setOrgs(org_aray); - } - } catch (e) {} - }; - - useEffect(() => { - dataFetch(); - }, []); - - const allowedFieTypes = ['image/jpeg', 'image/jpg', 'image/png']; - - const handleFileChange = (event: ChangeEvent) => { - 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 { + function isValidName(str: string): boolean { // Define a regular expression for special characters (excluding letters, digits, and spaces) const specialCharacters = /^[a-zA-Z0-9_-]+$/; @@ -75,76 +43,123 @@ const AddWorkspace = () => { return specialCharacters.test(str) && !str.endsWith('-userspace'); } - function isUniqueName(str: string): boolean { + function isUnique(str: string): boolean { return !orgs.includes(str); } - const handleNameChange = (event: ChangeEvent) => { - SetName(event.target.value); - setUniqueName(() => isUniqueName(event.target.value)); - setValidName(() => valid_name(event.target.value)); - }; - - const handleDesriptionChange = (event: ChangeEvent) => { - setDiscription(event.target.value); - if (description?.length) { - setValidDescription(description.length < 200); - } - }; - const addMembers = () => { - if (memberName) { + if (form.member) { if ( - users.includes(memberName) && - memberName != userContext?.username && - !members.includes(memberName) + users.includes(form.member) && + form.member != userContext?.username && + !form.members.includes(form.member) ) { - setMembers([...members, memberName]); - setMemberName(null); + setForm({ ...form, members: [...form.members, form.member] }); + setForm({ ...form, member: '' }); + console.log(form); } } }; const removeMembers = (member: string) => { - const indexToRemove = members.indexOf(member); + const indexToRemove = form.members.indexOf(member); if (indexToRemove !== -1) { const updatedMembers = [ - ...members.slice(0, indexToRemove), - ...members.slice(indexToRemove + 1), + ...form.members.slice(0, indexToRemove), + ...form.members.slice(indexToRemove + 1), ]; - setMembers(updatedMembers); + setForm({ ...form, members: updatedMembers }); } else { console.warn(`Member "${member}" not found in the members array.`); } }; + + const validate: _VALIDATE_PROPS = (name, value,files) => { + switch (name) { + case 'workspace': + if (!value) { + return 'Workspace Name is required'; + } else if (!isValidName(value)) { + return 'Workspace Name can only contain alphanumeric characters, hyphens, and underscores'; + } else if (!isUnique(value)) { + return 'Workspace name already exist'; + } + return ''; + case 'image': + if (!FileList) { + return "File is required" + } + return '' + case 'description': + if (value.length>200) { + return "Description should be less then 200 characters" + } + return '' + default: + return ''; + } + }; + + const handleChange: _WORKSPACE_FORM_CHANGE = (event) => { + const { name, value } = event.target; + switch (name) { + case 'image': + const file = event.target.files?.[0]; + setForm({ ...form, image: file }); + break; + case 'workspace': + setForm({ ...form, workspace: value }); + break; + case 'description': + setForm({ ...form, description: value }); + break; + case 'member': + setForm({ ...form, member: value }); + break; + } + }; + const handleBlur = (e: React.FocusEvent) => { + const { name, value,files } = e.target; + const error = validate(name, value,files); + setFormErrors({ + ...formErrors, + [name]: error, + }); + }; + + const handleSubmit = () => {}; + const SubmitHandler = async (): Promise => { if ( - description && + form.description && token && - name && - validName && - uniqueName && - validDescription + form.workspace + // && + // validName && + // uniqueName && + // validDescription ) { const func = async (): Promise => { const dataRes = await addOrg(token, { - name: name, - description: description, + name: form.workspace, + description: form.description, }); + if (form.image) { + try { + const fileRes = await uploadIcon(token, form.workspace, form.image); + } catch (e) {} + } - if (selectedFile != null) { - try{ - const fileRes = await uploadIcon(token, name, selectedFile); - }catch (e){ - } - } - - if (members.length > 0) { + if (form.members.length > 0) { try { - const addMmebersRes = await addOrgMembers(token, name, members); + const addMmebersRes = await addOrgMembers( + token, + form.workspace, + form.members + ); } catch (e) {} } navigate('/'); @@ -159,12 +174,40 @@ const AddWorkspace = () => { toast.error('Invalid inputs'); } }; + const dataFetch = async () => { + try { + if (token) { + const users_arr: string[] = []; + const org_arr: string[] = []; + const allUser = await getAllUser(token); + const allOrgs = await getAllOrgs(token); + allUser.data.users.forEach((user) => { + users_arr.push(user.username); + }); + + allOrgs.data.organizations.forEach((org) => { + org_arr.push(org.name); + }); + setUsers(users_arr); + setOrgs(org_arr); + } + } catch (e) {} + }; + useEffect(() => { + dataFetch(); + }, []); return (
-
+
- +

Add Icon*

+ {formErrors.image &&

{formErrors.image}

}
- {!name ?

Name field should not be empty

: <>} - {!validName && name ?

Not a valid name

: <>} - {!uniqueName && name ? ( -

Name already taken. Try another name

- ) : ( - <> - )} + {formErrors.workspace &&

{formErrors.workspace}

}
+
- {members.map((member, index) => { - return ( -
- {member}

{' '} - -
- ); - })} + {form.members.map((member, index) => ( +
+ {member}

+ +
+ ))}
- - -
+ +
); }; diff --git a/frontend/src/features/AddWorkspace/types.ts b/frontend/src/features/AddWorkspace/types.ts new file mode 100644 index 0000000..01bd5d5 --- /dev/null +++ b/frontend/src/features/AddWorkspace/types.ts @@ -0,0 +1,23 @@ +import { ChangeEvent, FormEvent } from 'react'; + +export type _WORKSPACE_FORM_ERROR = { + workspace: string | null; + description: string | null; + image: string | null; + member: string | null; +}; +export type _WORKSPACE_FORM = { + workspace: string; + description: string; + image: File | undefined; + members: string[]; + member:string; + }; +export type _WORKSPACE_FORM_CHANGE = ( + event: ChangeEvent, + index?: number +) => void; + +export type _FORM_SUBMIT = (event: FormEvent) => void; + +export type _VALIDATE_PROPS = (name: string, value: string, files:FileList|null) => string; From 2c37ba4ab2e44f2850c41fb883c35531a20510c1 Mon Sep 17 00:00:00 2001 From: Karthik Ayangar Date: Sun, 19 May 2024 16:39:27 +0530 Subject: [PATCH 4/8] feat: add member label --- frontend/src/features/AddWorkspace/index.tsx | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) diff --git a/frontend/src/features/AddWorkspace/index.tsx b/frontend/src/features/AddWorkspace/index.tsx index 5f86408..d291075 100644 --- a/frontend/src/features/AddWorkspace/index.tsx +++ b/frontend/src/features/AddWorkspace/index.tsx @@ -260,13 +260,11 @@ const AddWorkspace = () => { maxLength={201} /> {formErrors.description &&

{formErrors.description}

} - {/* {!description ?

Description field should not be empty

: <>} - {!validDescription ? ( -

Characters length should be less than 200

- ) : ( - <> - )} */} -
+ +
+
+ +
{
-
{form.members.map((member, index) => (
From c81c1dbe6c19868e0d581da85c356b308f8818f4 Mon Sep 17 00:00:00 2001 From: Karthik Ayangar Date: Sun, 19 May 2024 17:16:23 +0530 Subject: [PATCH 5/8] chore: cross icon --- frontend/src/app/assets/icons/cross.svg | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 frontend/src/app/assets/icons/cross.svg diff --git a/frontend/src/app/assets/icons/cross.svg b/frontend/src/app/assets/icons/cross.svg new file mode 100644 index 0000000..351d333 --- /dev/null +++ b/frontend/src/app/assets/icons/cross.svg @@ -0,0 +1,3 @@ + + + From 5d6efd7402a95a63f38288c7250ad3ec097481e4 Mon Sep 17 00:00:00 2001 From: Karthik Ayangar Date: Sun, 19 May 2024 17:17:18 +0530 Subject: [PATCH 6/8] bfix: updated form submit implementation Signed-off-by: Karthik Ayangar --- frontend/src/features/AddWorkspace/index.tsx | 132 +++++++++++-------- 1 file changed, 77 insertions(+), 55 deletions(-) diff --git a/frontend/src/features/AddWorkspace/index.tsx b/frontend/src/features/AddWorkspace/index.tsx index d291075..f333413 100644 --- a/frontend/src/features/AddWorkspace/index.tsx +++ b/frontend/src/features/AddWorkspace/index.tsx @@ -11,6 +11,7 @@ import { AVATAR_URL } from 'app/constants/api'; import { AVATAR_API } from 'envConstants'; import Cross from '../../app/assets/icons/cross.svg'; import { + _FORM_SUBMIT, _VALIDATE_PROPS, _WORKSPACE_FORM, _WORKSPACE_FORM_CHANGE, @@ -76,7 +77,7 @@ const AddWorkspace = () => { } }; - const validate: _VALIDATE_PROPS = (name, value,files) => { + const validate: _VALIDATE_PROPS = (name, value, files) => { switch (name) { case 'workspace': if (!value) { @@ -89,14 +90,14 @@ const AddWorkspace = () => { return ''; case 'image': if (!FileList) { - return "File is required" + return 'File is required'; } - return '' + return ''; case 'description': - if (value.length>200) { - return "Description should be less then 200 characters" + if (value.length > 200) { + return 'Description should be less then 200 characters'; } - return '' + return ''; default: return ''; } @@ -121,59 +122,72 @@ const AddWorkspace = () => { } }; const handleBlur = (e: React.FocusEvent) => { - const { name, value,files } = e.target; - const error = validate(name, value,files); + const { name, value, files } = e.target; + const error = validate(name, value, files); setFormErrors({ ...formErrors, [name]: error, }); }; - const handleSubmit = () => {}; - - const SubmitHandler = async (): Promise => { - if ( - form.description && - token && - form.workspace - // && - // validName && - // uniqueName && - // validDescription - ) { - const func = async (): Promise => { - const dataRes = await addOrg(token, { - name: form.workspace, - description: form.description, - }); - - if (form.image) { - try { - const fileRes = await uploadIcon(token, form.workspace, form.image); - } catch (e) {} + const handleSubmit: _FORM_SUBMIT = (event) => { + event.preventDefault(); + const workspace_error = validate('workspace', form.workspace, null); + const desc_error = validate('description', form.description, null); + const image_error = form.image ? '' : 'Image is required'; + setFormErrors({ + ...formErrors, + workspace: workspace_error, + description: desc_error, + image: image_error, + }); + if (workspace_error || desc_error || image_error) + toast.error('Check workspace, icon and description fields'); + else { + if (token) { + const newForm = form; + if (!form.description) { + newForm.description = " " } + const func = async (): Promise => { + const dataRes = await addOrg(token, { + name: newForm.workspace, + description: newForm.description, + }); - if (form.members.length > 0) { - try { - const addMmebersRes = await addOrgMembers( - token, - form.workspace, - form.members - ); - } catch (e) {} - } - navigate('/'); - }; + if (form.image) { + try { + const fileRes = await uploadIcon( + token, + form.workspace, + form.image + ); + } catch (e) {} + } - toast.promise(func(), { - loading: 'Saving Workspace', - success: Workspace saved, - error: Could not save, - }); - } else { - toast.error('Invalid inputs'); + if (form.members.length > 0) { + try { + const addMmebersRes = await addOrgMembers( + token, + form.workspace, + form.members + ); + } catch (e) {} + } + navigate('/'); + }; + + toast.promise(func(), { + loading: 'Saving Workspace', + success: Workspace saved, + error: Something's wrong with your inputs, + }); + } else { + toast.error(`Something's wrong with your inputs`); + } } }; + const dataFetch = async () => { try { if (token) { @@ -207,7 +221,9 @@ const AddWorkspace = () => { noValidate >
-

Add Icon*

+

+ Add Icon* +

{ onChange={handleChange} placeholder='workspace name' /> - {formErrors.workspace &&

{formErrors.workspace}

} + {formErrors.workspace && ( +

{formErrors.workspace}

+ )}
- -
+ +
Date: Sun, 19 May 2024 17:25:26 +0530 Subject: [PATCH 7/8] chore: make image field optional --- frontend/src/features/AddWorkspace/index.tsx | 31 ++++++++------------ frontend/src/features/AddWorkspace/types.ts | 2 +- 2 files changed, 14 insertions(+), 19 deletions(-) diff --git a/frontend/src/features/AddWorkspace/index.tsx b/frontend/src/features/AddWorkspace/index.tsx index f333413..f5672bb 100644 --- a/frontend/src/features/AddWorkspace/index.tsx +++ b/frontend/src/features/AddWorkspace/index.tsx @@ -77,7 +77,7 @@ const AddWorkspace = () => { } }; - const validate: _VALIDATE_PROPS = (name, value, files) => { + const validate: _VALIDATE_PROPS = (name, value) => { switch (name) { case 'workspace': if (!value) { @@ -88,11 +88,6 @@ const AddWorkspace = () => { return 'Workspace name already exist'; } return ''; - case 'image': - if (!FileList) { - return 'File is required'; - } - return ''; case 'description': if (value.length > 200) { return 'Description should be less then 200 characters'; @@ -122,8 +117,8 @@ const AddWorkspace = () => { } }; const handleBlur = (e: React.FocusEvent) => { - const { name, value, files } = e.target; - const error = validate(name, value, files); + const { name, value } = e.target; + const error = validate(name, value); setFormErrors({ ...formErrors, [name]: error, @@ -132,17 +127,18 @@ const AddWorkspace = () => { const handleSubmit: _FORM_SUBMIT = (event) => { event.preventDefault(); - const workspace_error = validate('workspace', form.workspace, null); - const desc_error = validate('description', form.description, null); - const image_error = form.image ? '' : 'Image is required'; + const workspace_error = validate('workspace', form.workspace); + const desc_error = validate('description', form.description); setFormErrors({ ...formErrors, workspace: workspace_error, description: desc_error, - image: image_error, }); - if (workspace_error || desc_error || image_error) - toast.error('Check workspace, icon and description fields'); + if (workspace_error || desc_error) { + if (workspace_error) + toast.error('Check workspace field'); + if (desc_error) toast.error("Check description field") + } else { if (token) { const newForm = form; @@ -222,7 +218,7 @@ const AddWorkspace = () => { >

- Add Icon* + Add Icon

- {formErrors.image &&

{formErrors.image}

}
diff --git a/frontend/src/features/EditWorkspace/index.tsx b/frontend/src/features/EditWorkspace/index.tsx index 267d9fd..391fc7b 100644 --- a/frontend/src/features/EditWorkspace/index.tsx +++ b/frontend/src/features/EditWorkspace/index.tsx @@ -1,13 +1,8 @@ import { getAllUser, getUser } from 'app/api/user'; -import { ChangeEvent, useContext, useEffect, useState } from 'react'; +import { ChangeEvent, useContext, useEffect, useState } from 'react'; import { useNavigate, useParams } from 'react-router-dom'; import toast from 'react-hot-toast'; -import { - - getAllOrgs, - getOrg, - updateOrg, -} from 'app/api/organization'; +import { getAllOrgs, getOrg, updateOrg } from 'app/api/organization'; import { uploadIcon } from 'app/api/file'; import './index.scss'; @@ -25,7 +20,6 @@ const EditWorkspace = () => { const [validName, setValidName] = useState(false); const [uniqueName, setUniqueName] = useState(false); - const [users, setUsers] = useState([]); const [orgs, setOrgs] = useState([]); @@ -119,15 +113,11 @@ const EditWorkspace = () => { description: description, }); - - if (selectedFile != null) { - try{ + if (selectedFile != null) { + try { const fileRes = await uploadIcon(token, name, selectedFile); - }catch(e){ - - } - } - + } catch (e) {} + } navigate('/'); }; diff --git a/frontend/src/features/ProjectAddMember /index.tsx b/frontend/src/features/ProjectAddMember /index.tsx index b08ff09..0e10397 100644 --- a/frontend/src/features/ProjectAddMember /index.tsx +++ b/frontend/src/features/ProjectAddMember /index.tsx @@ -1,12 +1,9 @@ - -import { ChangeEvent, useContext, useEffect, useState } from 'react'; +import { ChangeEvent, useContext, useEffect, useState } from 'react'; import { useNavigate, useParams } from 'react-router-dom'; import { AVATAR_API } from 'envConstants'; import { AVATAR_URL } from 'app/constants/api'; import toast from 'react-hot-toast'; -import { - getOrgMembers, -} from 'app/api/organization'; +import { getOrgMembers } from 'app/api/organization'; import './index.scss'; import UserContext from 'app/context/user/userContext'; diff --git a/frontend/src/features/WorkspaceAddMember/index.tsx b/frontend/src/features/WorkspaceAddMember/index.tsx index 0126778..61e14d8 100644 --- a/frontend/src/features/WorkspaceAddMember/index.tsx +++ b/frontend/src/features/WorkspaceAddMember/index.tsx @@ -1,12 +1,8 @@ import { getAllUser, getUser } from 'app/api/user'; -import { ChangeEvent, useContext, useEffect, useState } from 'react'; +import { ChangeEvent, useContext, useEffect, useState } from 'react'; import { useNavigate, useParams } from 'react-router-dom'; import toast from 'react-hot-toast'; -import { - addOrgMembers, - getOrgMembers, -} from 'app/api/organization'; - +import { addOrgMembers, getOrgMembers } from 'app/api/organization'; import './index.scss'; import UserContext from 'app/context/user/userContext'; diff --git a/frontend/src/features/login/index.tsx b/frontend/src/features/login/index.tsx index 557ccdf..c367022 100644 --- a/frontend/src/features/login/index.tsx +++ b/frontend/src/features/login/index.tsx @@ -1,4 +1,3 @@ - import { CLIENT_ID } from '../../envConstants'; import { useNavigate, useSearchParams } from 'react-router-dom'; import { login } from 'app/api/login'; diff --git a/frontend/src/features/project-members /components/MemberCard.tsx b/frontend/src/features/project-members /components/MemberCard.tsx index 88c24d7..74d3114 100644 --- a/frontend/src/features/project-members /components/MemberCard.tsx +++ b/frontend/src/features/project-members /components/MemberCard.tsx @@ -1,13 +1,9 @@ - import { changeProjectMembersStatus, removeProjectMembers, } from 'app/api/project'; import UserContext from 'app/context/user/userContext'; -import { - ChangeEvent, - useContext, -} from 'react'; +import { ChangeEvent, useContext } from 'react'; import toast from 'react-hot-toast'; const MemberCard = ({ diff --git a/frontend/src/features/project/components/contributorCard/index.tsx b/frontend/src/features/project/components/contributorCard/index.tsx index 0017431..08a1227 100644 --- a/frontend/src/features/project/components/contributorCard/index.tsx +++ b/frontend/src/features/project/components/contributorCard/index.tsx @@ -1,4 +1,3 @@ - import './index.scss'; import contributorPropTypes from 'app/models/contributorPropTypes'; import { AVATAR_API } from 'envConstants'; diff --git a/frontend/src/features/workspace-members /components/MemberCard.tsx b/frontend/src/features/workspace-members /components/MemberCard.tsx index d8b0ac4..236b691 100644 --- a/frontend/src/features/workspace-members /components/MemberCard.tsx +++ b/frontend/src/features/workspace-members /components/MemberCard.tsx @@ -1,9 +1,6 @@ import { changeOrgMembersStatus, removeOrgMembers } from 'app/api/organization'; import UserContext from 'app/context/user/userContext'; -import { - ChangeEvent, - useContext, -} from 'react'; +import { ChangeEvent, useContext } from 'react'; import toast from 'react-hot-toast'; const MemberCard = ({ diff --git a/frontend/src/features/workspace-view/index.tsx b/frontend/src/features/workspace-view/index.tsx index dab79b9..0a2eff4 100644 --- a/frontend/src/features/workspace-view/index.tsx +++ b/frontend/src/features/workspace-view/index.tsx @@ -1,9 +1,9 @@ import SearchBar from 'app/components/search'; -import { useContext, useEffect, useState } from 'react'; +import { useContext, useEffect, useState } from 'react'; import './index.scss'; import WorkspaceCard from './workspace-card'; import UserContext from 'app/context/user/userContext'; -import { UserOrgs, getUserOrgs } from 'app/api/user'; +import { UserOrgs, getUserOrgs } from 'app/api/user'; import loader from '../../app/assets/gifs/loader.gif'; import { useNavigate } from 'react-router-dom'; import { useSelector } from 'react-redux'; @@ -35,12 +35,7 @@ const WorkspaceView = () => { }; useEffect(() => { fetchData(); - }, [ - userContext?.username, - navigate, - searchValue, - - ]); + }, [userContext?.username, navigate, searchValue]); const LogoutHandler = async () => { try { diff --git a/frontend/src/features/workspace-view/workspace-card/index.tsx b/frontend/src/features/workspace-view/workspace-card/index.tsx index 6df44b4..3d62eb5 100644 --- a/frontend/src/features/workspace-view/workspace-card/index.tsx +++ b/frontend/src/features/workspace-view/workspace-card/index.tsx @@ -5,8 +5,7 @@ import { deleteOrg, getOrg, getOrgMembers } from 'app/api/organization'; import { deleteFile, getIcon, getIconName } from 'app/api/file'; import UserContext from 'app/context/user/userContext'; import toast from 'react-hot-toast'; -import { FaBookmark } from "react-icons/fa"; - +import { FaBookmark } from 'react-icons/fa'; import { UserOrgDetails, @@ -28,10 +27,22 @@ interface members { [username: string]: string; } -const WorkspaceCard = ({ workspaceName, role, archeive, bookmark, archeives }: { workspaceName:string, role:string, archeive:boolean, bookmark:boolean, archeives:boolean }) => { +const WorkspaceCard = ({ + workspaceName, + role, + archeive, + bookmark, + archeives, +}: { + workspaceName: string; + role: string; + archeive: boolean; + bookmark: boolean; + archeives: boolean; +}) => { // const { workspaceName, role, archeive, bookmark, archeives } = props; - const [localArchive,setLocalArchive] = useState(archeive) - const [localBookmark,setLocalBookmark] = useState(bookmark) + const [localArchive, setLocalArchive] = useState(archeive); + const [localBookmark, setLocalBookmark] = useState(bookmark); const [description, setDescription] = useState(null); const [showPopUp, setShowPopUp] = useState(false); const token = localStorage.getItem('token'); @@ -107,7 +118,7 @@ const WorkspaceCard = ({ workspaceName, role, archeive, bookmark, archeives }: { userContext?.setUserOrgs(orgs); } }; - setLocalBookmark(!localBookmark) + setLocalBookmark(!localBookmark); if (initBmk) { toast.promise(func(), { loading: 'Unpinning', @@ -140,7 +151,7 @@ const WorkspaceCard = ({ workspaceName, role, archeive, bookmark, archeives }: { orgs.userOrgs[workspaceName].archeive = (!archeive).toString(); userContext?.setUserOrgs(orgs); } - setLocalArchive(!localArchive) + setLocalArchive(!localArchive); }; if (!initArc) { toast.promise(func(), { @@ -165,9 +176,8 @@ const WorkspaceCard = ({ workspaceName, role, archeive, bookmark, archeives }: { <> {localArchive == archeives && (
-
- {localBookmark&&} + {localBookmark && }
setShowPopUp(showPopUp ? false : true)} @@ -193,7 +203,7 @@ const WorkspaceCard = ({ workspaceName, role, archeive, bookmark, archeives }: { delete
)} - + {members && userContext?.username && members[userContext?.username.toString()] === 'admin' && ( @@ -222,7 +232,10 @@ const WorkspaceCard = ({ workspaceName, role, archeive, bookmark, archeives }: { ? "USER's WORKSPACE" : workspaceName}
-
navigate(`/workspaceMembers/${workspaceName}`)}> +
navigate(`/workspaceMembers/${workspaceName}`)} + >
{membersArray.length > 0 ? ( diff --git a/frontend/src/features/workspace/components/projectCard/index.scss b/frontend/src/features/workspace/components/projectCard/index.scss index eb9be42..a009fc6 100644 --- a/frontend/src/features/workspace/components/projectCard/index.scss +++ b/frontend/src/features/workspace/components/projectCard/index.scss @@ -7,7 +7,6 @@ height: 100%; min-height: 257px; padding: 1em; - } // .projectcard:hover { @@ -162,7 +161,6 @@ font-size: 1rem; } -.pinDiv{ +.pinDiv { height: 12px; - -} \ No newline at end of file +} diff --git a/frontend/src/features/workspace/components/projectCard/index.tsx b/frontend/src/features/workspace/components/projectCard/index.tsx index e1749dc..7b09a0e 100644 --- a/frontend/src/features/workspace/components/projectCard/index.tsx +++ b/frontend/src/features/workspace/components/projectCard/index.tsx @@ -1,7 +1,7 @@ -import { useContext, useEffect, useState } from 'react'; +import { useContext, useEffect, useState } from 'react'; import './index.scss'; import { deleteProject, getMembers, getProject } from 'app/api/project'; -import { FaBookmark } from "react-icons/fa"; +import { FaBookmark } from 'react-icons/fa'; import { GetProject } from 'app/api/project'; import { AVATAR_URL } from 'app/constants/api'; import { AVATAR_API } from 'envConstants'; @@ -72,16 +72,15 @@ const ProjectCard: React.FC = ({ const temp = userOrgs; Object.entries(temp.userOrgs).map(([org]) => { if (org === orgName) { - if (temp.userOrgs[org].bookmark === "true" ) { - temp.userOrgs[org].bookmark = "false"; - } - else { - temp.userOrgs[org].bookmark = "true"; + if (temp.userOrgs[org].bookmark === 'true') { + temp.userOrgs[org].bookmark = 'false'; + } else { + temp.userOrgs[org].bookmark = 'true'; } } }); - setUserOrgs(userOrgs => { - return userOrgs = {...temp} + setUserOrgs((userOrgs) => { + return (userOrgs = { ...temp }); }); userContext?.setUserOrgs(userOrgs); }; @@ -101,7 +100,7 @@ const ProjectCard: React.FC = ({ } } }; - + const ArchiveHandler = async () => { if (token && orgName) { let initial = archive; @@ -109,25 +108,23 @@ const ProjectCard: React.FC = ({ const res = await setArcheiveStatus(token, orgName, { [projectName]: !archive, }); - + setArchive(!archive); status.archeive = !archive; const temp = userOrgs; Object.entries(temp.userOrgs).map(([org]) => { if (org === orgName) { - if (temp.userOrgs[org].archeive === "true" ) { - temp.userOrgs[org].archeive = "false"; - } - else { - temp.userOrgs[org].archeive = "true"; + if (temp.userOrgs[org].archeive === 'true') { + temp.userOrgs[org].archeive = 'false'; + } else { + temp.userOrgs[org].archeive = 'true'; } } }); - setUserOrgs(userOrgs => { - return userOrgs = {...temp} + setUserOrgs((userOrgs) => { + return (userOrgs = { ...temp }); }); userContext?.setUserOrgs(userOrgs); - }; if (initial) { @@ -141,7 +138,6 @@ const ProjectCard: React.FC = ({ loading: 'On progress', success: Project archived, error: Unable to arhive, - }); } } @@ -151,10 +147,10 @@ const ProjectCard: React.FC = ({ const func = async () => { const res = await deleteProject(token, projectName, orgName); // TODO update local state - if (userOrgs) {Object.entries(userOrgs.userOrgs) - .map(([org]) =>{ - }) - };} + if (userOrgs) { + Object.entries(userOrgs.userOrgs).map(([org]) => {}); + } + }; toast.promise(func(), { loading: 'On progress', success: Successfully deleted, @@ -172,7 +168,6 @@ const ProjectCard: React.FC = ({ userContext?.setUserOrgs(userOrgsRes.data); setUserOrgs(userOrgsRes.data); } catch (e) {} - } }; useEffect(() => { @@ -180,44 +175,44 @@ const ProjectCard: React.FC = ({ fetchProjectMembers(); fetchData(); }, []); - return (
- -
- {pin && } -
+
{pin && }

{projectName}

{project ? project.description : <>}

{(userContext?.userOrgs?.userOrgs[orgName].role === 'admin' || userContext?.userOrgs?.userOrgs[orgName].role === 'manager') && ( -
+
setShowPopUp(!showPopUp)} > - +
- {showPopUp &&
-
- {pin ? 'Unpin' : 'Pin'} + {showPopUp && ( +
+
+ {pin ? 'Unpin' : 'Pin'} +
+
+ {archive ? 'Unarchive' : 'Archive'} +
+
+ navigate(`/editProject/${orgName}/${projectName}`) + } + > + Edit +
+
+ Delete +
-
- {archive ? 'Unarchive' : 'Archive'} -
-
navigate(`/editProject/${orgName}/${projectName}`)} - > - Edit -
-
- Delete -
-
} -
+ )} +
)}
diff --git a/frontend/src/features/workspace/components/projectCardContainer/index.tsx b/frontend/src/features/workspace/components/projectCardContainer/index.tsx index 10ec8ea..ca703c3 100644 --- a/frontend/src/features/workspace/components/projectCardContainer/index.tsx +++ b/frontend/src/features/workspace/components/projectCardContainer/index.tsx @@ -26,26 +26,26 @@ const ProjectCardCont: React.FC = ({ }, [weekly]); return ( -
- {orgProjects && - Object.entries(orgProjects).map(([key, value]) => { - return ( - archives === value.archeive && ( - - ) - ); - })} -
+
+ {orgProjects && + Object.entries(orgProjects).map(([key, value]) => { + return ( + archives === value.archeive && ( + + ) + ); + })} +
); }; diff --git a/frontend/src/features/workspace/index.scss b/frontend/src/features/workspace/index.scss index 444d2b0..a515882 100644 --- a/frontend/src/features/workspace/index.scss +++ b/frontend/src/features/workspace/index.scss @@ -45,7 +45,6 @@ color: white; font-size: 0.9rem; background: var(--timerange-switch-btn-bg); - } .loader-container { diff --git a/frontend/src/features/workspace/index.tsx b/frontend/src/features/workspace/index.tsx index 868f90e..0ea79f2 100644 --- a/frontend/src/features/workspace/index.tsx +++ b/frontend/src/features/workspace/index.tsx @@ -1,15 +1,12 @@ -import { useContext, useEffect, useState } from 'react'; +import { useContext, useEffect, useState } from 'react'; import SearchBar from 'app/components/search'; import TimeRangeSwitch from 'app/components/timeRangeSwitch'; import ProjectCardCont from './components/projectCardContainer'; import LeaderBoard from './components/leaderboard'; import './index.scss'; -import { useNavigate, useParams } from 'react-router-dom'; -import { getOrgProjects } from 'app/api/organization'; -import { - getOrgGithubData, - getOrgRank, -} from 'app/api/githubData'; +import { useNavigate, useParams } from 'react-router-dom'; +import { getOrgProjects } from 'app/api/organization'; +import { getOrgGithubData, getOrgRank } from 'app/api/githubData'; import { Projects } from 'app/api/organization'; import { ProjectsGithubData } from 'app/api/githubData'; import { Contributors } from 'app/api/githubData'; @@ -18,7 +15,6 @@ import UserContext from 'app/context/user/userContext'; import { UserOrgs, getUserOrgs } from 'app/api/user'; import { useSelector } from 'react-redux'; - const Workspace = () => { const searchValue = useSelector((state: any) => state.searchKeyword.value); const navigate = useNavigate(); @@ -43,8 +39,10 @@ const Workspace = () => { if (token && spaceName) { try { const orgProjects = await getOrgProjects(token, spaceName); - const temp = Object.entries(orgProjects.data.projects).filter(([key]) => key.toLowerCase().includes(searchValue.toLowerCase())); - setOrgProjects(Object.fromEntries(temp)) + const temp = Object.entries(orgProjects.data.projects).filter(([key]) => + key.toLowerCase().includes(searchValue.toLowerCase()) + ); + setOrgProjects(Object.fromEntries(temp)); } catch (e) { navigate('/'); } @@ -69,7 +67,7 @@ const Workspace = () => { }; const fetchData = async () => { - console.log(userContext?.username) + console.log(userContext?.username); if (token && userContext?.username) { try { const userOrgsRes = await getUserOrgs( @@ -79,7 +77,6 @@ const Workspace = () => { userContext?.setUserOrgs(userOrgsRes.data); setUserOrgs(userOrgsRes.data); } catch (e) {} - } }; @@ -102,18 +99,13 @@ const Workspace = () => { fetchOrgProjects(); fetchWeeklyData(); fetchMonthlyData(); - }, [spaceName,searchValue]); + }, [spaceName, searchValue]); return ( <>
- +