Merge pull request #1036 from hivtools/nm-82

[NM-82] download results state refactor
hivtools · Nov 21, 2024 · fa30f27 · fa30f27
2 parents d1e1821 + d54e89e
commit fa30f27
Show file tree

Hide file tree

Showing 26 changed files with 798 additions and 2,787 deletions.
diff --git a/src/app/static/src/app/apiService.ts b/src/app/static/src/app/apiService.ts
@@ -70,9 +70,10 @@ export class APIService<S extends string, E extends string> implements API<S, E>
         return this;
     };
 
-    withError = (type: E, root = false) => {
+    withError = (type: E, root = false, payloadFunc?: (e: Error) => any) => {
         this._onError = (failure: Response) => {
-            this._commit({type: type, payload: APIService.getFirstErrorFromFailure(failure)}, {root});
+            const error = APIService.getFirstErrorFromFailure(failure);
+            this._commit({ type, payload: payloadFunc ? payloadFunc(error) : error }, { root });
         };
         return this;
     };
@@ -92,15 +93,9 @@ export class APIService<S extends string, E extends string> implements API<S, E>
         return this;
     };
 
-    withSuccess = (type: S, root = false) => {
+    withSuccess = (type: S, root = false, payloadFunc?: (data: any) => any) => {
         this._onSuccess = (data: any) => {
-            const toCommit = {type: type, payload: data};
-            if (root) {
-                this._commit(toCommit, {root: true});
-            } else {
-                this._commit(toCommit);
-            }
-
+            this._commit({ type, payload: payloadFunc ? payloadFunc(data) : data }, { root });
         };
         return this;
     };

diff --git a/src/app/static/src/app/components/downloadResults/Download.vue b/src/app/static/src/app/components/downloadResults/Download.vue
@@ -1,10 +1,10 @@
 <template>
     <div id="download">
-        <h4 v-translate="translateKey.header"></h4>
+        <h4 v-translate="translateKey"></h4>
         <button class="btn btn-lg my-3" :class="disabled ? 'btn-secondary' : 'btn-red'"
                 :disabled="disabled"
                 @click="download">
-            <span v-translate="translateKey.button"></span>
+            <span v-translate="'download'"></span>
             <vue-feather type="download" size="20" class="icon ml-2" style="margin-top: -4px;"></vue-feather>
         </button>
         <div>
@@ -38,7 +38,7 @@
             },
             translateKey: {
                 required: true,
-                type: Object
+                type: String
             },
             disabled: {
                 required: true,

diff --git a/src/app/static/src/app/components/downloadResults/DownloadResults.vue b/src/app/static/src/app/components/downloadResults/DownloadResults.vue
@@ -2,42 +2,16 @@
     <div class="container">
         <div class="row">
             <div class="col-sm">
-                <div id="spectrum-download">
-                    <download :translate-key="translation.spectrum"
-                              :disabled="!spectrum.downloadId || spectrum.preparing || !!spectrum.metadataError"
-                              :file="spectrum"/>
-                    <div class="pb-2">
-                    <error-alert v-if="spectrum.downloadError" :error="spectrum.downloadError"></error-alert>
+                <template v-for="type in Object.values(DownloadType)" :key="type">
+                    <div :id="`${type}-download`" v-if="switches[type]">
+                        <download :translate-key="`${type}Download`"
+                                  :disabled="!state[type].downloadId || state[type].preparing || !!state[type].metadataError"
+                                  :file="state[type]"/>
+                        <div class="pb-2">
+                            <error-alert v-if="state[type].downloadError" :error="state[type].downloadError"></error-alert>
+                        </div>
                     </div>
-                </div>
-                <div id="coarse-output-download">
-                    <download :translate-key="translation.coarse"
-                              :disabled="!coarseOutput.downloadId || coarseOutput.preparing || !!coarseOutput.metadataError"
-                              :file="coarseOutput"/>
-                    <div class="pb-2">
-                        <error-alert v-if="coarseOutput.downloadError" :error="coarseOutput.downloadError"></error-alert>
-                    </div>
-                </div>
-                <div id="summary-download">
-                    <download :translate-key="translation.summary"
-                              :disabled="!summary.downloadId || summary.preparing || !!summary.metadataError"
-                              :file="summary"/>
-                    <div class="pb-2">
-                    <error-alert v-if="summary.downloadError" :error="summary.downloadError"></error-alert>
-                    </div>
-                </div>
-                <div id="comparison-download" v-if="comparisonSwitch">
-                    <download :translate-key="translation.comparison"
-                              :disabled="!comparison.downloadId || comparison.preparing || !!comparison.metadataError"
-                              :file="comparison"/>
-                    <error-alert v-if="comparison.downloadError" :error="comparison.downloadError"></error-alert>
-                </div>
-                <div id="agyw-download" v-if="agywSwitch">
-                    <download :translate-key="translation.agyw"
-                              :disabled="!agyw.downloadId || agyw.preparing || !!agyw.metadataError"
-                              :file="agyw"/>
-                    <error-alert v-if="agyw.downloadError" :error="agyw.downloadError"></error-alert>
-                </div>
+                </template>
             </div>
             <div id="upload" v-if="hasUploadPermission" class="col-sm">
                 <h4 v-translate="'uploadFileToAdr'"></h4>
@@ -91,34 +65,31 @@
     import ErrorAlert from "../ErrorAlert.vue";
     import i18next from "i18next";
     import {ADRUploadState} from "../../store/adrUpload/adrUpload";
-    import {DownloadResultsState} from "../../store/downloadResults/downloadResults";
     import Download from "./Download.vue";
-    import {switches} from "../../featureSwitches";
     import { defineComponent } from "vue";
+    import { downloadSwitches, DownloadType } from "../../store/downloadResults/downloadConfig";
 
     interface Data {
         uploadModalOpen: boolean,
-        comparisonSwitch: boolean,
-        agywSwitch: boolean,
+        DownloadType: typeof DownloadType,
+        switches: {
+            [K in DownloadType]: boolean
+        }
     }
 
     export default defineComponent({
         name: "downloadResults",
         data(): Data {
             return {
                 uploadModalOpen: false,
-                comparisonSwitch: switches.comparisonOutput,
-                agywSwitch: switches.agywDownload,
+                switches: downloadSwitches,
+                DownloadType
             }
         },
         computed: {
             hasUploadPermission: mapStateProp<ADRState, boolean>("adr", (state: ADRState) => state.userCanUpload),
             ...mapStateProps("downloadResults", {
-                spectrum: ((state: DownloadResultsState) => state.spectrum),
-                summary: ((state: DownloadResultsState) => state.summary),
-                coarseOutput: ((state: DownloadResultsState) => state.coarseOutput),
-                comparison: ((state: DownloadResultsState) => state.comparison),
-                agyw: ((state: DownloadResultsState) => state.agyw),
+                state: (state) => state
             }),
             ...mapStateProps("adrUpload", {
                 uploading: ((state: ADRUploadState) => state.uploading),
@@ -140,18 +111,8 @@
                 null,
                 (state: RootState) => state.language
             ),
-            translation(): Record<string, any> {
-                return {
-                    spectrum: {header: 'exportOutputs', button: 'download'},
-                    coarse: {header: 'downloadCoarseOutput', button: 'download'},
-                    summary: {header: 'downloadSummaryReport', button: 'download'},
-                    comparison: {header: 'downloadComparisonReport', button: 'download'},
-                    agyw: {header: 'downloadAgywTool', button: 'download'},
-                }
-            },
             isPreparing(): boolean {
-                return this.summary.preparing || this.spectrum.preparing || this.coarseOutput.preparing ||
-                    this.comparison.preparing || this.agyw.preparing
+                return Object.values(DownloadType).some(type => this.state[type].preparing);
             }
         },
         methods: {
@@ -161,12 +122,12 @@
             clearStatus: mapMutationByName("adrUpload", "ClearStatus"),
             getUserCanUpload: mapActionByName("adr", "getUserCanUpload"),
             getUploadFiles: mapActionByName("adrUpload", "getUploadFiles"),
-            prepareOutputs: mapActionByName("downloadResults", "prepareOutputs"),
+            prepareAllOutputs: mapActionByName("downloadResults", "prepareAllOutputs")
         },
         mounted() {
             this.getUserCanUpload();
             this.getUploadFiles();
-            this.prepareOutputs();
+            this.prepareAllOutputs();
         },
         beforeMount() {
             this.clearStatus();

diff --git a/src/app/static/src/app/components/downloadResults/UploadModal.vue b/src/app/static/src/app/components/downloadResults/UploadModal.vue
@@ -89,6 +89,7 @@
     import {RootState} from "../../root";
     import {DownloadResultsState} from "../../store/downloadResults/downloadResults";
     import {defineComponent} from "vue";
+import { DownloadType } from "../../store/downloadResults/downloadConfig";
 
     interface Data {
         uploadFilesToAdr: string[]
@@ -158,18 +159,16 @@
         },
         computed: {
             ...mapStateProps("downloadResults", {
-                summary: ((state: DownloadResultsState) => state.summary),
-                spectrum: ((state: DownloadResultsState) => state.spectrum),
-                comparison: ((state: DownloadResultsState) => state.comparison)
+                summary: (state: DownloadResultsState) => state[DownloadType.SUMMARY],
+                spectrum: (state: DownloadResultsState) => state[DownloadType.SPECTRUM],
+                comparison: (state: DownloadResultsState) => state[DownloadType.COMPARISON]
             }),
             outputFileError(): string | null {
                 if ((this.summary.error || this.summary.metadataError) &&
                     (this.spectrum.error || this.spectrum.metadataError)) {
                     return "downloadSpectrumAndSummaryError"
-
                 } else if (this.summary.error || this.summary.metadataError) {
                     return this.translatedOutputFileError("downloadSummary")
-
                 } else if (this.spectrum.error || this.spectrum.metadataError) {
                     return this.translatedOutputFileError("downloadSpectrum")
                 } else if (this.comparison.error || this.comparison.metadataError) {

diff --git a/src/app/static/src/app/store/adrUpload/actions.ts b/src/app/static/src/app/store/adrUpload/actions.ts
@@ -7,6 +7,7 @@ import {ADRUploadMutation} from "./mutations";
 import {constructUploadFile, constructUploadFileWithResourceName} from "../../utils";
 import {Dict, UploadFile} from "../../types";
 import {ValidateInputResponse} from "../../generated";
+import { DownloadType } from "../downloadResults/downloadConfig";
 
 export interface ADRUploadActions {
     getUploadFiles: (store: ActionContext<ADRUploadState, RootState>) => void;
@@ -111,23 +112,23 @@ export const actions: ActionTree<ADRUploadState, RootState> & ADRUploadActions =
                 requestParams["resourceId"] = resourceId
             }
             if (resourceType === rootState.adr.schemas?.outputSummary) {
-                downloadId = rootState.downloadResults.summary.downloadId
+                downloadId = rootState.downloadResults[DownloadType.SUMMARY].downloadId
 
                 requestParams["description"] =
                     uploadMetadata?.find(meta => meta.type === "summary")?.description
                     || "Naomi summary report uploaded from Naomi web app"
             }
 
             if (resourceType === rootState.adr.schemas?.outputZip) {
-                downloadId = rootState.downloadResults.spectrum.downloadId
+                downloadId = rootState.downloadResults[DownloadType.SPECTRUM].downloadId
 
                 requestParams["description"] =
                     uploadMetadata?.find(meta => meta.type === "spectrum")?.description
                     || "Naomi output uploaded from Naomi web app"
             }
 
             if (resourceType === rootState.adr.schemas?.outputComparison) {
-                downloadId = rootState.downloadResults.comparison.downloadId
+                downloadId = rootState.downloadResults[DownloadType.COMPARISON].downloadId
 
                 requestParams["description"] =
                     uploadMetadata?.find(meta => meta.type === "comparison")?.description