Fix undo/redo

ProcessMaker · Feb 27, 2024 · 5418d7f · 5418d7f
1 parent 73e76be
commit 5418d7f
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 15 deletions.
diff --git a/src/components/TabsBar.vue b/src/components/TabsBar.vue
@@ -30,7 +30,7 @@
       </div>
     </template>
     <b-tab
-      v-for="(index, n) in localOpenedPages"
+      v-for="(index, n) in validLocalOpenedPages"
       :key="`tab-${n}`"
       class="h-100 w-100"
     >
@@ -42,7 +42,6 @@
           {{ pages[index]?.name }}
         </span>
         <span
-          v-if="localOpenedPages.length > 1"
           :data-test="`close-tab-${n}`"
           class="close-tab"
           role="link"
@@ -119,12 +118,25 @@ export default {
       localOpenedPages: this.initialOpenedPages
     };
   },
+  computed: {
+    validLocalOpenedPages() {
+      return this.localOpenedPages.filter((page) => this.pages[page]);
+    }
+  },
   watch: {
     openedPages: {
       handler(newVal) {
         this.localOpenedPages = newVal;
       },
       deep: true
+    },
+    pages: {
+      handler() {
+        this.localOpenedPages = this.localOpenedPages.filter(
+          (page) => this.pages[page]
+        );
+      },
+      deep: true
     }
   },
   mounted() {
@@ -189,9 +201,14 @@ export default {
       this.$emit("tab-closed", this.pages[pageId], this.localOpenedPages);
     },
     updateTabsReferences(pageDelete) {
-      this.localOpenedPages = this.localOpenedPages.map((page) => page > pageDelete ? page - 1 : page);
+      this.localOpenedPages = this.localOpenedPages.map((page) =>
+        page > pageDelete ? page - 1 : page
+      );
     },
     async openPageByIndex(index) {
+      if (index === -1) {
+        return;
+      }
       const n = this.localOpenedPages.indexOf(index * 1);
       if (n === -1) {
         this.localOpenedPages.push(index);

diff --git a/src/components/vue-form-builder.vue b/src/components/vue-form-builder.vue
@@ -117,7 +117,7 @@
         </template>
         <template #default>
           <div
-            v-if="isCurrentPageEmpty"
+            v-if="isCurrentPageEmpty(currentPage)"
             data-cy="screen-drop-zone"
             class="d-flex justify-content-center align-items-center drag-placeholder text-center position-absolute rounded mt-4 flex-column"
           >
@@ -680,9 +680,6 @@ export default {
 
       return grouped;
     },
-    isCurrentPageEmpty() {
-      return this.config[this.currentPage].items.length === 0;
-    },
     showToolbar() {
       return this.screenType === formTypes.form;
     }
@@ -760,6 +757,9 @@ export default {
     this.setGroupOrder(defaultGroupOrder);
   },
   methods: {
+    isCurrentPageEmpty(currentPage) {
+      return this.config[currentPage]?.items?.length === 0;
+    },
     onClick(page) {
       this.$refs.tabsBar.openPageByIndex(page);
     },
@@ -1041,28 +1041,26 @@ export default {
         currentPage: this.currentPage
       });
     },
-    undo() {
+    async undo() {
       this.inspect();
       this.$store.dispatch("undoRedoModule/undo");
       this.config = JSON.parse(
         this.$store.getters["undoRedoModule/currentState"].config
       );
+      await this.$nextTick();
       this.$refs.tabsBar.openPageByIndex(
-        this.config.indexOf(
-          this.$store.getters["undoRedoModule/currentState"].currentPage
-        )
+        this.$store.getters["undoRedoModule/currentState"].currentPage
       );
     },
-    redo() {
+    async redo() {
       this.inspect();
       this.$store.dispatch("undoRedoModule/redo");
       this.config = JSON.parse(
         this.$store.getters["undoRedoModule/currentState"].config
       );
+      await this.$nextTick();
       this.$refs.tabsBar.openPageByIndex(
-        this.config.indexOf(
-          this.$store.getters["undoRedoModule/currentState"].currentPage
-        )
+        this.$store.getters["undoRedoModule/currentState"].currentPage
       );
     },
     updateConfig(items) {