Skip to content

Commit

Permalink
Removed test data and replaced with real data
Browse files Browse the repository at this point in the history
  • Loading branch information
@Alejandro-Vega
Alejandro-Vega committed Dec 11, 2023
1 parent d405e59 commit 03447b4
Show file tree
Hide file tree
Showing 3 changed files with 38 additions and 77 deletions.
12 changes: 8 additions & 4 deletions src/components/DataSubmissions/GenericTable.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import {
Table,
TableBody,
TableCell,
TableCellProps,
TableContainer,
TableHead,
TablePagination,
Expand Down Expand Up @@ -118,7 +119,8 @@ export type Column<T> = {
renderValue: (a: T, user: User) => string | boolean | number | React.ReactNode;
field?: keyof T;
default?: true;
minWidth?: string;
sortDisabled?: boolean;
sx?: TableCellProps["sx"];
};

export type FetchListing<T> = {
Expand All @@ -138,6 +140,7 @@ type Props<T> = {
total: number;
loading?: boolean;
noContentText?: string;
defaultRowsPerPage?: number;
setItemKey?: (item: T, index: number) => string;
onFetchData?: (params: FetchListing<T>, force: boolean) => void;
onOrderChange?: (order: Order) => void;
Expand All @@ -151,6 +154,7 @@ const DataSubmissionBatchTable = <T,>({
total = 0,
loading,
noContentText,
defaultRowsPerPage = 10,
setItemKey,
onFetchData,
onOrderChange,
Expand All @@ -163,7 +167,7 @@ const DataSubmissionBatchTable = <T,>({
columns.find((c) => c.default) || columns.find((c) => c.field)
);
const [page, setPage] = useState<number>(0);
const [perPage, setPerPage] = useState<number>(10);
const [perPage, setPerPage] = useState<number>(defaultRowsPerPage);

useEffect(() => {
fetchData();
Expand Down Expand Up @@ -221,8 +225,8 @@ const DataSubmissionBatchTable = <T,>({
<StyledTableHead>
<TableRow>
{columns.map((col: Column<T>) => (
<StyledHeaderCell key={col.label.toString()} sx={{ minWidth: col.minWidth ?? "fit-content" }}>
{col.field ? (
<StyledHeaderCell key={col.label.toString()} sx={col.sx}>
{col.field && !col.sortDisabled ? (
<TableSortLabel
active={orderBy === col}
direction={orderBy === col ? order : "asc"}
Expand Down
4 changes: 3 additions & 1 deletion src/content/dataSubmissions/DataSubmission.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -223,7 +223,9 @@ const columns: Column<Batch>[] = [
renderValue: (data) => (data?.createdAt ? `${FormatDate(data.createdAt, "MM-DD-YYYY [at] hh:mm A")}` : ""),
field: "createdAt",
default: true,
minWidth: "240px"
sx: {
minWidth: "240px"
}
},
/* TODO: Error Count removed for MVP2-M2. Will be re-added in the future */
];
Expand Down
99 changes: 27 additions & 72 deletions src/content/dataSubmissions/QualityControl.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,70 +26,21 @@ const StyledErrorDetailsButton = styled(Button)({
},
});

const testData: QCResult[] = [
{
submissionID: "c4366aab-8adf-41e9-9432-864b2101231d",
nodeType: "Participant",
batchID: "123a5678-8adf-41e9-9432-864b2108191d",
nodeID: "103a5678-8adf-41e9-9432-864b2108191d",
CRDC_ID: "113a5678-8adf-41e9-9432-864b2108191d",
severity: "Error",
description: [
{
title: "Incorrect control vocabulary.",
description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eget duis at tellus at urna condimentum mattis. Eget nunc scelerisque viverra mauris in aliquam sem.",
},
{
title: "Missing required field.",
description: "Elit eget gravida cum sociis natoque. Risus quis varius quam quisque id diam vel quam. Senectus et netus et malesuada fames ac turpis egestas. Scelerisque eu ultrices vitae auctor eu augue ut.",
},
{
title: "Value not in the range.",
description: "Consectetur adipiscing elit pellentesque habitant morbi tristique senectus. Nec ullamcorper sit amet risus. Faucibus in ornare quam viverra orci sagittis. Venenatis urna cursus eget nunc.",
},
],
uploadedDate: "2023-11-08T19:39:15.469Z",
},
{
submissionID: "c4366aab-8adf-41e9-9432-864b2101231d",
nodeType: "Participant",
batchID: "456a5678-8adf-41e9-9432-864b2108191d",
nodeID: "406a5678-8adf-41e9-9432-864b2108191d",
CRDC_ID: "416a5678-8adf-41e9-9432-864b2108191d",
severity: "Error",
description: [
{
title: "Missing required field.",
description: "Elit eget gravida cum sociis natoque. Risus quis varius quam quisque id diam vel quam. Senectus et netus et malesuada fames ac turpis egestas. Scelerisque eu ultrices vitae auctor eu augue ut.",
},
],
uploadedDate: "2023-11-08T19:39:15.469Z",
},
{
submissionID: "c4366aab-8adf-41e9-9432-864b2101231d",
nodeType: "Participant",
batchID: "789a5678-8adf-41e9-9432-864b2108191d",
nodeID: "709a5678-8adf-41e9-9432-864b2108191d",
CRDC_ID: "719a5678-8adf-41e9-9432-864b2108191d",
severity: "Error",
description: [
{
title: "Value not in the range.",
description: "Consectetur adipiscing elit pellentesque habitant morbi tristique senectus. Nec ullamcorper sit amet risus. Faucibus in ornare quam viverra orci sagittis. Venenatis urna cursus eget nunc.",
},
{
title: "Incorrect control vocabulary.",
description: "Elit eget gravida cum sociis natoque. Risus quis varius quam quisque id diam vel quam. Senectus et netus et malesuada fames ac turpis egestas. Scelerisque eu ultrices vitae auctor eu augue ut.",
},
],
uploadedDate: "2023-11-08T19:39:15.469Z",
},
];
const StyledNodeType = styled(Box)({
display: "flex",
alignItems: "center",
});

const StyledSeverity = styled(Box)({
minHeight: 76.5,
display: "flex",
alignItems: "center",
});

const columns: Column<QCResult>[] = [
{
label: "Type",
renderValue: (data) => data?.nodeType,
renderValue: (data) => <StyledNodeType alignItems="center" textTransform="capitalize">{data?.nodeType}</StyledNodeType>,
field: "nodeType",
},
{
Expand All @@ -109,11 +60,11 @@ const columns: Column<QCResult>[] = [
},
{
label: "Severity",
renderValue: (data) => <Box color={data?.severity === "Error" ? "#E25C22" : "#8D5809"} minHeight={76.5}>{data?.severity}</Box>,
renderValue: (data) => <StyledSeverity color={data?.severity === "Error" ? "#E25C22" : "#8D5809"}>{data?.severity}</StyledSeverity>,
field: "severity",
},
{
label: "Submitted Date",
label: "Uploaded Date",
renderValue: (data) => (data?.uploadedDate ? `${FormatDate(data.uploadedDate, "MM-DD-YYYY [at] hh:mm A")}` : ""),
field: "uploadedDate",
default: true
Expand All @@ -124,10 +75,10 @@ const columns: Column<QCResult>[] = [
<QCResultsContext.Consumer>
{({ handleOpenErrorDialog }) => (
<>
<span>{data.description[0].title}</span>
<span>{data.description[0]?.title}</span>
{" "}
<StyledErrorDetailsButton
onClick={() => {} /* handleOpenErrorDialog && handleOpenErrorDialog(data?.nodeID) */}
onClick={() => handleOpenErrorDialog && handleOpenErrorDialog(data)}
variant="text"
disableRipple
disableTouchRipple
Expand All @@ -140,6 +91,10 @@ const columns: Column<QCResult>[] = [
</QCResultsContext.Consumer>
),
field: "description",
sortDisabled: true,
sx: {
minWidth: "260px",
}
},
];

Expand All @@ -149,13 +104,12 @@ const QualityControl = () => {
const [loading, setLoading] = useState<boolean>(false);
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const [error, setError] = useState<string>(null);
const [data, setData] = useState<QCResult[]>(testData);
const [data, setData] = useState<QCResult[]>([]);
const [prevData, setPrevData] = useState<FetchListing<QCResult>>(null);
const [totalData, setTotalData] = useState(testData.length);
const [totalData, setTotalData] = useState(0);
const [openErrorDialog, setOpenErrorDialog] = useState<boolean>(false);
const [selectedRow, setSelectedRow] = useState<string>(null);
const [selectedRow, setSelectedRow] = useState<QCResult | null>(null);
const tableRef = useRef<TableMethods>(null);
const selectedData = null; // data?.find((item) => item._id === selectedRow);

const [submissionQCResults] = useLazyQuery<submissionQCResultsResp>(SUBMISSION_QC_RESULTS, {
variables: { id: submissionId },
Expand Down Expand Up @@ -201,9 +155,9 @@ const QualityControl = () => {
}
};

const handleOpenErrorDialog = (id: string) => {
const handleOpenErrorDialog = (data: QCResult) => {
setOpenErrorDialog(true);
setSelectedRow(id);
setSelectedRow(data);
};

const providerValue = useMemo(() => ({
Expand All @@ -219,6 +173,7 @@ const QualityControl = () => {
data={data || []}
total={totalData || 0}
loading={loading}
defaultRowsPerPage={20}
setItemKey={(item, idx) => `${idx}_${item.batchID}_${item.nodeID}`}
onFetchData={handleFetchQCResults}
/>
Expand All @@ -228,8 +183,8 @@ const QualityControl = () => {
onClose={() => setOpenErrorDialog(false)}
header="Data Submission"
title="Reasons"
errors={selectedData?.description}
uploadedDate={selectedData?.uploadedDate}
errors={selectedRow?.description}
uploadedDate={selectedRow?.uploadedDate}
/>
</>
);
Expand Down

0 comments on commit 03447b4

Please sign in to comment.