Merge branch '3.0.0' into eslint-linting

CBIIT · Apr 3, 2024 · 255e886 · 255e886
2 parents 1eabaaf + 505f511
commit 255e886
Show file tree

Hide file tree

Showing 14 changed files with 189 additions and 62 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -36,7 +36,7 @@
     "web-vitals": "^2.1.4"
   },
   "overrides": {
-    "typescript": "^5.0.4"
+    "typescript": "^5.4.3"
   },
   "scripts": {
     "start": "react-scripts start",
@@ -94,6 +94,6 @@
     "husky": "^8.0.3",
     "jest-axe": "^8.0.0",
     "prettier": "^3.1.1",
-    "typescript": "^5.0.4"
+    "typescript": "^5.4.3"
   }
 }
diff --git a/src/components/DataSubmissions/ValidationControls.tsx b/src/components/DataSubmissions/ValidationControls.tsx
@@ -127,6 +127,9 @@ const ValidationControls: FC<Props> = ({ dataSubmission, onValidate }: Props) =>
     if (!dataSubmission?.status || ValidateStatuses.includes(dataSubmission?.status) === false) {
       return false;
     }
+    if (dataSubmission.intention === "Delete") {
+      return false;
+    }
 
     return dataSubmission?.fileValidationStatus !== null;
   }, [user?.role, dataSubmission?.fileValidationStatus]);

diff --git a/src/components/Questionnaire/SectionGroup.tsx b/src/components/Questionnaire/SectionGroup.tsx
@@ -4,16 +4,6 @@ import {
   Typography, styled
 } from "@mui/material";
 
