@konfuzio/document-validation-ui 0.1.6-multi-ann-set → 0.1.6-multi-ann-set-2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@konfuzio/document-validation-ui",
-  "version": "0.1.6-multi-ann-set",
+  "version": "0.1.6-multi-ann-set-2",
   "repository": "git://github.com:konfuzio-ai/document-validation-ui.git",
   "main": "dist/app.js",
   "scripts": {

package/src/assets/scss/main.scss

@@ -409,7 +409,7 @@ body {
       }
     }
 
-    .invisible-parent-modal {
+    &.invisible-parent-modal {
       background-color: transparent;
 
       .modal-content {

package/src/assets/scss/multi_ann_table_overlay.scss

@@ -15,9 +15,6 @@
       overflow: visible;
       .header-dropdown {
         cursor: pointer;
-        overflow: visible;
-        white-space: nowrap;
-        text-overflow: ellipsis;
 
         .icon.arrow {
           margin-left: 4px;
@@ -33,11 +30,8 @@
       }
 
       .annotations-table {
-        height: 22px;
+        min-height: 22px;
         display: flex;
-        white-space: nowrap;
-        text-overflow: ellipsis;
-        overflow: visible;
       }
     }
   }

package/src/components/App.vue

@@ -1,13 +1,13 @@
 <template>
   <div class="dv-ui-app-container dv-ui-theme">
-    <DocumentsList />
+    <DocumentsList v-if="showDocumentsList" />
     <DocumentDashboard />
   </div>
 </template>
 <script>
 import DocumentDashboard from "./DocumentDashboard";
 import { DocumentsList } from "./DocumentsList";
-import { getURLQueryParam } from "../utils/utils";
+import { getURLQueryParam, getURLPath } from "../utils/utils";
 import API from "../api";
 
 export default {
@@ -49,6 +49,8 @@ export default {
     documentId() {
       if (getURLQueryParam("document")) {
         return getURLQueryParam("document");
+      } else if (getURLPath("docs")) {
+        return getURLPath("docs");
       } else if (process.env.VUE_APP_DOCUMENT_ID) {
         return process.env.VUE_APP_DOCUMENT_ID;
       } else if (this.document) {
@@ -86,6 +88,9 @@ export default {
         return true;
       }
     },
+    showDocumentsList() {
+      return process.env.VUE_APP_SHOW_DOCUMENTS_LIST;
+    },
   },
   created() {
     // locale config

package/src/components/DocumentAnnotations/AnnotationActionButtons.vue

@@ -3,7 +3,7 @@
     <!-- loading -->
     <div v-if="isLoading">
       <b-notification :closable="false" class="loading-background">
-        <b-loading :active="isLoading" :is-full-page="loadingOnFullPage">
+        <b-loading :active="isLoading" :is-full-page="false">
           <b-icon icon="spinner" class="fa-spin loading-icon-size spinner" />
         </b-loading>
       </b-notification>
@@ -11,7 +11,7 @@
 
     <!-- save button -->
     <b-button
-      v-if="saveBtn && !isLoading && !publicView"
+      v-if="saveBtn && !isLoading && !publicView && !documentIsReviewed"
       :class="[
         'annotation-save-btn text-btn',
         actionBar && 'action-bar-save-btn',
@@ -25,7 +25,7 @@
 
     <!-- cancel button -->
     <b-button
-      v-if="cancelBtn && !isLoading"
+      v-if="cancelBtn && !isLoading && !documentIsReviewed"
       class="is-small annotation-cancel-btn"
       icon-left="xmark"
       @click.stop="cancel"
@@ -33,7 +33,14 @@
 
     <!-- decline button -->
     <div
-      v-if="declineBtn && !isLoading && !saveBtn && !cancelBtn && !publicView"
+      v-if="
+        declineBtn &&
+        !isLoading &&
+        !saveBtn &&
+        !cancelBtn &&
+        !publicView &&
+        !documentIsReviewed
+      "
       class="missing-decline-button-container"
     >
       <b-button
@@ -47,7 +54,14 @@
 
     <!-- accept button -->
     <b-button
-      v-if="acceptBtn && !isLoading && !saveBtn && !cancelBtn && !publicView"
+      v-if="
+        acceptBtn &&
+        !isLoading &&
+        !saveBtn &&
+        !cancelBtn &&
+        !publicView &&
+        !documentIsReviewed
+      "
       class="annotation-accept-btn primary-button"
       type="is-primary"
       @click.stop="accept"
@@ -58,7 +72,12 @@
     <!-- missing button -->
     <div
       v-if="
-        showMissingBtn && !isLoading && !cancelBtn && !saveBtn && !publicView
+        showMissingBtn &&
+        !isLoading &&
+        !cancelBtn &&
+        !saveBtn &&
+        !publicView &&
+        !documentIsReviewed
       "
       class="missing-decline-button-container"
     >
@@ -73,7 +92,7 @@
 
     <!-- Restore not found annotations -->
     <b-button
-      v-if="restoreBtn && !isLoading && !publicView"
+      v-if="restoreBtn && !isLoading && !publicView && !documentIsReviewed"
       class="restore-btn"
       type="is-primary"
       @click.stop="restore"
@@ -115,13 +134,12 @@ export default {
       required: false,
     },
   },
-  data() {
-    return {
-      loadingOnFullPage: false,
-    };
-  },
   computed: {
-    ...mapState("document", ["publicView", "missingAnnotations"]),
+    ...mapState("document", [
+      "publicView",
+      "missingAnnotations",
+      "documentIsReviewed",
+    ]),
   },
   methods: {
     save() {

package/src/components/DocumentAnnotations/AnnotationContent.vue

@@ -1,7 +1,7 @@
 <template>
   <div :id="annotation.id" ref="annotation" class="annotation">
     <span
-      v-if="!publicView"
+      v-if="!publicView || !documentIsReviewed"
       :id="annotation.id"
       ref="contentEditable"
       :class="[
@@ -82,6 +82,7 @@ export default {
       "newAcceptedAnnotations",
       "selectedEntities",
       "showActionError",
+      "documentIsReviewed",
     ]),
     annotationText() {
       if (this.isAnnotationBeingEdited) {
@@ -155,7 +156,7 @@ export default {
       this.$refs.contentEditable.textContent = text;
     },
     handleEditAnnotation(event) {
-      if (this.publicView) return;
+      if (this.publicView || this.documentIsReviewed) return;
 
       if (event) {
         event.preventDefault();
@@ -163,6 +164,7 @@ export default {
 
       if (
         !this.publicView &&
+        !this.documentIsReviewed &&
         !this.isAnnotationBeingEdited &&
         !this.isLoading
       ) {
@@ -226,7 +228,7 @@ export default {
       event.preventDefault();
     },
     saveAnnotationChanges(event) {
-      if (this.publicView) return;
+      if (this.publicView || this.documentIsReviewed) return;
 
       if (event) {
         event.preventDefault();

package/src/components/DocumentAnnotations/AnnotationRow.vue

@@ -176,6 +176,7 @@ export default {
       "documentId",
       "showActionError",
       "missingAnnotations",
+      "documentIsReviewed",
     ]),
     ...mapState("selection", ["spanSelection", "elementSelected"]),
     ...mapGetters("document", [
@@ -433,7 +434,7 @@ export default {
       );
     },
     handleSaveChanges(decline) {
-      if (this.publicView) return;
+      if (this.publicView || this.documentIsReviewed) return;
 
       if (
         this.showAcceptButton() ||

package/src/components/DocumentAnnotations/AnnotationSetActionButtons.vue

@@ -2,7 +2,7 @@
   <div class="action-buttons">
     <!-- mark all empty labels as missing -->
     <div
-      v-if="!publicView"
+      v-if="!publicView && !documentIsReviewed"
       class="missing-decline-button-container all-missing"
       @mouseenter="mouseenterAnnotationSet('missing')"
       @mouseleave="mouseleaveAnnotationSet"
@@ -19,7 +19,7 @@
 
     <!-- accept all pending annotations -->
     <div
-      v-if="!publicView"
+      v-if="!publicView && !documentIsReviewed"
       class="accept-all"
       @mouseenter="mouseenterAnnotationSet('accept')"
       @mouseleave="mouseleaveAnnotationSet"
@@ -53,7 +53,7 @@ export default {
     },
   },
   computed: {
-    ...mapState("document", ["publicView"]),
+    ...mapState("document", ["publicView", "documentIsReviewed"]),
   },
   methods: {
     mouseenterAnnotationSet(type) {

package/src/components/DocumentAnnotations/CategorizeModal.vue

@@ -109,6 +109,8 @@ export default {
       "selectedDocument",
       "categorizeModalIsActive",
       "splittingSuggestions",
+      "publicView",
+      "documentIsReviewed",
     ]),
     ...mapGetters("category", ["category", "projectHasSingleCategory"]),
     ...mapGetters("document", ["categorizationIsConfirmed"]),
@@ -181,7 +183,9 @@ export default {
         // But if there is a category, we also need to check if there are splitting suggestions or not
         this.show =
           (!category || (category && !this.splittingSuggestions)) &&
-          !this.categorizationIsConfirmed;
+          !this.categorizationIsConfirmed &&
+          !this.publicView &&
+          !this.documentIsReviewed;
       }
     },
     canCloseModal() {

package/src/components/DocumentAnnotations/DocumentAnnotations.vue

@@ -15,13 +15,17 @@
     <!-- When there's no annotations in the label -->
     <div v-else-if="annotationSets.length === 0">
       <CategorizeModal
-        v-if="!publicView && !waitingForSplittingConfirmation(selectedDocument)"
+        v-if="
+          !publicView &&
+          !documentIsReviewed &&
+          !waitingForSplittingConfirmation(selectedDocument)
+        "
       />
       <EmptyState />
     </div>
 
     <div v-else :class="['annotation-set-list']">
-      <CategorizeModal v-if="!publicView" />
+      <CategorizeModal v-if="!publicView || !documentIsReviewed" />
       <div
         v-if="Object.entries(annotationSetsInTable()).length > 0"
         class="annotation-set-group"
@@ -144,6 +148,7 @@ export default {
       "labels",
       "selectedDocument",
       "splittingSuggestions",
+      "documentIsReviewed",
     ]),
     ...mapGetters("category", ["category"]),
     ...mapGetters("document", [
@@ -179,19 +184,6 @@ export default {
     window.removeEventListener("keydown", this.keyDownHandler);
   },
   methods: {
-    showMissingAnnotations() {
-      if (
-        (this.publicView &&
-          this.selectedDocument &&
-          this.selectedDocument.is_reviewed) ||
-        !this.publicView
-      ) {
-        return true;
-      } else {
-        return false;
-      }
-    },
-
     focusOnNextAnnotation() {
       const annotations = Array.from(
         document.getElementsByClassName("annotation-value")
@@ -239,7 +231,7 @@ export default {
 
     keyDownHandler(event) {
       // only allow keyboard navigation if we are not in public view mode
-      if (this.publicView) return;
+      if (this.publicView || this.documentIsReviewed) return;
 
       // get out of edit mode and navigation
       if (event.key === "Escape") {

package/src/components/DocumentAnnotations/EmptyAnnotation.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="empty-annotation">
     <span
-      v-if="!publicView"
+      v-if="!publicView && !documentIsReviewed"
       :id="emptyAnnotationId()"
       ref="emptyAnnotation"
       :class="[
@@ -84,6 +84,7 @@ export default {
       "publicView",
       "selectedEntities",
       "showActionError",
+      "documentIsReviewed",
     ]),
   },
   watch: {
@@ -158,12 +159,14 @@ export default {
     handleEditEmptyAnnotation() {
       if (
         this.publicView ||
+        this.documentIsReviewed ||
         this.annotationIsNotFound(this.annotationSet, this.label)
       )
         return;
 
       if (
         !this.publicView &&
+        !this.documentIsReviewed &&
         !this.isLoading &&
         this.elementSelected !== this.emptyAnnotationId()
       ) {
@@ -218,7 +221,7 @@ export default {
       }
     },
     saveEmptyAnnotationChanges(event) {
-      if (this.publicView) return;
+      if (this.publicView || this.documentIsReviewed) return;
 
       if (event) {
         event.preventDefault();

package/src/components/DocumentPage/DocumentPage.vue

@@ -3,7 +3,11 @@
     ref="pdfContainer"
     :class="[
       'pdf-page-container',
-      (categorizeModalIsActive || editMode || publicView) && 'default-cursor',
+      (categorizeModalIsActive ||
+        editMode ||
+        publicView ||
+        documentIsReviewed) &&
+        'default-cursor',
       page.number === currentPage && 'current-page',
     ]"
   >
@@ -44,7 +48,7 @@
           }"
         />
         <template v-if="pageInVisibleRange && !editMode">
-          <v-group v-if="!publicView" ref="entities">
+          <v-group v-if="!publicView || !documentIsReviewed" ref="entities">
             <v-rect
               v-for="(entity, index) in scaledEntities"
               :key="index"
@@ -268,6 +272,7 @@ export default {
       "selectedDocument",
       "publicView",
       "selectedEntities",
+      "documentIsReviewed",
     ]),
     ...mapState("edit", ["editMode"]),
     ...mapGetters("display", ["visiblePageRange", "bboxToRect"]),
@@ -321,7 +326,13 @@ export default {
     },
 
     onMouseDown(event) {
-      if (this.categorizeModalIsActive || this.editMode) return;
+      if (
+        this.categorizeModalIsActive ||
+        this.editMode ||
+        this.publicView ||
+        this.documentIsReviewed
+      )
+        return;
 
       this.closePopups();
 
@@ -339,9 +350,6 @@ export default {
       ) {
         return;
       }
-      if (this.publicView) {
-        return;
-      }
 
       // anything else, we start selecting
 
@@ -389,7 +397,13 @@ export default {
     },
 
     handleClickedEntity(entity) {
-      if (!entity || this.categorizeModalIsActive) return;
+      if (
+        !entity ||
+        this.categorizeModalIsActive ||
+        this.publicView ||
+        this.documentIsReviewed
+      )
+        return;
 
       // Check if we are creating a new Annotation
       // or if we are editing an existing or empty one
@@ -427,7 +441,12 @@ export default {
     },
 
     onElementEnter() {
-      if (!this.categorizeModalIsActive) {
+      if (
+        !this.categorizeModalIsActive &&
+        !this.publicView &&
+        !this.editMode &&
+        !this.documentIsReviewed
+      ) {
         this.$refs.stage.$el.style.cursor = "pointer";
       }
     },

package/src/components/DocumentPage/DocumentToolbar.vue

@@ -9,7 +9,7 @@
         class="top-aligned"
       >
         <div
-          v-if="!editMode && !publicView"
+          v-if="!editMode && !publicView && !documentIsReviewed"
           :class="[
             'icons icons-left',
             editModeDisabled && 'edit-mode-disabled',
@@ -22,7 +22,10 @@
           <span class="edit-text">{{ $t("edit") }}</span>
         </div>
       </b-tooltip>
-      <div v-if="!editMode && !publicView" class="toolbar-divider" />
+      <div
+        v-if="!editMode && !publicView && !documentIsReviewed"
+        class="toolbar-divider"
+      />
       <div class="icons icons-right">
         <div class="fit-zoom icon" @click.prevent.stop="fitAuto">
           <FitZoomIcon />
@@ -74,6 +77,7 @@ export default {
       "selectedDocument",
       "recalculatingAnnotations",
       "publicView",
+      "documentIsReviewed",
     ]),
     ...mapGetters("document", ["documentCannotBeEdited"]),
   },

package/src/components/DocumentPage/MultiAnnSelection.vue

@@ -136,7 +136,7 @@ export default {
         hasModalCard: true,
         trapFocus: true,
         canCancel: false,
-        customClass: "invisible-parent-modal",
+        customClass: "dv-ui-theme invisible-parent-modal",
         props: { isMultipleAnnotations: true },
         events: {
           labelSet: this.submitAnnotations,

package/src/components/DocumentPage/NewAnnotation.vue

@@ -274,7 +274,7 @@ export default {
         trapFocus: true,
         canCancel: false,
         onCancel: this.disableLabelSetModalShowing,
-        customClass: "invisible-parent-modal",
+        customClass: "dv-ui-theme invisible-parent-modal",
         events: {
           labelSet: this.chooseLabelSet,
           close: this.disableLabelSetModalShowing,

package/src/components/DocumentTopBar/DocumentName.vue

@@ -21,7 +21,11 @@
     </span>
     <div
       v-if="
-        !publicView && showEditBtn && !editMode && !recalculatingAnnotations
+        !publicView &&
+        !documentIsReviewed &&
+        showEditBtn &&
+        !editMode &&
+        !recalculatingAnnotations
       "
       class="edit-btn btn"
       @click="handleEdit"
@@ -91,6 +95,7 @@ export default {
       "selectedDocument",
       "publicView",
       "recalculatingAnnotations",
+      "documentIsReviewed",
     ]),
     ...mapState("display", ["optimalResolution"]),
     ...mapState("edit", ["editMode"]),

package/src/components/DocumentTopBar/DocumentTopBar.vue

@@ -5,21 +5,23 @@
       class="document-top-bar"
     >
       <div v-if="!recalculatingAnnotations" class="left-bar-components">
-        <DocumentCategory v-if="categories && !editMode && !publicView" />
+        <DocumentCategory
+          v-if="categories && !editMode && !publicView && !documentIsReviewed"
+        />
       </div>
 
       <DocumentName :data-file-name="selectedDocument.data_file_name" />
 
       <div v-if="!recalculatingAnnotations" class="right-bar-components">
         <div
-          v-if="!editMode && (!publicView || !selectedDocument.is_reviewed)"
+          v-if="!editMode && (!publicView || !documentIsReviewed)"
           class="keyboard-actions-info"
         >
           <KeyboardActionsDescription />
         </div>
 
         <div
-          v-if="!editMode && (publicView || selectedDocument.is_reviewed)"
+          v-if="!editMode && (publicView || documentIsReviewed)"
           class="read-only-info"
         >
           <b-tooltip
@@ -27,7 +29,7 @@
             position="is-bottom"
             class="right-aligned width-184"
           >
-            <span v-if="publicView && !selectedDocument.is_reviewed">
+            <span v-if="publicView && !documentIsReviewed">
               {{ $t("lite_mode") }}
             </span>
             <span v-else class="doc-reviewed">
@@ -36,15 +38,12 @@
             <b-icon
               :class="[
                 'info-icon is-small',
-                selectedDocument.is_reviewed && 'info-reviewed',
+                documentIsReviewed && 'info-reviewed',
               ]"
               icon="circle-info"
             />
             <template #content>
-              <div
-                v-if="!selectedDocument.is_reviewed"
-                class="read-only-details"
-              >
+              <div v-if="!documentIsReviewed" class="read-only-details">
                 {{ $t("limited_functionalities") }}
               </div>
               <div v-else class="read-only-details">
@@ -96,6 +95,7 @@ export default {
       "publicView",
       "loading",
       "recalculatingAnnotations",
+      "documentIsReviewed",
     ]),
     ...mapState("category", ["categories"]),
     ...mapState("edit", ["editMode"]),

package/src/components/DocumentTopBar/DocumentTopBarButtons.vue

@@ -24,7 +24,7 @@
     </div>
 
     <div
-      v-if="!editMode && !selectedDocument.is_reviewed && !publicView"
+      v-if="!editMode && !documentIsReviewed && !publicView"
       class="finish-review-button-container"
     >
       <b-tooltip
@@ -45,7 +45,7 @@
 
           <div v-else>
             <b-notification :closable="false" :class="['loading-background']">
-              <b-loading :active="isLoading" :is-full-page="loadingOnFullPage">
+              <b-loading :active="isLoading" :is-full-page="false">
                 <b-icon
                   icon="spinner"
                   class="fa-spin loading-icon-size spinner"
@@ -80,6 +80,7 @@ export default {
       "publicView",
       "finishedReview",
       "annotationSets",
+      "documentIsReviewed",
     ]),
     ...mapState("edit", ["editMode", "splitOverview", "updatedDocument"]),
   },
@@ -92,7 +93,7 @@ export default {
         this.finishDisabled = true;
       }
     },
-    publicView(newValue) {
+    documentIsReviewed(newValue) {
       if (newValue) {
         this.finishDisabled = true;
       }

package/src/components/DocumentTopBar/KeyboardActionsDescription.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    v-if="!publicView && !selectedDocument.is_reviewed && !editMode"
+    v-if="!publicView && !documentIsReviewed && !editMode"
     class="keyboard-actions-description"
   >
     <section class="b-tooltips">
@@ -65,7 +65,11 @@ export default {
   },
   computed: {
     ...mapState("edit", ["editMode"]),
-    ...mapState("document", ["selectedDocument", "publicView"]),
+    ...mapState("document", [
+      "selectedDocument",
+      "publicView",
+      "documentIsReviewed",
+    ]),
   },
 };
 </script>

package/src/components/DocumentsList/DocumentsList.vue

@@ -71,6 +71,11 @@
 import { mapGetters, mapState } from "vuex";
 import ServerImage from "../../assets/images/ServerImage";
 import ErrorIcon from "../../assets/images/ErrorIcon";
+import {
+  getURLQueryParam,
+  navigateToNewDocumentURL,
+  getURLPath,
+} from "../../utils/utils";
 
 /**
  * This component creates a horizontal list of documents
@@ -105,8 +110,12 @@ export default {
   },
   methods: {
     changeDocument(documentId) {
-      this.$store.dispatch("document/setDocId", documentId);
-      this.$store.dispatch("document/fetchDocument");
+      if (getURLQueryParam("document") || getURLPath("docs")) {
+        navigateToNewDocumentURL(this.selectedDocument.id, documentId);
+      } else {
+        this.$store.dispatch("document/setDocId", documentId);
+        this.$store.dispatch("document/fetchDocument");
+      }
     },
     requestTrialAccess() {
       window.open("https://konfuzio.com", "_blank");