Skip to content

Commit

Permalink
feat: study page
Browse files Browse the repository at this point in the history
  • Loading branch information
carcruz committed Dec 9, 2024
1 parent e59a3e7 commit eb2dc64
Showing 1 changed file with 30 additions and 41 deletions.
71 changes: 30 additions & 41 deletions apps/platform/src/pages/StudyPage/StudyPage.tsx
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
import { ReactElement } from "react";
import { useQuery } from "@apollo/client";
import { BasePage, ScrollToTop } from "ui";
import { Box, Tabs, Tab } from "@mui/material";
import { useLocation, useParams, Routes, Route, useMatch, Link, Navigate } from "react-router-dom";
import { useLocation, useParams, Link } from "react-router-dom";
import Header from "./Header";
import NotFoundPage from "../NotFoundPage";
import STUDY_PAGE_QUERY from "./StudyPage.gql";
import Profile from "./Profile";

function StudyPage() {
function StudyPage(): ReactElement {
const location = useLocation();
const { studyId } = useParams() as { studyId: string };
const { path } = useMatch();

const { loading, data } = useQuery(STUDY_PAGE_QUERY, {
variables: { studyId },
Expand All @@ -29,45 +29,34 @@ function StudyPage() {
description={`Annotation information for ${study?.id}`}
location={location}
>
<Header
loading={loading}
studyId={studyId}
backgroundTraits={study?.backgroundTraits}
targetId={study?.target?.id}
diseases={study?.diseases}
projectId={projectId}
/>
<ScrollToTop />
<>
<Header
loading={loading}
studyId={studyId}
backgroundTraits={study?.backgroundTraits}
targetId={study?.target?.id}
diseases={study?.diseases}
projectId={projectId}
/>
<ScrollToTop />

<Route
path="/"
render={history => (
<Box sx={{ borderBottom: 1, borderColor: "divider" }}>
<Tabs value={history.location.pathname !== "/" ? history.location.pathname : false}>
<Tab
label={<Box sx={{ textTransform: "capitalize" }}>Profile</Box>}
value={`/study/${studyId}`}
component={Link}
to={`/study/${studyId}`}
/>
</Tabs>
</Box>
)}
/>

<Routes>
<Route exact path={path}>
<Profile
studyId={studyId}
studyType={studyType}
projectId={projectId}
diseases={study?.diseases}
/>
</Route>
<Route path="*">
<Navigate to={`/study/${study?.id}`} />
</Route>
</Routes>
<Box sx={{ borderBottom: 1, borderColor: "divider" }}>
<Tabs value={location.pathname}>
<Tab
label={<Box sx={{ textTransform: "capitalize" }}>Profile</Box>}
value={`/study/${studyId}`}
component={Link}
to={`/study/${studyId}`}
/>
</Tabs>
</Box>
<Profile
studyId={studyId}
studyType={studyType}
projectId={projectId}
diseases={study?.diseases}
/>
</>
</BasePage>
);
}
Expand Down

0 comments on commit eb2dc64

Please sign in to comment.