78 lines
2.1 KiB
TypeScript
78 lines
2.1 KiB
TypeScript
|
import { useState } from "react";
|
||
|
|
import Button from "./Button";
|
||
|
|
import ChangeRole, { ProjectRoleChange } from "./ChangeRole";
|
||
|
|
|
||
|
|
export default function ChangeRoles(props: {
|
||
|
|
projectName: string;
|
||
|
|
username: string;
|
||
|
|
}): JSX.Element {
|
||
|
|
const [selectedRole, setSelectedRole] = useState<
|
||
|
|
"project_manager" | "member" | ""
|
||
|
|
>("");
|
||
|
|
|
||
|
|
const handleRoleChange = (
|
||
|
|
event: React.ChangeEvent<HTMLInputElement>,
|
||
|
|
): void => {
|
||
|
|
if (event.target.value === "member") {
|
||
|
|
setSelectedRole(event.target.value);
|
||
|
|
} else if (event.target.value === "project_manager") {
|
||
|
|
setSelectedRole(event.target.value);
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
const handleSubmit = (event: React.FormEvent<HTMLFormElement>): void => {
|
||
|
|
event.preventDefault();
|
||
|
|
const roleChangeInfo: ProjectRoleChange = {
|
||
|
|
username: props.username,
|
||
|
|
projectname: props.projectName,
|
||
|
|
role: selectedRole,
|
||
|
|
};
|
||
|
|
ChangeRole(roleChangeInfo);
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div>
|
||
|
|
<h1 className="font-bold text-[22px] mb-[15px]">Change role:</h1>
|
||
|
|
<form
|
||
|
|
className="border-2 border-black rounded-lg p-2"
|
||
|
|
onSubmit={handleSubmit}
|
||
|
|
>
|
||
|
|
<div className="self-start text-left font-medium">
|
||
|
|
<div className="hover:font-bold">
|
||
|
|
<label>
|
||
|
|
<input
|
||
|
|
type="radio"
|
||
|
|
value="project_manager"
|
||
|
|
checked={selectedRole === "project_manager"}
|
||
|
|
onChange={handleRoleChange}
|
||
|
|
className="ml-2 mr-2 mb-5"
|
||
|
|
/>
|
||
|
|
Project manager
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
<div className="hover:font-bold">
|
||
|
|
<label>
|
||
|
|
<input
|
||
|
|
type="radio"
|
||
|
|
value="member"
|
||
|
|
checked={selectedRole === "member"}
|
||
|
|
onChange={handleRoleChange}
|
||
|
|
className="ml-2 mr-2"
|
||
|
|
/>
|
||
|
|
Member
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<Button
|
||
|
|
text="Change"
|
||
|
|
onClick={(): void => {
|
||
|
|
return;
|
||
|
|
}}
|
||
|
|
type="submit"
|
||
|
|
/>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|