iss555: awaiting document loading before displaying text

frontend/components/containers/annotation/EntityItemBox.vue

@@ -21,9 +21,10 @@ export default {
 
   computed: {
     ...mapState('labels', ['items', 'loading']),
+    ...mapState('documents', { documentLoading: 'loading' }),
     ...mapGetters('documents', ['currentDoc']),
     isReady() {
-      return !!this.currentDoc && !this.loading
+      return !!this.currentDoc && !this.loading && !this.documentLoading
     }
   },
 

frontend/components/containers/annotation/Seq2seqContainer.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <v-card
-      v-if="currentDoc"
+      v-if="isReady"
       class="title mb-5"
     >
       <v-card-text class="title">
@@ -9,7 +9,7 @@
       </v-card-text>
     </v-card>
     <seq2seq-box
-      v-if="currentDoc"
+      v-if="isReady"
       :text="currentDoc.text"
       :annotations="currentDoc.annotations"
       :delete-annotation="_deleteAnnotation"
@@ -20,7 +20,7 @@
 </template>
 
 <script>
-import { mapActions, mapGetters } from 'vuex'
+import { mapActions, mapState, mapGetters } from 'vuex'
 import Seq2seqBox from '~/components/organisms/annotation/Seq2seqBox'
 
 export default {
@@ -29,7 +29,11 @@ export default {
   },
 
   computed: {
-    ...mapGetters('documents', ['currentDoc'])
+    ...mapState('documents', ['loading']),
+    ...mapGetters('documents', ['currentDoc']),
+    isReady() {
+      return this.currentDoc && !this.loading
+    }
   },
 
   methods: {

frontend/components/containers/annotation/TextClassification.vue

@@ -1,6 +1,6 @@
 <template>
   <v-card
-    v-if="currentDoc && items"
+    v-if="isReady"
     v-shortkey="multiKeys"
     @shortkey="addOrRemoveLabel"
   >
@@ -31,6 +31,7 @@ export default {
 
   computed: {
     ...mapState('labels', ['items']),
+    ...mapState('documents', ['loading']),
     ...mapGetters('documents', ['currentDoc']),
     multiKeys() {
       const multiKeys = {}
@@ -38,6 +39,9 @@ export default {
         multiKeys[item.id] = [item.suffix_key]
       }
       return multiKeys
+    },
+    isReady() {
+      return this.currentDoc && this.items && !this.loading
     }
   },
 

frontend/layouts/annotation.vue

@@ -43,7 +43,7 @@
           </v-col>
           <v-col cols="12" md="3">
             <metadata-box
-              v-if="currentDoc"
+              v-if="currentDoc && !loading"
               :metadata="JSON.parse(currentDoc.meta)"
             />
           </v-col>
@@ -56,7 +56,7 @@
 </template>
 
 <script>
-import { mapActions, mapGetters } from 'vuex'
+import { mapActions, mapGetters, mapState } from 'vuex'
 import BottomNavigator from '@/components/containers/annotation/BottomNavigator'
 import GuidelineButton from '@/components/containers/annotation/GuidelineButton'
 import MetadataBox from '@/components/organisms/annotation/MetadataBox'
@@ -87,6 +87,7 @@ export default {
 
   computed: {
     ...mapGetters('projects', ['getLink', 'getCurrentUserRole']),
+    ...mapState('documents', ['loading']),
     ...mapGetters('documents', ['currentDoc', 'approved'])
   },