@konfuzio/document-validation-ui 0.1.5-automatic-document-splitting-2 → 0.1.5-pre-release-1

package/src/store/edit.js

@@ -1,5 +1,4 @@
 import myImports from "../api";
-import { getURLQueryParam, navigateToNewDocumentURL } from "../utils/utils";
 
 const HTTP = myImports.HTTP;
 
@@ -7,10 +6,9 @@ const state = {
   editMode: false,
   splitOverview: false,
   isMultipleSelection: false,
-  pagesForPostprocess: [],
+  documentPagesListForEditMode: [], // TODO: change name
   selectedPages: [],
   updatedDocument: [],
-  showEditConfirmationModal: false,
 };
 
 const actions = {
@@ -27,8 +25,8 @@ const actions = {
     commit("SET_SPLIT_OVERVIEW", overview);
   },
 
-  setPagesForPostprocess: ({ commit }, pages) => {
-    commit("SET_PAGES_FOR_POSTPROCESS", pages);
+  setDocumentPagesListForEditMode: ({ commit }, pages) => {
+    commit("SET_DOCUMENT_PAGES_FOR_EDIT_MODE", pages);
   },
 
   setUpdatedDocument: ({ commit }, updatedDocument) => {
@@ -59,41 +57,42 @@ const actions = {
   },
 
   rotatePage: ({ state, commit }, { page, direction }) => {
-    if (state.pagesForPostprocess.find((p) => p.id === page[0].id)) {
-      const pagesForPostprocess = state.pagesForPostprocess.map((p) => {
-        let rotatedAngle;
-        if (direction === "left") {
-          rotatedAngle = p.angle - 90;
-          if (p.id === page[0].id) {
-            if (rotatedAngle === -270) {
-              rotatedAngle = 90;
+    if (state.documentPagesListForEditMode.find((p) => p.id === page[0].id)) {
+      const documentPagesListForEditMode =
+        state.documentPagesListForEditMode.map((p) => {
+          let rotatedAngle;
+          if (direction === "left") {
+            rotatedAngle = p.angle - 90;
+            if (p.id === page[0].id) {
+              if (rotatedAngle === -270) {
+                rotatedAngle = 90;
+              }
+              return {
+                ...p,
+                angle: rotatedAngle,
+              };
             }
-            return {
-              ...p,
-              angle: rotatedAngle,
-            };
+            return p;
           }
-          return p;
-        }
-        if (direction === "right") {
-          rotatedAngle = p.angle + 90;
-          if (p.id === page[0].id) {
-            if (rotatedAngle === 270) {
-              rotatedAngle = -90;
+          if (direction === "right") {
+            rotatedAngle = p.angle + 90;
+            if (p.id === page[0].id) {
+              if (rotatedAngle === 270) {
+                rotatedAngle = -90;
+              }
+              return {
+                ...p,
+                angle: rotatedAngle,
+              };
             }
-            return {
-              ...p,
-              angle: rotatedAngle,
-            };
+            return p;
           }
-          return p;
-        }
-      });
+        });
 
-      commit("SET_PAGES_FOR_POSTPROCESS", pagesForPostprocess);
+      commit("SET_DOCUMENT_PAGES_FOR_EDIT_MODE", documentPagesListForEditMode);
     } else {
       if (direction === "left") {
-        state.pagesForPostprocess.push({
+        state.documentPagesListForEditMode.push({
           id: page.id,
           number: page.number,
           angle: -90,
@@ -103,7 +102,7 @@ const actions = {
       }
 
       if (direction === "right") {
-        state.pagesForPostprocess.push({
+        state.documentPagesListForEditMode.push({
           id: page.id,
           number: page.number,
           angle: 90,
@@ -116,7 +115,7 @@ const actions = {
 
   updateRotationToTheLeft: ({ state, commit }) => {
     // updated the angles that will be sent to the backend
-    const array = state.pagesForPostprocess.map((p) => {
+    const array = state.documentPagesListForEditMode.map((p) => {
       let rotatedAngle = p.angle - 90;
       if (rotatedAngle === -270) {
         rotatedAngle = 90;
@@ -127,12 +126,12 @@ const actions = {
       };
     });
 
-    commit("SET_PAGES_FOR_POSTPROCESS", array);
+    commit("SET_DOCUMENT_PAGES_FOR_EDIT_MODE", array);
   },
 
   updateRotationToTheRight: ({ state, commit }) => {
     // updated the angles that will be sent to the backend
-    const array = state.pagesForPostprocess.map((p) => {
+    const array = state.documentPagesListForEditMode.map((p) => {
       let rotatedAngle = p.angle + 90;
       if (rotatedAngle === 270) {
         rotatedAngle = -90;
@@ -143,16 +142,13 @@ const actions = {
       };
     });
 
-    commit("SET_PAGES_FOR_POSTPROCESS", array);
+    commit("SET_DOCUMENT_PAGES_FOR_EDIT_MODE", array);
   },
 
   editDocument: ({ rootState, dispatch }, editedDocument) => {
     dispatch("document/startRecalculatingAnnotations", null, {
       root: true,
     });
-
-    const oldId = rootState.document.documentId;
-
     return new Promise((resolve) => {
       HTTP.post(
         `/documents/${rootState.document.documentId}/postprocess/`,
@@ -160,22 +156,15 @@ const actions = {
       )
         .then(async (response) => {
           if (response && response.status === 200) {
-            const newId = response.data[0].id;
-
-            if (newId !== oldId) {
-              if (getURLQueryParam("document")) {
-                navigateToNewDocumentURL(oldId, newId);
-              } else {
-                await dispatch("document/setDocId", newId, {
-                  root: true,
-                });
-
-                dispatch("document/pollDocumentEndpoint", null, {
-                  root: true,
-                });
-              }
-            }
-
+            const newDocument = response.data[0];
+            const newId = newDocument.id;
+
+            await dispatch("document/setDocId", newId, {
+              root: true,
+            });
+            dispatch("document/pollDocumentEndpoint", null, {
+              root: true,
+            });
             resolve(null);
           } else {
             resolve(response);
@@ -187,10 +176,6 @@ const actions = {
         });
     });
   },
-
-  setShowEditConfirmationModal: ({ commit }, value) => {
-    commit("SET_SHOW_EDIT_CONFIRMATION_MODAL", value);
-  },
 };
 
 const mutations = {
@@ -202,8 +187,8 @@ const mutations = {
     state.splitOverview = overview;
   },
 
-  SET_PAGES_FOR_POSTPROCESS: (state, pages) => {
-    state.pagesForPostprocess = pages;
+  SET_DOCUMENT_PAGES_FOR_EDIT_MODE: (state, pages) => {
+    state.documentPagesListForEditMode = pages;
   },
 
   SET_UPDATED_DOCUMENT: (state, updatedDocument) => {
@@ -215,9 +200,6 @@ const mutations = {
   ADD_SELECTED_PAGE: (state, selectedPage) => {
     state.selectedPages.push(selectedPage);
   },
-  SET_SHOW_EDIT_CONFIRMATION_MODAL: (state, value) => {
-    state.showEditConfirmationModal = value;
-  },
 };
 
 export default {

package/src/store/project.js

@@ -3,7 +3,7 @@ const HTTP = myImports.HTTP;
 
 const state = {
   projectId: null,
-  currentUser: null,
+  currentUser: null
 };
 
 const getters = {
@@ -11,13 +11,13 @@ const getters = {
    * Gets label sets for an annotation set creation
    */
   labelSetsFilteredForAnnotationSetCreation:
-    (state) => (labelsSet, annotationSets) => {
+    state => (labelsSet, annotationSets) => {
       let returnLabels = [];
       if (labelsSet) {
-        returnLabels = labelsSet.filter((labelSet) => {
+        returnLabels = labelsSet.filter(labelSet => {
           // check if label set has multiple and if not, if there's already an annotation set created
           if (!labelSet.has_multiple_annotation_sets) {
-            const existingAnnotationSet = annotationSets.find((annSet) => {
+            const existingAnnotationSet = annotationSets.find(annSet => {
               return annSet.id === labelSet.id;
             });
             return existingAnnotationSet;
@@ -27,7 +27,7 @@ const getters = {
         });
       }
       return returnLabels;
-    },
+    }
 };
 
 const actions = {
@@ -38,10 +38,10 @@ const actions = {
   fetchLabelSetDetails: ({ commit, state }, labelSetId) => {
     return new Promise((resolve, reject) => {
       HTTP.get(`label-sets/${labelSetId}/`)
-        .then((response) => {
+        .then(response => {
           return resolve(response.data);
         })
-        .catch((error) => {
+        .catch(error => {
           reject(error);
           console.log(error);
         });
@@ -52,10 +52,10 @@ const actions = {
   fetchLabelSets: ({ state }) => {
     return new Promise((resolve, reject) => {
       HTTP.get(`label-sets/?project=${state.projectId}`)
-        .then((response) => {
+        .then(response => {
           return resolve(response.data.results);
         })
-        .catch((error) => {
+        .catch(error => {
           reject(error);
           console.log(error);
         });
@@ -64,17 +64,17 @@ const actions = {
 
   fetchCurrentUser: ({ commit }) => {
     return HTTP.get(`/auth/me/`)
-      .then((response) => {
+      .then(response => {
         commit("SET_CURRENT_USER", response.data.username);
       })
-      .catch((error) => {
+      .catch(error => {
         console.log(error);
       });
   },
 
   setCurrentUser: ({ commit }, currentUser) => {
     commit("SET_CURRENT_USER", currentUser);
-  },
+  }
 };
 
 const mutations = {
@@ -83,7 +83,7 @@ const mutations = {
   },
   SET_CURRENT_USER: (state, currentUser) => {
     state.currentUser = currentUser;
-  },
+  }
 };
 
 export default {
@@ -91,5 +91,5 @@ export default {
   state,
   actions,
   mutations,
-  getters,
+  getters
 };

package/src/assets/images/MagicWandIcon.vue

@@ -1,16 +0,0 @@
-<template>
-  <svg
-    width="19"
-    height="19"
-    viewBox="0 0 19 19"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      fill-rule="evenodd"
-      clip-rule="evenodd"
-      d="M11.5098 0.833984C11.97 0.833984 12.3431 1.20708 12.3431 1.66732V2.91732C12.3431 3.37755 11.97 3.75065 11.5098 3.75065C11.0496 3.75065 10.6765 3.37755 10.6765 2.91732V1.66732C10.6765 1.20708 11.0496 0.833984 11.5098 0.833984ZM6.70333 2.74473C7.02877 2.41929 7.55641 2.41929 7.88184 2.74473L8.76573 3.62861C9.09116 3.95405 9.09116 4.48169 8.76573 4.80712C8.44029 5.13256 7.91265 5.13256 7.58721 4.80712L6.70333 3.92324C6.37789 3.5978 6.37789 3.07017 6.70333 2.74473ZM16.2657 2.74473C16.5912 3.07017 16.5912 3.5978 16.2657 3.92324L15.3818 4.80712C15.0564 5.13256 14.5288 5.13256 14.2033 4.80712C13.8779 4.48169 13.8779 3.95405 14.2033 3.62861L15.0872 2.74473C15.4127 2.41929 15.9403 2.41929 16.2657 2.74473ZM9.73615 5.84407C10.0709 5.7353 10.4315 5.7353 10.7662 5.84407C11.0076 5.92251 11.1925 6.05549 11.3383 6.17918C11.4709 6.29182 11.6158 6.43668 11.7645 6.58543L12.4164 7.23737C12.5651 7.38607 12.71 7.53089 12.8226 7.66358C12.9463 7.80928 13.0793 7.99419 13.1578 8.23562C13.2665 8.57036 13.2665 8.93094 13.1578 9.26568C13.0793 9.50711 12.9463 9.69202 12.8226 9.83772C12.71 9.9704 12.5652 10.1152 12.4164 10.2639L10.4244 12.256C10.4242 12.2562 10.424 12.2564 10.4238 12.2566C10.4236 12.2568 10.4234 12.257 10.4232 12.2572L4.68113 17.9992C4.53242 18.148 4.3876 18.2928 4.25492 18.4055C4.10921 18.5291 3.9243 18.6621 3.68287 18.7406C3.34813 18.8493 2.98755 18.8493 2.65281 18.7406C2.41138 18.6621 2.22648 18.5291 2.08077 18.4055C1.94809 18.2928 1.80327 18.148 1.65456 17.9992L1.63578 17.9804L1.0214 17.366L1.0026 17.3473C0.853863 17.1986 0.709012 17.0537 0.596376 16.9211C0.472682 16.7754 0.339706 16.5904 0.26126 16.349C0.152497 16.0143 0.152497 15.6537 0.26126 15.319C0.339706 15.0775 0.472681 14.8926 0.596375 14.7469C0.709013 14.6142 0.853865 14.4694 1.0026 14.3207L6.74496 8.57836L8.73791 6.5854C8.88661 6.43667 9.03142 6.29182 9.1641 6.17918C9.30981 6.05549 9.49472 5.92251 9.73615 5.84407ZM7.33451 10.3458L2.19991 15.4804C2.02518 15.6552 1.93003 15.7512 1.86694 15.8255C1.86443 15.8285 1.86207 15.8313 1.85985 15.834C1.86207 15.8366 1.86443 15.8395 1.86694 15.8424C1.93003 15.9167 2.02518 16.0128 2.19991 16.1875L2.81429 16.8019C2.98902 16.9767 3.08509 17.0718 3.1594 17.1349C3.16236 17.1374 3.16518 17.1398 3.16785 17.142C3.17052 17.1398 3.17333 17.1374 3.17629 17.1349C3.2506 17.0718 3.34667 16.9766 3.5214 16.8019L8.656 11.6673L7.33451 10.3458ZM9.83451 10.4888L8.51302 9.16732L9.89762 7.78272C10.0724 7.60799 10.1684 7.51284 10.2427 7.44975C10.2457 7.44724 10.2485 7.44487 10.2512 7.44265C10.2538 7.44487 10.2567 7.44724 10.2596 7.44975C10.3339 7.51284 10.43 7.60799 10.6047 7.78272L11.2191 8.3971C11.3938 8.57183 11.489 8.66789 11.5521 8.74221C11.5546 8.74516 11.557 8.74798 11.5592 8.75065C11.557 8.75332 11.5546 8.75614 11.5521 8.75909C11.489 8.83341 11.3938 8.92947 11.2191 9.1042L9.83451 10.4888ZM15.2598 7.50065C15.2598 7.04041 15.6329 6.66732 16.0931 6.66732H17.3431C17.8034 6.66732 18.1765 7.04041 18.1765 7.50065C18.1765 7.96089 17.8034 8.33398 17.3431 8.33398H16.0931C15.6329 8.33398 15.2598 7.96089 15.2598 7.50065ZM14.2033 10.2447C14.5288 9.91929 15.0564 9.91929 15.3818 10.2447L16.2657 11.1286C16.5912 11.454 16.5912 11.9817 16.2657 12.3071C15.9403 12.6326 15.4127 12.6326 15.0872 12.3071L14.2033 11.4232C13.8779 11.0978 13.8779 10.5702 14.2033 10.2447Z"
-      fill="#41AF85"
-    />
-  </svg>
-</template>

package/src/assets/images/StarIcon.vue

@@ -1,16 +0,0 @@
-<template>
-  <svg
-    width="16"
-    height="16"
-    viewBox="0 0 16 16"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      fill-rule="evenodd"
-      clip-rule="evenodd"
-      d="M2.99935 0.667969C3.36754 0.667969 3.66602 0.966446 3.66602 1.33464V2.33464H4.66602C5.03421 2.33464 5.33268 2.63311 5.33268 3.0013C5.33268 3.36949 5.03421 3.66797 4.66602 3.66797H3.66602V4.66797C3.66602 5.03616 3.36754 5.33464 2.99935 5.33464C2.63116 5.33464 2.33268 5.03616 2.33268 4.66797V3.66797H1.33268C0.964492 3.66797 0.666016 3.36949 0.666016 3.0013C0.666016 2.63311 0.964492 2.33464 1.33268 2.33464H2.33268V1.33464C2.33268 0.966446 2.63116 0.667969 2.99935 0.667969ZM8.66601 1.33464C8.94186 1.33464 9.18922 1.50452 9.28824 1.76198L10.4444 4.76789C10.6446 5.28859 10.7076 5.43863 10.7936 5.5597C10.88 5.68117 10.9861 5.7873 11.1076 5.87367C11.2287 5.95975 11.3787 6.02268 11.8994 6.22295L14.9053 7.37907C15.1628 7.47809 15.3327 7.72545 15.3327 8.0013C15.3327 8.27715 15.1628 8.52451 14.9053 8.62353L11.8994 9.77965C11.3787 9.97992 11.2287 10.0429 11.1076 10.1289C10.9861 10.2153 10.88 10.3214 10.7936 10.4429C10.7076 10.564 10.6446 10.714 10.4444 11.2347L9.28825 14.2406C9.18922 14.4981 8.94186 14.668 8.66602 14.668C8.39017 14.668 8.14281 14.4981 8.04379 14.2406L6.88767 11.2347C6.6874 10.714 6.62447 10.564 6.53838 10.4429C6.45201 10.3214 6.34588 10.2153 6.22441 10.1289C6.10335 10.0429 5.9533 9.97992 5.4326 9.77965L2.4267 8.62353C2.16923 8.52451 1.99935 8.27715 1.99935 8.0013C1.99935 7.72545 2.16923 7.47809 2.4267 7.37907L5.4326 6.22295C5.9533 6.02268 6.10335 5.95975 6.22441 5.87367C6.34588 5.7873 6.45201 5.68117 6.53838 5.5597C6.62447 5.43863 6.6874 5.28859 6.88767 4.76789L8.04378 1.76198C8.14281 1.50452 8.39017 1.33464 8.66601 1.33464ZM2.99935 10.668C3.36754 10.668 3.66602 10.9664 3.66602 11.3346V12.3346H4.66602C5.03421 12.3346 5.33268 12.6331 5.33268 13.0013C5.33268 13.3695 5.03421 13.668 4.66602 13.668H3.66602V14.668C3.66602 15.0362 3.36754 15.3346 2.99935 15.3346C2.63116 15.3346 2.33268 15.0362 2.33268 14.668V13.668H1.33268C0.964492 13.668 0.666016 13.3695 0.666016 13.0013C0.666016 12.6331 0.964492 12.3346 1.33268 12.3346H2.33268V11.3346C2.33268 10.9664 2.63116 10.668 2.99935 10.668Z"
-      fill="#41AF85"
-    />
-  </svg>
-</template>

package/src/assets/scss/splitting_confirmation_modal.scss

@@ -1,41 +0,0 @@
-@import "./imports.scss";
-
-.splitting-confirmation-modal {
-  .header {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    padding-bottom: 15px;
-    font-weight: 500;
-    font-size: 18px;
-  }
-
-  .content {
-    text-align: left;
-    font-weight: 400;
-    font-size: 14px;
-    color: $text-color;
-  }
-
-  .modal-card-foot {
-    display: flex;
-    flex-direction: column;
-    gap: 10px;
-
-    .recommended {
-      font-weight: 600;
-      font-size: 11px;
-      background-color: rgba(255, 255, 255, 0.2);
-      padding: 2px 5px;
-      border-radius: 36px;
-    }
-
-    .button {
-      width: 100%;
-
-      &.is-primary {
-        font-weight: 500;
-      }
-    }
-  }
-}

package/src/components/DocumentEdit/EditConfirmationModal.vue

@@ -1,54 +0,0 @@
-<template>
-  <section class="edit-confirmation-modal">
-    <b-modal v-model="isModalActive" :can-cancel="[]" class="edit-modal">
-      <section class="modal-card-body">
-        <div class="header">
-          <p class="modal-title">{{ $t("confirm_splitting") }}</p>
-        </div>
-        <div class="content">{{ $t("splitting_warning") }}</div>
-      </section>
-      <footer class="modal-card-foot">
-        <b-button @click="closeModal">
-          {{ $t("no") }}
-        </b-button>
-        <b-button type="is-primary" @click="confirmChanges">
-          {{ $t("yes") }}
-        </b-button>
-      </footer>
-    </b-modal>
-  </section>
-</template>
-
-<script>
-import { mapState } from "vuex";
-/**
- * This component shows a modal to confirm the edit changes in the document
- */
-export default {
-  name: "EditConfirmationModal",
-  data() {
-    return {
-      isModalActive: false,
-    };
-  },
-  computed: {
-    ...mapState("edit", ["showEditConfirmationModal"]),
-  },
-  watch: {
-    showEditConfirmationModal(newValue) {
-      this.isModalActive = newValue;
-    },
-  },
-  methods: {
-    closeModal() {
-      this.isModalActive = false;
-      this.$store.dispatch("edit/setShowEditConfirmationModal", false);
-    },
-    confirmChanges() {
-      this.$emit("save-changes");
-    },
-  },
-};
-</script>
-
-<style scoped lang="scss" src="../../assets/scss/document_edit.scss"></style>

package/src/components/DocumentEdit/SidebarButtons.vue

@@ -1,53 +0,0 @@
-<template>
-  <div class="sidebar-buttons">
-    <!-- Rotate buttons -->
-    <div v-if="showRotateButton" class="rotate-button-container">
-      <b-button
-        class="rotate-button edit-mode-btn primary-button"
-        :disabled="buttonDisabled"
-        @click="rotateButton"
-      >
-        <div class="button-content">
-          <b-icon :icon="icon" class="is-small" />
-          <span class="button-text">{{ buttonText }}</span>
-        </div>
-      </b-button>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "SidebarButtons",
-  props: {
-    showRotateButton: {
-      type: Boolean,
-      default: false,
-    },
-    buttonDisabled: {
-      type: Boolean,
-      default: true,
-    },
-    buttonText: {
-      type: String,
-      default: null,
-    },
-    icon: {
-      type: String,
-      default: null,
-    },
-    tooltipInfo: {
-      type: String,
-      default: null,
-    },
-  },
-
-  methods: {
-    rotateButton() {
-      this.$emit("rotate");
-    },
-  },
-};
-</script>
-
-<style scoped lang="scss" src="../../assets/scss/document_edit.scss"></style>

package/src/components/DocumentEdit/SplitInfoBar.vue

@@ -1,19 +0,0 @@
-<template>
-  <div class="split-info-bar">
-    <StarIcon />
-    <span> {{ $t("smart_split_suggestions") }}</span>
-  </div>
-</template>
-
-<script>
-import StarIcon from "../../assets/images/StarIcon";
-
-export default {
-  name: "SplitInfoBar",
-  components: {
-    StarIcon,
-  },
-};
-</script>
-
-<style scoped lang="scss" src="../../assets/scss/document_edit.scss"></style>

package/src/components/DocumentModals/SplittingSuggestionsModal.vue

@@ -1,121 +0,0 @@
-<template>
-  <section ref="splittingModal" class="splitting-confirmation-modal">
-    <b-modal
-      v-model="isModalActive"
-      class="modal-400"
-      :width="500"
-      :can-cancel="[]"
-    >
-      <section class="modal-card-body split-modal">
-        <div class="header">
-          <StarIcon />
-          <p class="modal-title">
-            {{
-              splittingSuggestions && splittingSuggestions.length > 0
-                ? $t("split_modal_title")
-                : $t("prepare_document")
-            }}
-          </p>
-        </div>
-        <div ref="bodyText" class="content"></div>
-      </section>
-      <footer class="modal-card-foot">
-        <b-button @click="closeModal">
-          {{ $t("do_it_later") }}
-        </b-button>
-        <b-button type="is-primary" @click="handleReviewNow">
-          {{ $t("review_now") }}
-          <span class="recommended">{{ recommended }}</span>
-        </b-button>
-      </footer>
-    </b-modal>
-  </section>
-</template>
-
-<script>
-import { nextTick } from "vue";
-import { mapGetters, mapState } from "vuex";
-import StarIcon from "../../assets/images/StarIcon";
-
-/**
- * This component shows a modal to inform the user about auto-splitting suggestions
- */
-export default {
-  name: "SplittingSuggestionsModal",
-  components: {
-    StarIcon,
-  },
-  data() {
-    return {
-      isModalActive: false,
-      recommended: this.$t("recommended"),
-    };
-  },
-  computed: {
-    ...mapState("document", ["splittingSuggestions", "selectedDocument"]),
-    ...mapGetters("document", ["waitingForSplittingConfirmation"]),
-  },
-  watch: {
-    splittingSuggestions(newValue) {
-      if (newValue) {
-        this.isModalActive = true;
-      }
-    },
-    isModalActive(newValue) {
-      if (newValue) {
-        this.$nextTick(() => {
-          if (
-            this.splittingSuggestions &&
-            this.splittingSuggestions.length > 0
-          ) {
-            this.$refs.bodyText.innerHTML = this.$t("split_modal_body", {
-              number_of_split_documents: this.splittingSuggestions.length,
-            });
-          } else {
-            this.$refs.bodyText.innerHTML = this.$t(
-              "split_modal_no_suggestions"
-            );
-          }
-        });
-      }
-    },
-  },
-  mounted() {
-    if (this.splittingSuggestions) {
-      this.isModalActive = true;
-    }
-
-    nextTick(() => {
-      if (this.recommended) {
-        this.recommended = this.recommended.toUpperCase();
-      }
-    });
-  },
-  methods: {
-    closeModal() {
-      const updatedDocument = [
-        {
-          name: this.selectedDocument.data_file_name,
-          category: this.selectedDocument.category,
-          pages: this.selectedDocument.pages,
-        },
-      ];
-
-      this.$store.dispatch("edit/editDocument", updatedDocument);
-
-      this.$store.dispatch("display/setCategorizeModalIsActive", false);
-      this.isModalActive = false;
-    },
-    handleReviewNow() {
-      this.$store.dispatch("edit/enableEditMode");
-      this.isModalActive = false;
-    },
-  },
-};
-</script>
-
-<style
-  scoped
-  lang="scss"
-  src="../../assets/scss/splitting_confirmation_modal.scss"
-></style>