Merge pull request #51 from scaife-viewer/201-library-race

Handle any race condition on loading library widget

src/reader/widgets/ReaderWidget.vue

@@ -9,6 +9,7 @@
         :query="query"
         :variables="queryVariables"
         :update="queryUpdate"
+        :skip="urn === null"
       >
         <template v-slot="{ result: { data } }">
           <Paginator :urn="data && data.previous" direction="left" />
@@ -42,6 +43,9 @@
     scaifeConfig: {},
     methods: {
       setVersionMetadata() {
+        if (this.urn === null) {
+          return;
+        }
         this.$store.dispatch(
           UPDATE_METADATA,
           { urn: this.urn.version },
@@ -92,7 +96,7 @@
           },
         });
       }
-      if (this.version !== this.urn.version) {
+      if (this.urn && this.version !== this.urn.version) {
         this.setVersionMetadata();
       }
     },
@@ -117,7 +121,7 @@
         `;
       },
       queryVariables() {
-        return { urn: this.urn.absolute };
+        return { urn: this.urn === null ? '' : this.urn.absolute };
       },
       displayMode() {
         return this.$store.state.displayMode;

src/widgets/AudioWidget.vue

@@ -153,6 +153,9 @@
             .map(e => e.node.audioAnnotations.edges.map(a => a.node))
             .flat();
         },
+        skip() {
+          return this.urn === null;
+        },
       },
     },
   };

src/widgets/LibraryWidget/LibraryWidget.vue

@@ -1,7 +1,8 @@
 <template>
   <div class="library-widget u-widget u-flex">
-    <ul class="node-tree root" v-if="libraryTree">
-      <Node v-for="(node, index) in libraryTree" :key="index" :node="node" />
+    <LoaderBall v-if="$apolloData.queries.libraryTree.loading" />
+    <ul class="node-tree root" v-else-if="libraryTree">
+      <Node v-for="node in libraryTree" :key="node.data.urn" :node="node" />
     </ul>
   </div>
 </template>
@@ -21,7 +22,6 @@
             }
           }
         `,
-        // transform response before setting as `data.libraryTree`
         update(data) {
           const nid = data.tree.tree[0];
           return nid.children.reduce((a, b) => {

src/widgets/LibraryWidget/Node.vue

@@ -46,10 +46,10 @@
     },
     computed: {
       highlight() {
-        return this.readerUrn.version === this.urn;
+        return this.readerUrn && this.readerUrn.version === this.urn;
       },
       nodeUrnIndex() {
-        return this.readerUrn.absolute.indexOf(
+        return this.readerUrn && this.readerUrn.absolute.indexOf(
           this.urn.slice(0, this.urn.length - 1), // trim trailing colon
         );
       },

src/widgets/NamedEntitiesWidget/NamedEntitiesWidget.vue

@@ -33,6 +33,7 @@
     },
     data() {
       return {
+        entities: [],
         filteredEntities: [],
       };
     },
@@ -102,6 +103,9 @@
         update(data) {
           return data.namedEntities.edges.map(e => e.node);
         },
+        skip() {
+          return this.urn === null;
+        },
       },
     },
   };

src/widgets/NewAlexandriaWidget.vue

@@ -32,8 +32,8 @@
         // special-case handling for the Folios version of
         // the Iliad
         return (
-          this.originalPassage.version ===
-          'urn:cts:greekLit:tlg0012.tlg001.msA-folios:'
+          this.originalPassage && this.originalPassage.version ===
+            'urn:cts:greekLit:tlg0012.tlg001.msA-folios:'
         );
       },
       originalPassage() {
@@ -53,7 +53,7 @@
         handler() {
           if (this.needsHealing) {
             this.healFolioURN();
-          } else {
+          } else if (this.originalPassage) {
             this.healedPassage = this.originalPassage.toString();
           }
         },
@@ -100,6 +100,9 @@
       fetchPassageTextParts() {
         // retrieves the lowest text parts for a folio level reference,
         // e.g. 12r --> 12r.1.1-12.r.1.25
+        if (this.originalPassage === null) {
+          return;
+        }
         const query = gql`
           {
             passageTextParts(
@@ -120,7 +123,6 @@
             return node;
           });
         });
-        return query;
       },
       extractPassageTextPartRefs() {
         // extracts the ref(s) from the text parts

src/widgets/ScholiaWidget.vue

@@ -57,6 +57,9 @@
             };
           });
         },
+        skip() {
+          return this.urn === null;
+        },
       },
     },
   };

src/widgets/TokenAnnotationWidget.vue

@@ -95,6 +95,9 @@
         update(data) {
           return data.passageTextParts.edges.map(line => line.node);
         },
+        skip() {
+          return this.urn === null;
+        },
       },
     },
   };