From 36ef5b2232557d0b540068986b6bd670b49aa5ec Mon Sep 17 00:00:00 2001
From: Anne Haley <anne.haley@kitware.com>
Date: Thu, 29 Sep 2022 14:50:10 -0400
Subject: [PATCH] Update review mode (#604)

* Fix review mode toggle not accepting initial value

* Update review mode (always show all scans)

* Change pyppeteer test
---
 .../tests/pyppeteer/test_save_decisions.py    | 17 +---
 web_client/src/components/ExperimentsView.vue | 41 ++++-----
 web_client/src/store/index.ts                 | 84 +++++++++----------
 3 files changed, 56 insertions(+), 86 deletions(-)

diff --git a/miqa/core/tests/pyppeteer/test_save_decisions.py b/miqa/core/tests/pyppeteer/test_save_decisions.py
index b1cffa3b..0641e107 100644
--- a/miqa/core/tests/pyppeteer/test_save_decisions.py
+++ b/miqa/core/tests/pyppeteer/test_save_decisions.py
@@ -69,16 +69,9 @@ async def test_save_decisions_tier_1(
     ).click()
     await page.waitFor(1_000)
 
-    # Go back up a scan and confirm the previous decision marked all artifacts as present
-    await (await page.waitForXPath('//i[contains(@class, "fa-caret-up")]')).click()
-    saved_artifacts = await page.xpath(
-        '//div[contains(., "No comment")]/following-sibling::div/'
-        'span/span[contains(@class,"v-chip__content")]'
-    )
-    assert len(saved_artifacts) == len(artifact_chips)
-
     # Submit another decision on the third scan
     # This time marking all artifacts as absent and the scan as Usable
+    await page.goBack()
     artifact_chips = await page.xpath('//span[contains(@class,"v-chip__content")]')
     for chip in artifact_chips:
         # clicking twice marks the artifact as absent
@@ -92,14 +85,6 @@ async def test_save_decisions_tier_1(
     ).click()
     await page.waitFor(1_000)
 
-    # Go back up a scan and confirm the previous decision marked all artifacts as absent
-    await (await page.waitForXPath('//i[contains(@class, "fa-caret-up")]')).click()
-    saved_artifacts = await page.xpath(
-        '//div[contains(., "I disagree")]/following-sibling::div/'
-        'span/span[contains(@class,"v-chip__content")]'
-    )
-    assert len(saved_artifacts) == 0
-
     # Go back to the project page
     await (await page.waitForXPath('//a[contains(., "Projects")]')).click()
     await (
diff --git a/web_client/src/components/ExperimentsView.vue b/web_client/src/components/ExperimentsView.vue
index efac9f8c..c740c46e 100644
--- a/web_client/src/components/ExperimentsView.vue
+++ b/web_client/src/components/ExperimentsView.vue
@@ -5,6 +5,7 @@ import {
 } from 'vuex';
 import UserAvatar from '@/components/UserAvatar.vue';
 import djangoRest from '@/django';
+import { includeScan } from '@/store';
 import { API_URL, decisionOptions } from '../constants';
 
 export default {
@@ -72,6 +73,7 @@ export default {
     ...mapActions([
       'loadProject',
     ]),
+    includeScan,
     scansForExperiment(expId) {
       const expScanIds = this.experimentScans[expId];
       return expScanIds.filter(
@@ -179,41 +181,30 @@ export default {
 
 <template>
   <v-card class="flex-card">
-    <v-subheader
-      v-if="!minimal"
+    <div
       class="d-flex"
-      style="justify-content: space-between"
+      style="justify-content: space-between; align-items: baseline"
     >
-      Experiments
-      <div
-        class="d-flex mode-toggle"
+      <v-subheader
+        v-if="!minimal"
+        style="display: inline"
+      >
+        Experiments
+      </v-subheader>
+      <v-subheader
+        class="mode-toggle"
       >
         <span>All scans</span>
         <v-switch
-          :value="reviewMode"
-          inset
+          :input-value="true"
           dense
           style="display: inline-block; max-height: 40px; max-width: 60px;"
           class="px-3 ma-0"
           @change="switchReviewMode"
         />
         <span>Scans for my review</span>
-      </div>
-    </v-subheader>
-    <v-subheader
-      v-if="minimal"
-      class="d-flex mode-toggle"
-    >
-      <span>All scans</span>
-      <v-switch
-        :value="reviewMode"
-        dense
-        style="display: inline-block; max-height: 40px; max-width: 60px;"
-        class="px-3 ma-0"
-        @change="switchReviewMode"
-      />
-      <span>Scans for my review</span>
-    </v-subheader>
+      </v-subheader>
+    </div>
     <div class="scans-view">
       <div v-if="orderedExperiments && orderedExperiments.length">
         <ul class="experiment">
@@ -255,6 +246,7 @@ export default {
                     <v-btn
                       v-bind="attrs"
                       :to="getURLForFirstFrameInScan(scan.id)"
+                      :disabled="!includeScan(scan.id)"
                       class="ml-0 px-1 scan-name"
                       href
                       text
@@ -466,6 +458,7 @@ ul.scans {
 }
 .mode-toggle {
   align-items: baseline;
+  display: inline-block;
 }
 .add-scans {
   min-width: 150px;
diff --git a/web_client/src/store/index.ts b/web_client/src/store/index.ts
index 2ad534ef..04b55d1d 100644
--- a/web_client/src/store/index.ts
+++ b/web_client/src/store/index.ts
@@ -202,7 +202,7 @@ function startReaderWorkerPool() {
     });
 }
 
-function queueLoadScan(scan, loadNext = false) {
+function queueLoadScan(scan, loadNext = 0) {
   // load all frames in target scan
   if (!loadedData.includes(scan.id)) {
     store.state.scanFrames[scan.id].forEach(
@@ -217,10 +217,7 @@ function queueLoadScan(scan, loadNext = false) {
     loadedData.push(scan.id);
   }
 
-  // semi-recursive; we only recurse on the first call
-  // to queue up the next scan as well
-  // to prefetch further ahead, modify the recursion
-  if (loadNext) {
+  if (loadNext > 0) {
     const scansInSameExperiment = store.state.experimentScans[scan.experiment];
     let nextScan;
     if (scan.id === scansInSameExperiment[scansInSameExperiment.length - 1]) {
@@ -229,17 +226,21 @@ function queueLoadScan(scan, loadNext = false) {
       const nextExperimentId = experimentIds[experimentIds.indexOf(scan.experiment) + 1];
       const nextExperimentScans = store.state.experimentScans[nextExperimentId];
       if (nextExperimentScans && nextExperimentScans.length > 0) {
-        nextScan = store.state.allScans[
+        nextScan = store.state.scans[
           nextExperimentScans[0]
         ];
       }
     } else {
-      // load next scan in same experiment
-      nextScan = store.state.allScans[scansInSameExperiment[
-        scansInSameExperiment.indexOf(scan.id) + 1
-      ]];
+      let offset = 1;
+      while (!nextScan || !includeScan(nextScan.id)) {
+        // load next scan in same experiment
+        nextScan = store.state.scans[scansInSameExperiment[
+          scansInSameExperiment.indexOf(scan.id) + offset
+        ]];
+        offset += 1;
+      }
     }
-    if (nextScan) queueLoadScan(nextScan);
+    if (nextScan) queueLoadScan(nextScan, loadNext - 1);
     startReaderWorkerPool();
   }
 }
@@ -278,17 +279,32 @@ function expandScanRange(frameId, dataRange) {
   }
 }
 
+export function includeScan(scanId) {
+  if (store.state.reviewMode) {
+    const myRole = store.state.currentTaskOverview?.my_project_role;
+    const scanState = store.state.currentTaskOverview?.scan_states[scanId];
+    switch (scanState) {
+      case 'unreviewed':
+        return true;
+      case 'complete':
+        return false;
+      default:
+        return myRole === 'tier_2_reviewer';
+    }
+  }
+  return true;
+}
+
 const initState = {
   MIQAConfig: {},
   me: null,
   allUsers: [],
-  reviewMode: false,
+  reviewMode: true,
   globalSettings: undefined as ProjectSettings,
   currentProject: undefined as Project | null,
   currentTaskOverview: null as ProjectTaskOverview | null,
   currentProjectPermissions: {},
   projects: [] as Project[],
-  allScans: {},
   experimentIds: [],
   experiments: {},
   experimentScans: {},
@@ -349,14 +365,11 @@ const {
       const project = state.projects.filter((x) => x.id === experiment.project)[0];
       const experimentScansList = state.experimentScans[experiment.id];
       const scanFramesList = state.scanFrames[scan.id];
-      let upTo = currentFrame.firstFrameInPreviousScan;
-      let downTo = currentFrame.firstFrameInNextScan;
-      if (upTo && !Object.keys(state.scans).includes(state.frames[upTo].scan)) {
-        upTo = null;
-      }
-      if (downTo && !Object.keys(state.scans).includes(state.frames[downTo].scan)) {
-        downTo = null;
-      }
+
+      const scanOrder = Object.values(state.experimentScans).flat().filter(includeScan);
+      const currIndexInOrder = scanOrder.indexOf(scan.id);
+      const upTo = scanOrder[currIndexInOrder - 1];
+      const downTo = scanOrder[currIndexInOrder + 1];
       return {
         projectId: project.id,
         projectName: project.name,
@@ -374,8 +387,8 @@ const {
         framePositionString: `(${scanFramesList.indexOf(currentFrame.id) + 1}/${scanFramesList.length})`,
         backTo: currentFrame.previousFrame,
         forwardTo: currentFrame.nextFrame,
-        upTo,
-        downTo,
+        upTo: state.scanFrames[upTo] ? state.scanFrames[upTo][0] : undefined,
+        downTo: state.scanFrames[downTo] ? state.scanFrames[downTo][0] : undefined,
         currentFrame,
         currentAutoEvaluation: currentFrame.frame_evaluation,
       };
@@ -453,7 +466,6 @@ const {
       // Replace with a new object to trigger a Vuex update
       state.scans = { ...state.scans };
       state.scans[scanId] = scan;
-      state.allScans = Object.assign(state.allScans, state.scans);
     },
     setRenderOrientation(state, anatomy) {
       state.renderOrientation = anatomy;
@@ -482,7 +494,7 @@ const {
       }
       if (state.currentProject && taskOverview.project_id === state.currentProject.id) {
         state.currentTaskOverview = taskOverview;
-        Object.values(store.state.allScans).forEach((scan: Scan) => {
+        Object.values(store.state.scans).forEach((scan: Scan) => {
           if (taskOverview.scan_states[scan.id] && taskOverview.scan_states[scan.id] !== 'unreviewed') {
             store.dispatch.reloadScan(scan.id);
           }
@@ -573,26 +585,6 @@ const {
     },
     switchReviewMode(state, mode) {
       state.reviewMode = mode || false;
-      if (mode) {
-        const myRole = state.currentTaskOverview.my_project_role;
-        state.scans = Object.fromEntries(
-          Object.entries(state.allScans).filter(
-            ([scanId]) => {
-              const scanState = state.currentTaskOverview.scan_states[scanId];
-              switch (scanState) {
-                case 'unreviewed':
-                  return true;
-                case 'complete':
-                  return false;
-                default:
-                  return myRole === 'tier_2_reviewer';
-              }
-            },
-          ),
-        );
-      } else {
-        state.scans = state.allScans;
-      }
     },
   },
   actions: {
@@ -767,7 +759,7 @@ const {
 
       if (newScan !== oldScan && newScan) {
         queueLoadScan(
-          newScan, true,
+          newScan, 3,
         );
       }