Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 | 8x 8x 8x 8x 1x 1x 8x 8x 1x 8x 1x | import { toast } from "react-toastify";
import { useBackend, useBackendMutation } from "main/utils/useBackend";
import { useState } from "react";
import { Button, Row } from "react-bootstrap";
import ProjectCollaboratorForm from "main/components/Projects/ProjectCollaboratorForm";
import ProjectCollaboratorTable from "main/components/Projects/ProjectCollaboratorTable";
import Modal from "react-bootstrap/Modal";
import { ModalBody, ModalHeader } from "react-bootstrap";
export default function CollaboratorsTabComponent({
projectId,
testIdPrefix = "CollaboratorsTabComponent",
isOwner = true,
}) {
const [postModal, showPostModal] = useState(false);
const { data: collaborators } = useBackend(
[`/api/projectcollaborators/project?projectId=${projectId}`],
// Stryker disable next-line StringLiteral : GET and empty string are equivalent
{
method: "GET",
url: `/api/projectcollaborators/project?projectId=${projectId}`,
},
[],
true,
);
const objectToAxiosParamsPost = (collaborator) => ({
url: `/api/projectcollaborators/post`,
method: "POST",
params: {
projectId: projectId,
firstName: collaborator.firstName,
lastName: collaborator.lastName,
email: collaborator.email,
},
});
const onSuccessPost = () => {
toast("Collaborator successfully added.");
showPostModal(false);
};
const collaboratorPostMutation = useBackendMutation(
objectToAxiosParamsPost,
{ onSuccess: onSuccessPost },
[`/api/projectcollaborators/project?projectId=${projectId}`],
);
const handlePostSubmit = (collaborator) => {
collaboratorPostMutation.mutate(collaborator);
};
return (
<div
data-testid={`${testIdPrefix}-CollaboratorsTabComponent`}
className="tabComponent"
>
<Modal
show={postModal}
onHide={() => showPostModal(false)}
centered={true}
data-testid={`${testIdPrefix}-post-modal`}
>
<ModalHeader closeButton>Add Collaborator</ModalHeader>
<ModalBody>
<ProjectCollaboratorForm submitAction={handlePostSubmit} />
</ModalBody>
</Modal>
{isOwner && (
<Row className="p-2">
<Button
onClick={() => showPostModal(true)}
data-testid={`${testIdPrefix}-post-button`}
>
Add Collaborator
</Button>
</Row>
)}
<Row>
<ProjectCollaboratorTable
collaborators={collaborators}
projectId={projectId}
isOwner={isOwner}
testIdPrefix={`${testIdPrefix}-ProjectCollaboratorTable`}
/>
</Row>
</div>
);
}
|