Merge pull request #158 from pepfar-datim/faster-test

Faster test

.gitignore

@@ -3,7 +3,7 @@
 
 # build & output
 /build
-approvals.zip
+Data-Approval.zip
 
 # WebStorm ide files
 /cypress/.idea

package.json

@@ -27,7 +27,7 @@
   "scripts": {
     "start": "react-scripts start",
     "build:react": "react-scripts build",
-    "build:zip": "(rm -f approvals.zip && cd build && zip ../approvals.zip -r .)",
+    "build:zip": "(rm -f Data-Approval.zip && cd build && zip ../Data-Approval.zip -r .)",
     "build": "npm run build:react && npm run build:zip",
     "test": "node_modules/cypress/bin/cypress open"
   },

src/modules/action/components/action.component.tsx

@@ -12,6 +12,7 @@ import WorkflowPeriodService from "../../shared/services/workflowsPeriods.servic
 import {getWorkflowNameById} from "../../shared/services/workflowService";
 
 import "../css/action.component.css";
+import Loading from "../../shared/components/loading.component";
 
 const styles = {
     progress: {
@@ -99,7 +100,7 @@ export default class Action extends React.Component<
 
 
     renderAction(){
-        if (this.state.processing) return <LinearProgress style={styles.progress}/>;
+        if (this.state.processing) return <Loading message='Loading...'/>;
         return <ActionButtons mechanismState={this.state.mechanismState} performAction={this.performAction} mechanismsNr={this.state.mechanisms.length}/>;
     }
 

src/modules/action/components/mechanism/form/formContent.component.tsx

@@ -3,6 +3,7 @@ import FormRender from "./formRender.component";
 import {MechanismMeta} from "../../../../shared/models/mechanism.model";
 import getFormContent from "../../../services/formContent.service";
 import {LinearProgress} from "@material-ui/core";
+import Loading from "../../../../shared/components/loading.component";
 
 export default class FormContent extends React.Component<
     {workflow: string, period: string, userOu: string, dataSet: string, mechanismMetas: MechanismMeta[]},
@@ -31,7 +32,7 @@ export default class FormContent extends React.Component<
 
     }
     render() {
-        if (!this.state.formHtml) return <LinearProgress/>;
+        if (!this.state.formHtml) return <Loading message='Loading dataset...'/>;;
         return <FormRender formHtml={this.state.formHtml}/>;
     }
 }

src/modules/action/components/mechanism/mechanismTabs.component.tsx

@@ -3,6 +3,7 @@ import {LinearProgress, Paper, Tab, Tabs, Typography} from "@material-ui/core";
 import MechanismInfo from "./mechanismInfo.component";
 import MechanismModel, {MechanismState} from "../../../shared/models/mechanism.model";
 import FormSelect from "./form/formSelect.component";
+import Loading from "../../../shared/components/loading.component";
 
 
 function lengthWarning(mechanismsLength: number, clicks: number){
@@ -52,7 +53,7 @@ function renderMechanismOverview(openTab:number, workflow:string, period:string,
 export default function MechanismTabs({workflow, period, userOu, mechanisms, mechanismState}:{workflow: string, period: string, userOu: string, mechanisms: MechanismModel[], mechanismState: MechanismState}){
     const [openTab, setOpenTab] = React.useState(0);
     const [clicks, userClicked] = React.useState(0);
-    if (!mechanisms[0].info) return <LinearProgress/>;
+    if (!mechanisms[0].info) return <Loading message='Loading mechanism details...'/>;
     return <Paper>
         <Tabs value={openTab} onChange={(event,tabIndex)=>setOpenTab(tabIndex)} variant="scrollable" onClick={()=>userClicked(clicks+1)}>
             {renderOverviewTab(mechanisms.length)}

src/modules/action/components/step/step.component.tsx

@@ -3,6 +3,7 @@ import {Stepper, StepLabel, makeStyles, Theme, createStyles, LinearProgress} fro
 import MuiStep from "@material-ui/core/Step";
 import {getWorkflowTypeById} from "../../../shared/services/workflowService";
 import {MechanismState} from "../../../shared/models/mechanism.model";
+import Loading from "../../../shared/components/loading.component";
 
 
 const useStyles = makeStyles((theme: Theme) =>
@@ -64,7 +65,7 @@ function getStepNr(status: string, workflowType: string){
 
 export default function Step({workflow, mechanismState, userType}:{workflow: string, mechanismState: MechanismState, userType: string}){
     const classes = useStyles();
-    if (!mechanismState) return <LinearProgress/>;
+    if (!mechanismState) return <Loading message='Loading mechanism state...'/>;;
     if (!userType) return null;
     const workflowType = getWorkflowTypeById(workflow);
     return(

src/modules/list/components/list.component.tsx

@@ -12,6 +12,7 @@ import ListAction from "./listAction.component";
 import WorkflowPeriodService from "../../shared/services/workflowsPeriods.service";
 import {idNameList} from "../../shared/models/idNameList.model";
 import {fetchMechanisms} from "../services/mechanisms.service";
+import Loading from "../../shared/components/loading.component";
 
 class List extends React.Component<
     {history: any, urlSearchOptions: Filters},
@@ -40,7 +41,7 @@ class List extends React.Component<
             ous: null
         };
         let ouPromise = orgUnits.init().then((ous)=>{
-            this.setState({ous: ous})
+            this.setState({ous: ous});
             this.preselectOu(ous);
         });
 
@@ -64,7 +65,7 @@ class List extends React.Component<
 
     preselectOu(ous){
         this.setFilterFromUrl('ou');
-        if (ous.length===1) this.setFilter('ou', ous[0].id);
+        this.setFilter('ou', ous[0].id);
     }
     fetchMechanisms(){
         setTimeout(()=>{
@@ -100,7 +101,7 @@ class List extends React.Component<
     }
 
     renderFilters(){
-        if (this.state.loading.filters) return <LinearProgress className='cy_loading'/>;
+        if (this.state.loading.filters) return <Loading message='Loading workflow information...'/>;
         return <FilterSelect
             organisationUnits={this.state.ous}
             periods={this.state.periods}
@@ -129,7 +130,7 @@ class List extends React.Component<
     };
 
     renderResults(){
-        if (this.state.loading.mechanisms) return <LinearProgress className='cy_loading'/>;
+        if (this.state.loading.mechanisms) return <Loading message='Loading mechanisms...'/>;
         if (!this.state.mechanisms) return null;
         if (this.state.mechanisms.length===0) return <Typography color="secondary">No mechanisms found</Typography>
         return <ResultsTabs mechanisms={this.state.mechanisms} onMechanismsSelected={this.onMechanismsSelected} onSwitchTab={this.onSwitchTab}/>;

src/modules/shared/components/loading.component.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import {LinearProgress, Typography} from "@material-ui/core";
+import { TextAlignProperty } from 'csstype';
+
+const styles = {
+    message: {
+        textAlign: 'center' as TextAlignProperty
+    }
+};
+
+export default function Loading({message}:{message:string}) {
+    return <React.Fragment>
+        <LinearProgress/>
+        <br/>
+        <Typography className='cy_loading' color="primary" style={styles.message}>{message}</Typography>
+    </React.Fragment>;
+}