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 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 | 7x 7x 7x 7x 7x 7x 7x 7x 4x 1x 1x 1x 1x 7x | import { useEffect, useState } from "react";
import { useBackend } from "main/utils/useBackend";
import BasicLayout from "main/layouts/BasicLayout/BasicLayout";
import { useCurrentUser, hasRole } from "main/utils/currentUser";
import { useNavigate, useParams } from "react-router";
import Modal from "react-bootstrap/Modal";
import { Button, Tab, Tabs } from "react-bootstrap";
import CollaboratorsTabComponent from "main/components/Projects/TabComponent/CollaboratorsTabComponent";
import { GraphIcon } from "main/components/Common/Icons";
export default function ResearcherProjectShowPage({
testId = "ResearcherProjectShowPage",
}) {
const currentUser = useCurrentUser();
const projectId = useParams().id;
const [showErrorModal, setShowErrorModal] = useState(false);
const {
data: project,
error: _errorProject,
status: _statusProject,
failureCount: projectBackendFailureCount,
} = useBackend(
[`/api/projects/${projectId}`],
// Stryker disable next-line StringLiteral : GET and empty string are equivalent
{ method: "GET", url: `/api/projects/${projectId}` },
null,
true,
);
const getProjectFailed = projectBackendFailureCount > 0;
// Stryker disable OptionalChaining -- project?.owner is more readable than project && project.owner
const isOwner =
hasRole(currentUser, "ROLE_ADMIN") ||
currentUser?.root?.user?.email === project?.owner;
// Stryker enable OptionalChaining
const navigate = useNavigate();
useEffect(() => {
if (getProjectFailed) {
setShowErrorModal(true);
const timer = setTimeout(() => {
navigate("/", { replace: true });
}, 3000);
// Stryker disable next-line BlockStatement
return () => {
clearTimeout(timer);
};
}
}, [getProjectFailed, navigate]);
return (
<BasicLayout>
<Modal show={showErrorModal}>
<Modal.Header>
<Modal.Title>Project Not Found</Modal.Title>
</Modal.Header>
<Modal.Body>
Project not found. You will be returned to the home page in 3 seconds.
</Modal.Body>
<Modal.Footer>
<Button onClick={() => setShowErrorModal(false)} variant={"primary"}>
Close
</Button>
</Modal.Footer>
</Modal>
{!project ? (
<div data-testid={`${testId}-loading`}>Project: Loading...</div>
) : (
<div className="border rounded-3 p-4 mb-4 tabsGroup">
<div className="border rounded-3 p-4 mb-4">
<div className="d-flex align-items-center gap-2">
<GraphIcon className="me-2" />
<h1
data-testid={`${testId}-title`}
className="h3 mb-0 fw-semibold"
>
{project.name}
</h1>
</div>
<p data-testid={`${testId}-description`} className="mb-0 mt-2">
{project.description}
</p>
</div>
<Tabs defaultActiveKey={"collaborators"}>
<Tab
eventKey={"collaborators"}
title={"Collaborators"}
className="pt-2"
>
<CollaboratorsTabComponent
projectId={projectId}
testIdPrefix={testId}
isOwner={isOwner}
/>
</Tab>
</Tabs>
</div>
)}
</BasicLayout>
);
}
|