Merge branch 'main' into vpodcqa

Author: Shawn O'Connor

.env.development

@@ -4,3 +4,5 @@ NEXT_PUBLIC_DATACOMMONS="vpodc_data_commons"
 # uncomment and set the follow to connect the development frontend to a Gen3 commons backend. Note that the
 # configuration in config needs to match the backend.
 NEXT_PUBLIC_GEN3_API_TARGET=https://qa-vpodc.planx-pla.net
+# use /api for the mock responses in src/pages/api, or try same value as NEXT_PUBLIC_GEN3_API_TARGET for qa server responses:
+NEXT_VPODC_APPS_TARGET=/api

next.config.js

@@ -42,6 +42,8 @@ const nextConfig = {
     if (isDev) {
       const GEN3_TARGET =
         process.env.NEXT_PUBLIC_GEN3_API_TARGET || 'https://localhost';
+      const APP_TARGET =
+        process.env.NEXT_VPODC_APPS_TARGET || GEN3_TARGET;
       return [
         { source: '/_status', destination: `${GEN3_TARGET}/_status` },
         { source: '/user/:path*', destination: `${GEN3_TARGET}/user/:path*` },
@@ -80,6 +82,14 @@ const nextConfig = {
           source: '/requestor/:path*',
           destination: `${GEN3_TARGET}/requestor/:path*`,
         },
+        {
+          source: '/cohort-middleware/:path*',
+          destination: `${APP_TARGET}/cohort-middleware/:path*`,
+        },
+        {
+          source: '/ga4gh/wes/v2/:path*',
+          destination: `${APP_TARGET}/ga4gh/wes/v2/:path*`,
+        },
       ];
     } else {
       return [];

src/lib/AnalysisApps/GWASResults/Views/Input/JobDetails/JobDetails.tsx

@@ -9,7 +9,7 @@ const JobDetails = ({ data }: {data?: WorkflowDetails}) => {
   if (!(data?.arguments?.parameters)) {
     return <LoadingErrorMessage message='Issue Loading Data for Job Details' />;
   }
-  const dataPeramiters = data?.arguments?.parameters.reduce((acc: {[key: string]: string}, param) => {
+  const dataParameters = data?.arguments?.parameters.reduce((acc: {[key: string]: string}, param) => {
     acc[param.name] = param.value;
     return acc;
   }, {});
@@ -35,40 +35,40 @@ const JobDetails = ({ data }: {data?: WorkflowDetails}) => {
           <Group mt='sm' mb='sm'>
             <Group justify="space-between" className='w-full px-4'>
               <span>Dataset ID</span>
-              <span>{dataPeramiters.dataset_id}</span>
+              <span>{dataParameters.dataset_id}</span>
             </Group>
             <Group justify="space-between" className='w-full px-4'>
               <span>Dataset Observation Window</span>
-              <span>{dataPeramiters.dataset_observation_window} days</span>
+              <span>{dataParameters.dataset_observation_window} days</span>
             </Group>
             <Group justify="space-between" className='w-full px-4'>
               <span>Outcome of Interest ID</span>
-              <span>{dataPeramiters.outcome_id}</span>
+              <span>{dataParameters.outcome_id}</span>
             </Group>
             <Group justify="space-between" className='w-full px-4'>
               <span>Outcome Window</span>
-              <span>{dataPeramiters.outcome_observation_window} days</span>
+              <span>{dataParameters.outcome_observation_window} days</span>
             </Group>
             <Group justify="space-between" className='w-full px-4'>
               <span>Dataset size (after time window filters)</span>
-              <span>see attrition table</span>
+              <span>{dataParameters.dataset_size}</span>
             </Group>
             <Group justify="space-between" className='w-full px-4'>
               <span>Training set size</span>
-              <span>see attrition table</span>
+              <span>{dataParameters.training_set_size}</span>
             </Group>
             <Group justify="space-between" className='w-full px-4'>
               <span>Testing set size</span>
-              <span>see attrition table</span>
+              <span>{dataParameters.test_set_size}</span>
             </Group>
             <Group justify="space-between" className='w-full px-4'>
               <span>Cross-validation</span>
-              <span>{dataPeramiters.n_fold} folds</span>
+              <span>{dataParameters.n_fold} folds</span>
             </Group>
           </Group>
           <Divider />
           <Group mt='sm' mb='sm'>
-            {modelRenderer(dataPeramiters.model_list).map(({name, value}, index) => (
+            {modelRenderer(dataParameters.model_list).map(({name, value}, index) => (
               <Group 
               key={`${name}-${index}`}
               justify="space-between" 

src/lib/AnalysisApps/PLP/Components/AttritionTableWrapper/AttritionTableWrapper.tsx

@@ -1,6 +1,7 @@
-import React, { useState } from 'react';
+import React from 'react';
 import { AttritionTable } from './AttritionTable/AttritionTable';
 import { IconChevronUp, IconChevronDown } from '@tabler/icons-react';
+import ACTIONS from '../../Utils/StateManagement/Actions';
 
 interface AttritionTableWrapperProps {
   dispatch: (action: any) => void;
@@ -10,6 +11,7 @@ interface AttritionTableWrapperProps {
   outcomeObservationWindow: number;
   removeIndividualsWithPriorOutcome: boolean;
   percentageOfDataToUseAsTest: number | null;
+  isOpen: boolean;
 }
 
 interface cohort { // TODO - centralize this interface
@@ -26,9 +28,13 @@ const AttritionTableWrapper: React.FC<AttritionTableWrapperProps> = ({
   outcomeObservationWindow,
   removeIndividualsWithPriorOutcome,
   percentageOfDataToUseAsTest,
+  isOpen,
 }) => {
-  const [isOpen, setIsOpen] = useState(false);
-  const toggleArrow = () => setIsOpen((prev) => !prev);
+  const toggleArrow = () =>
+    dispatch({
+      type: ACTIONS.SET_ATTRITION_TABLE_OPEN,
+      payload: !isOpen,
+    });
 
   return (
     <div data-tour="attrition-table">

src/lib/AnalysisApps/PLP/Components/JobSubmitModal/JobSubmitModal.tsx

@@ -76,6 +76,10 @@ const JobSubmitModal: React.FC<Props> = ({
 
   // Submit workflow request
   const handleSubmit = async () => {
+    if (!datasetRemainingSize) {
+      setSubmitError('Please wait while the attrition table calculations finish and "Dataset size" is known...');
+      return;
+    }
     if (jobName === '') {
       handleEnterJobName(jobName);
       return; // do not submit if job name invalid
@@ -98,6 +102,9 @@ const JobSubmitModal: React.FC<Props> = ({
         covariate_min_fraction: minimumCovariateOccurrence,
         test_fraction: percentageOfDataToUseAsTest/100,
         n_fold: numberOfCrossValidationFolds,
+        dataset_size: datasetRemainingSize,
+        training_set_size: datasetRemainingSize ? Math.round((100-percentageOfDataToUseAsTest)*datasetRemainingSize/100) : null,
+        test_set_size: datasetRemainingSize ? calculateTestSetSize(percentageOfDataToUseAsTest, datasetRemainingSize) : null,
         template_version: "plp-template",
         workflow_name: jobName,
         team_project: selectedTeamProject,
@@ -223,23 +230,23 @@ const JobSubmitModal: React.FC<Props> = ({
                   Dataset size (after time window filters):
                 </td>
                 <td className="align-top">
-                  {datasetRemainingSize !== null ? datasetRemainingSize : 'see attrition table'}
+                  {datasetRemainingSize !== null ? datasetRemainingSize : 'waiting for attrition table...'}
                 </td>
               </tr>
               <tr>
                 <td className="font-semibold pr-4 text-right align-top whitespace-nowrap">
                   Training set size:
                 </td>
                 <td className="align-top">
-                  {datasetRemainingSize !== null ? `${Math.round((100-percentageOfDataToUseAsTest)*datasetRemainingSize/100)}` : 'see attrition table'}
+                  {datasetRemainingSize !== null ? `${Math.round((100-percentageOfDataToUseAsTest)*datasetRemainingSize/100)}` : 'waiting for attrition table...'}
                 </td>
               </tr>
               <tr>
                 <td className="font-semibold pr-4 text-right align-top whitespace-nowrap">
                   Testing set size:
                 </td>
                 <td className="align-top">
-                  {datasetRemainingSize !== null ? `${calculateTestSetSize(percentageOfDataToUseAsTest, datasetRemainingSize)}` : 'see attrition table'}
+                  {datasetRemainingSize !== null ? `${calculateTestSetSize(percentageOfDataToUseAsTest, datasetRemainingSize)}` : 'waiting for attrition table...'}
                 </td>
               </tr>
               <tr>

src/lib/AnalysisApps/PLP/PLPContainer.tsx

@@ -215,6 +215,7 @@ const PLPContainer = () => {
         outcomeObservationWindow={state.outcomeObservationWindow}
         removeIndividualsWithPriorOutcome={state.removeIndividualsWithPriorOutcome}
         percentageOfDataToUseAsTest={state.percentageOfDataToUseAsTest}
+        isOpen={state.showExpandedAttritionTable}
       />
       <div data-testid="GWASApp" className="p-4">
         <div className="steps-wrapper">
@@ -252,6 +253,7 @@ const PLPContainer = () => {
                 data-tour="next-button"
                 className="GWASUI-navBtn GWASUI-navBtn__next"
                 onClick={() => {
+                  dispatch({ type: ACTIONS.SET_ATTRITION_TABLE_OPEN, payload: true });
                   dispatch({ type: ACTIONS.SET_WORKFLOW_SUBMISSION_STATUS, payload: {status: '', response: null}});
                   dispatch({ type: ACTIONS.SHOW_JOB_SUBMIT_MODAL });
                 }}

src/lib/AnalysisApps/PLP/Utils/StateManagement/Actions.ts

@@ -29,6 +29,7 @@ const ACTIONS = {
   SET_SELECTED_MODEL: 'setSelectedModel',
   SET_SELECTED_MODEL_PARAMETERS: 'setSelectedModelParameters',
   SET_WORKFLOW_SUBMISSION_STATUS: 'setWorkflowSubmissionStatus',
+  SET_ATTRITION_TABLE_OPEN: 'setAttritionTableOpen',
 };
 
 export default ACTIONS;

src/lib/AnalysisApps/PLP/Utils/StateManagement/InitialState.ts

@@ -20,6 +20,7 @@ const initialState = {
   workflowSubmissionStatus: null,
   workflowSubmissionId: null,
   selectedTeamProject: '',
+  showExpandedAttritionTable: false,
 };
 
 export default initialState;

src/lib/AnalysisApps/PLP/Utils/StateManagement/reducer.ts

@@ -27,6 +27,7 @@ export interface State {
   jobName: string;
   workflowSubmissionStatus: string | null;
   workflowSubmissionId: string | null;
+  showExpandedAttritionTable: boolean;
 };
 
 const reducer = (state: State, action: Action): State => {
@@ -83,6 +84,8 @@ const reducer = (state: State, action: Action): State => {
       return { ...state, modelParameters: action.payload };
     case ACTIONS.SET_WORKFLOW_SUBMISSION_STATUS:
       return { ...state, workflowSubmissionStatus: action.payload.status, workflowSubmissionId: action.payload.response };
+    case ACTIONS.SET_ATTRITION_TABLE_OPEN:
+      return { ...state, showExpandedAttritionTable: action.payload };
     default:
       throw new Error(`Unknown action passed to reducer: ${action}`);
   }