-type Props = {
-  children: React.ReactNode;
-  title?: string;
-  description?: string | React.ReactNode;
-  endButton?: React.ReactNode;
-  beginButton?: React.ReactNode;
-  required?: boolean;
-  error?: string;
-};
-
 const StyledGrid = styled(Grid)({
   marginTop: "46px",
   "&:first-of-type": {
@@ -42,13 +32,19 @@ export const StyledTitle = styled(Typography)({
 export const StyledDescription = styled(Typography)({
   fontWeight: 400,
   color: "#2A836D",
-  marginTop: "16px",
+  marginTop: "24px",
   fontSize: "16px",
+  "& a": {
+    color: "inherit",
+    fontWeight: "700",
+    textDecoration: "underline",
+  },
 });
 
 const StyledEndAdornment = styled(Box)({
   marginLeft: "auto",
 });
+
 const StyledBeginAdornment = styled(Box)({
   marginRight: "12px",
   marginTop: "auto",
@@ -60,6 +56,7 @@ const StyledAsterisk = styled('span')({
     color: "#C93F08",
     marginLeft: "2px",
 });
+
 const StyledError = styled('div')({
   color: "#C93F08",
   textTransform: "none",
@@ -73,13 +70,27 @@ const StyledError = styled('div')({
   marginBottom: '0',
   minHeight: '20px',
 });
+
+type Props = {
+  children: React.ReactNode;
+  title?: string;
+  description?: React.ReactNode;
+  endButton?: React.ReactNode;
+  beginButton?: React.ReactNode;
+  required?: boolean;
+  error?: string;
+};
+
 /**
  * Generic Form Input Section Group
  *
  * @param {Props} props
  * @returns {React.ReactNode}
  */
-const SectionGroup: FC<Props> = ({ title, description, children, endButton, beginButton, required, error }) => (
+const SectionGroup: FC<Props> = ({
+  children,
+  title, description, endButton, beginButton, required, error,
+}) => (
   <StyledGrid container rowSpacing={0} columnSpacing={1.5}>
     <StyledHeader xs={12} item>
       <Stack direction="column" alignItems="flex-start">
@@ -88,7 +99,6 @@ const SectionGroup: FC<Props> = ({ title, description, children, endButton, begi
             {title}
             {required ? <StyledAsterisk className="asterisk">*</StyledAsterisk> : ""}
             {error ? <StyledError className="asterisk">{error}</StyledError> : ""}
-
           </StyledTitle>
         )}
         <Stack direction="row" alignItems="flex-start" justifyContent="space-between" width="100%">
@@ -99,7 +109,6 @@ const SectionGroup: FC<Props> = ({ title, description, children, endButton, begi
           )}
           {beginButton && <StyledBeginAdornment>{beginButton}</StyledBeginAdornment>}
         </Stack>
-
       </Stack>
     </StyledHeader>
     {children}

diff --git a/src/config/SectionMetadata.tsx b/src/config/SectionMetadata.tsx
@@ -1,15 +1,8 @@
-import { Link } from "react-router-dom";
-import { styled } from "@mui/material";
-
-const StyledLink = styled(Link)(() => ({
-  textDecoration: "none",
-  color: "inherit"
-}));
+import { Link } from 'react-router-dom';
 
 /**
  * Metadata for Questionnaire Sections
  *
- *
  * @see SectionConfig
  */
 const sectionMetadata = {
@@ -75,14 +68,14 @@ const sectionMetadata = {
           <>
             Informed consent is the basis for institutions submitting data to determine the appropriateness of submitting human data to open or controlled-access NIH/NCI data repositories. This refers to how CRDC data repositories distribute scientific data to the public. The controlled-access studies are required to submit an Institutional Certification to NIH. Learn about this at
             {" "}
-            <StyledLink
+            <Link
               to="https://sharing.nih.gov/genomic-data-sharing-policy/institutional-certifications"
               target="_blank"
             >
               https://sharing.nih.gov/
               <wbr />
               genomic-data-sharing-policy/institutional-certifications
-            </StyledLink>
+            </Link>
           </>
         ),
       },

diff --git a/src/content/dataSubmissions/DataSubmission.tsx b/src/content/dataSubmissions/DataSubmission.tsx
@@ -483,6 +483,8 @@ const DataSubmission: FC<Props> = ({ submissionId, tab = URLTabs.DATA_ACTIVITY }
       return;
     }
 
+    // NOTE: Immediately update submission object to get "Validating" status
+    getSubmission();
     startPolling(60000);
   };
 

diff --git a/src/content/dataSubmissions/QualityControl.tsx b/src/content/dataSubmissions/QualityControl.tsx
@@ -274,6 +274,10 @@ const QualityControl: FC<Props> = ({ submission }: Props) => {
     tableRef.current?.setPage(0, true);
   }, [watch("nodeType"), watch("batchID"), watch("severity")]);
 
+  useEffect(() => {
+    tableRef.current?.refresh();
+  }, [submission?.metadataValidationStatus, submission?.fileValidationStatus]);
+
   return (
     <>
       <StyledFilterContainer>

diff --git a/src/content/questionnaire/sections/D.tsx b/src/content/questionnaire/sections/D.tsx
@@ -151,7 +151,9 @@ const FormSectionD: FC<FormSectionProps> = ({ SectionOption, refs }: FormSection
   const formContainerRef = useRef<HTMLDivElement>();
   const formRef = useRef<HTMLFormElement>();
   const [dataTypesErrorMsg, setDataTypesErrorMsg] = useState<string>("");
+  const [clinicalDataTypesErrorMsg, setClinicalDataTypesErrorMsg] = useState<string>("");
   const dataTypesInputRef = useRef<HTMLInputElement>(null);
+  const clinicalDataTypesInputRef = useRef<HTMLInputElement>(null);
   const { nextButtonRef, saveFormRef, submitFormRef, approveFormRef, inquireFormRef, rejectFormRef, getFormObjectRef } = refs;
   const [fileTypeData, setFileTypeData] = useState<KeyedFileTypeData[]>(data.files?.map(mapObjectWithKey) || []);
   const [cellLineModelSystemCheckboxes, setCellLineModelSystemCheckboxes] = useState<string[]>(reshapeCheckboxGroupOptions(cellLineModelSystemOptions, data));
@@ -194,6 +196,15 @@ const FormSectionD: FC<FormSectionProps> = ({ SectionOption, refs }: FormSection
       combinedData.clinicalData.dataTypes = combinedData.clinicalData.dataTypes.filter((str) => str !== "");
     }
 
+    // Handle validity for at clinical data types section
+    if (combinedData.dataTypes.includes("clinicalTrial") && (combinedData.clinicalData?.dataTypes?.length !== 0 || combinedData.clinicalData?.otherDataTypes !== "")) {
+      setClinicalDataTypesErrorMsg("");
+      clinicalDataTypesInputRef.current.setCustomValidity("");
+    } else if (combinedData.dataTypes.includes("clinicalTrial")) {
+      setClinicalDataTypesErrorMsg("At least one clinical data type is required");
+      clinicalDataTypesInputRef.current?.setCustomValidity("At least one clinical data type is required");
+    }
+
     combinedData.targetedReleaseDate = dayjs(formObject.targetedReleaseDate).isValid() ? formObject.targetedReleaseDate : "";
     combinedData.targetedSubmissionDate = dayjs(formObject.targetedSubmissionDate).isValid() ? formObject.targetedSubmissionDate : "";
     if (formObject.imagingDataDeIdentified === "true") {
@@ -341,7 +352,10 @@ const FormSectionD: FC<FormSectionProps> = ({ SectionOption, refs }: FormSection
         <SectionGroup
           title={SectionDMetadata.sections.CLINICAL_DATA_TYPES.title}
           description={SectionDMetadata.sections.CLINICAL_DATA_TYPES.description}
+          required
+          error={clinicalDataTypesErrorMsg}
         >
+          <InvisibleInput ref={clinicalDataTypesInputRef} aria-label={SectionDMetadata.sections.CLINICAL_DATA_TYPES.title} />
           <SwitchInput
             id="section-d-demographic-data"
             label="Demographic Data"

diff --git a/src/content/questionnaire/sections/Review.tsx b/src/content/questionnaire/sections/Review.tsx
@@ -318,20 +318,22 @@ const FormSectionReview: FC<FormSectionProps> = ({
           <ReviewDataListingProperty idPrefix="review-data-types-other-data-types" gridWidth={12} label="Other Data types" value={data.otherDataTypes} valuePlacement="bottom" isList />
         </ReviewDataListing>
 
-        <ReviewDataListing
-          idPrefix="review-clinical-data-types"
-          title={SectionMetadata.D.sections.CLINICAL_DATA_TYPES.title}
-          description={SectionMetadata.D.sections.CLINICAL_DATA_TYPES.description}
-        >
-          <ReviewDataListingProperty idPrefix="review-clinical-data-types-demographic-data" label={DataTypes.demographicData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.demographicData.name) ? "Yes" : "No"} />
-          <ReviewDataListingProperty idPrefix="review-clinical-data-types-relapse-recurrence-data" label={DataTypes.relapseRecurrenceData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.relapseRecurrenceData.name) ? "Yes" : "No"} />
-          <ReviewDataListingProperty idPrefix="review-clinical-data-types-diagnosis-data" label={DataTypes.diagnosisData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.diagnosisData.name) ? "Yes" : "No"} />
-          <ReviewDataListingProperty idPrefix="review-clinical-data-types-outcome-data" label={DataTypes.outcomeData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.outcomeData.name) ? "Yes" : "No"} />
-          <ReviewDataListingProperty idPrefix="review-clinical-data-types-treatment-data" label={DataTypes.treatmentData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.treatmentData.name) ? "Yes" : "No"} />
-          <ReviewDataListingProperty idPrefix="review-clinical-data-types-biospecimen-data" label={DataTypes.biospecimenData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.biospecimenData.name) ? "Yes" : "No"} />
-          <ReviewDataListingProperty idPrefix="review-clinical-data-types-other-clinical-data-types" gridWidth={12} label="Other Clinical Data types" value={data.clinicalData?.otherDataTypes?.split(",")} valuePlacement="bottom" isList />
-          <ReviewDataListingProperty idPrefix="review-clinical-data-types-additional-data-in-future" label="Additional Data in future" value={data.clinicalData?.futureDataTypes ? "Yes" : "No"} />
-        </ReviewDataListing>
+        {data.dataTypes?.includes(DataTypes.clinicalTrial.name) && (
+          <ReviewDataListing
+            idPrefix="review-clinical-data-types"
+            title={SectionMetadata.D.sections.CLINICAL_DATA_TYPES.title}
+            description={SectionMetadata.D.sections.CLINICAL_DATA_TYPES.description}
+          >
+            <ReviewDataListingProperty idPrefix="review-clinical-data-types-demographic-data" label={DataTypes.demographicData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.demographicData.name) ? "Yes" : "No"} />
+            <ReviewDataListingProperty idPrefix="review-clinical-data-types-relapse-recurrence-data" label={DataTypes.relapseRecurrenceData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.relapseRecurrenceData.name) ? "Yes" : "No"} />
+            <ReviewDataListingProperty idPrefix="review-clinical-data-types-diagnosis-data" label={DataTypes.diagnosisData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.diagnosisData.name) ? "Yes" : "No"} />
+            <ReviewDataListingProperty idPrefix="review-clinical-data-types-outcome-data" label={DataTypes.outcomeData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.outcomeData.name) ? "Yes" : "No"} />
+            <ReviewDataListingProperty idPrefix="review-clinical-data-types-treatment-data" label={DataTypes.treatmentData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.treatmentData.name) ? "Yes" : "No"} />
+            <ReviewDataListingProperty idPrefix="review-clinical-data-types-biospecimen-data" label={DataTypes.biospecimenData.label} value={data.clinicalData?.dataTypes?.includes(DataTypes.biospecimenData.name) ? "Yes" : "No"} />
+            <ReviewDataListingProperty idPrefix="review-clinical-data-types-other-clinical-data-types" gridWidth={12} label="Other Clinical Data types" value={data.clinicalData?.otherDataTypes?.split(",")} valuePlacement="bottom" isList />
+            <ReviewDataListingProperty idPrefix="review-clinical-data-types-additional-data-in-future" label="Additional Data in future" value={data.clinicalData?.futureDataTypes ? "Yes" : "No"} />
+          </ReviewDataListing>
+        )}
 
         <ReviewDataListing
           idPrefix="review-file-types"

diff --git a/src/types/ProgramConfig.d.ts b/src/types/ProgramConfig.d.ts
@@ -1,5 +1,5 @@
 type ProgramOption = Program & {
-  editable?: boolean = false;
+  editable?: boolean;
 };
 
 type StudyOption = Omit<Study, "description" | "publications" | "plannedPublications" | "repositories" | "funding" | "isDbGapRegistered" | "dbGaPPPHSNumber"> & {

diff --git a/src/types/Submissions.d.ts b/src/types/Submissions.d.ts
@@ -56,16 +56,6 @@ type SubmissionIntention =
   | "Update"
   | "Delete";
 
-type FileInfo = {
-  filePrefix: string; // prefix/path within S3 bucket
-  fileName: string;
-  size: number;
-  status: string; // [New, Uploaded, Failed]
-  errors: string[];
-  createdAt: string; // ISO 8601 date time format with UTC or offset e.g., 2023-05-01T09:23:30Z
-  updatedAt: string; // ISO 8601 date time format with UTC or offset e.g., 2023-05-01T09:23:30Z
-};
-
 type FileInput = {
   fileName: string;
   size: number;
@@ -168,7 +158,7 @@ type S3FileInfo = {
   updatedAt: string;
 };
 
-type ParentNode = {
+type RecordParentNode = {
   parentType: string; // node type of the parent node, e.g. "study"
   parentIDPropName: string; // ID property name can be used to identify parent node, e.g., "study_id"
   parentIDValue: string; // Value for above ID property, e.g. "CDS-study-007"
@@ -212,7 +202,7 @@ type DataRecord = {
   nodeType: string; // type of the node, in "type" column of the file
   nodeID: string; // ID of the node, for example: "cds-case-99907"
   // props: Properties; // properties of the node
-  parents: ParentNode[];
+  parents: RecordParentNode[];
   // relationshipProps: [RelationshipProperty] # for future use
   // rawData: RawData
   s3FileInfo: S3FileInfo; // only for "file" types, should be null for other nodes