From c9209e0f8a0bb47aafd5120a4bbea56615750cc2 Mon Sep 17 00:00:00 2001
From: "Planoetscher Daniel (Student Com20)"
<daniel.planoetscher@stud-inf.unibz.it>
Date: Mon, 17 May 2021 19:35:12 +0200
Subject: [PATCH] bugfixes
---
.../forms/MemberForm/UsernameForm.tsx | 5 ++++
.../src/components/forms/MemberForm/index.tsx | 10 +++++--
.../forms/RoleForm/RoleChangeForm.tsx | 30 ++++++++++++-------
.../forms/RoleForm/RoleEditForm.tsx | 8 +++--
.../src/components/forms/RoleForm/index.tsx | 17 +++++------
5 files changed, 43 insertions(+), 27 deletions(-)
create mode 100644 client/src/components/forms/MemberForm/UsernameForm.tsx
diff --git a/client/src/components/forms/MemberForm/UsernameForm.tsx b/client/src/components/forms/MemberForm/UsernameForm.tsx
new file mode 100644
index 0000000..60565d2
--- /dev/null
+++ b/client/src/components/forms/MemberForm/UsernameForm.tsx
@@ -0,0 +1,5 @@
+
+
+export default function UsernameForm() {
+
+}
\ No newline at end of file
diff --git a/client/src/components/forms/MemberForm/index.tsx b/client/src/components/forms/MemberForm/index.tsx
index 68e32a1..45edc24 100644
--- a/client/src/components/forms/MemberForm/index.tsx
+++ b/client/src/components/forms/MemberForm/index.tsx
@@ -1,6 +1,7 @@
import './member-form.scss';
import RoleForm from 'components/forms/RoleForm';
import { Team, TeamMember, TeamRole } from 'adapters/team';
+import { useState } from 'react';
interface Props {
roles: TeamRole[];
@@ -8,11 +9,14 @@ interface Props {
}
export default function MemberForm({ roles, team }: Props) {
+ const [role, setRole] = useState<TeamRole>();
+ const [username, setUsername] = useState<string>();
return (
<div className="member-form">
- asdf
-
- {/*<RoleForm roles={roles} team={team} />*/}
+ {
+
+ }
+ <RoleForm roles={roles} team={team} setResult={setRole} />
</div>
)
}
\ No newline at end of file
diff --git a/client/src/components/forms/RoleForm/RoleChangeForm.tsx b/client/src/components/forms/RoleForm/RoleChangeForm.tsx
index cd61656..ddb67d0 100644
--- a/client/src/components/forms/RoleForm/RoleChangeForm.tsx
+++ b/client/src/components/forms/RoleForm/RoleChangeForm.tsx
@@ -5,30 +5,38 @@ import Button from 'components/ui/Button';
interface Props {
roles: TeamRole[];
setEdit: Function;
- member: TeamMember;
+ member?: TeamMember;
+ setResult?: Function
team: Team;
+ setAllRoles: (state: any) => void
}
-export default function RoleForm({ roles, setEdit, member, team }: Props) {
- const [currentRole, setRole] = useState(member.role.id);
- const [allRoles, setRoles] = useState(roles);
+export default function RoleForm({ roles, setEdit, member, team, setResult, setAllRoles }: Props) {
+ const [currentRole, setRole] = useState(member?.role.id);
const onSubmit = useCallback(async (e: FormEvent) => {
e.preventDefault();
- await updateTeamMember(team.id, { user: member.id, role: currentRole });
- window.location.reload();
- }, [currentRole, member, team]);
+ if (currentRole) {
+ if (setResult) {
+ setResult(currentRole);
+ }
+ if (member) {
+ await updateTeamMember(team.id, { user: member.id, role: currentRole });
+ window.location.reload();
+ }
+ }
+ }, [currentRole, member, team, setResult]);
const onDelete = useCallback(async (id: string) => {
await deleteTeamRole(team.id, id);
- setRoles(state => state.filter(role => role.id !== id));
- }, [team]);
+ setAllRoles((state: any) => state.filter((role: any) => role.id !== id));
+ }, [team, setAllRoles]);
return (
<form className="role-change-form" onSubmit={onSubmit}>
- <h2>Change the role of {member.username}</h2>
+ <h2>Update the role</h2>
{
- allRoles.map((role) => (
+ roles.map((role) => (
<div className="role-item" key={role.id}>
<input
type="radio"
diff --git a/client/src/components/forms/RoleForm/RoleEditForm.tsx b/client/src/components/forms/RoleForm/RoleEditForm.tsx
index 8b9d68d..b62519d 100644
--- a/client/src/components/forms/RoleForm/RoleEditForm.tsx
+++ b/client/src/components/forms/RoleForm/RoleEditForm.tsx
@@ -8,6 +8,7 @@ interface Props {
role?: TeamRole;
team: Team;
setEdit: Function;
+ setAllRoles: (state: any) => void
}
export function validateName(name: string): string | null {
@@ -17,21 +18,22 @@ export function validateName(name: string): string | null {
return 'The name is required';
}
-export default function RoleEditForm({ role, team, setEdit }: Props) {
+export default function RoleEditForm({ role, team, setEdit, setAllRoles }: Props) {
const [name, setName] = useState(role?.name ?? '');
const onSubmit = useCallback(async (e: FormEvent) => {
e.preventDefault();
if (validateName(name) === null) {
if (!role?.id) {
- await createTeamRole(team.id, name);
+ const role = await createTeamRole(team.id, name);
+ setAllRoles((state: any) => [...state, role]);
setEdit(null);
} else {
//todo edit team role
setEdit(null);
}
}
- }, [name, team, setEdit, role]);
+ }, [name, team, setEdit, role, setAllRoles]);
return (
<form className="role-edit-form" onSubmit={onSubmit}>
diff --git a/client/src/components/forms/RoleForm/index.tsx b/client/src/components/forms/RoleForm/index.tsx
index 16b7dd6..8919e53 100644
--- a/client/src/components/forms/RoleForm/index.tsx
+++ b/client/src/components/forms/RoleForm/index.tsx
@@ -7,22 +7,19 @@ import './role-form.scss';
interface Props {
roles: TeamRole[];
team: Team;
- member: TeamMember
+ member?: TeamMember;
+ setResult?: Function;
}
-export default function RoleForm({ roles, team, member }: Props) {
+export default function RoleForm({ roles, team, member, setResult }: Props) {
const [edit, setEdit] = useState<TeamRole | null>(null);
+ const [allRoles, setRoles] = useState(roles);
return (
<>
{
- edit === null && (
- <RoleChangeForm roles={roles} setEdit={setEdit} team={team} member={member}/>
- )
- }
- {
- edit && (
- <RoleEditForm role={edit} team={team} setEdit={setEdit}/>
- )
+ edit === null ?
+ <RoleChangeForm roles={allRoles} setEdit={setEdit} team={team} member={member} setAllRoles={setRoles} setResult={setResult} />
+ : <RoleEditForm role={edit} team={team} setEdit={setEdit} setAllRoles={setRoles} />
}
</>
)
--
GitLab