improve logic editor cancel

deck9 · Oct 18, 2024 · 809cdf6 · 809cdf6
1 parent 564353d
commit 809cdf6
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 2 deletions.
diff --git a/...onents/Factory/Sidebar/BlockLogicEdit.vue → ...ents/Factory/Sidebar/BlockLogicEditor.vue b/...onents/Factory/Sidebar/BlockLogicEdit.vue → ...ents/Factory/Sidebar/BlockLogicEditor.vue
@@ -116,6 +116,9 @@ const isSaving = ref(false);
 
 const { isShowingLogicEditor, block } = storeToRefs(store);
 
+// on mount, backup the current logic to restore in case of cancel
+store.backupLogic();
+
 const save = async () => {
   isSaving.value = true;
 
@@ -128,11 +131,13 @@ const save = async () => {
 
   setTimeout(() => {
     isSaving.value = false;
+    store.backupLogic();
     store.hideLogicEditor();
   }, 250);
 };
 
 const close = () => {
+  store.restoreLogic();
   store.hideLogicEditor();
 };
 </script>
diff --git a/resources/js/components/Factory/Sidebar/Storyboard.vue b/resources/js/components/Factory/Sidebar/Storyboard.vue
@@ -64,7 +64,7 @@
       />
     </div>
   </div>
-  <BlockLogicEdit />
+  <BlockLogicEditor />
 </template>
 
 <script setup lang="ts">
@@ -76,7 +76,7 @@ import BlockContainer from "./BlockContainer.vue";
 import EmptyState from "@/components/EmptyState.vue";
 import ScrollShadow from "@/components/ScrollShadow.vue";
 import _throttle from "lodash/throttle";
-import BlockLogicEdit from "@/components/Factory/Sidebar/BlockLogicEdit.vue";
+import BlockLogicEditor from "@/components/Factory/Sidebar/BlockLogicEditor.vue";
 
 const isLoaded = ref(false);
 const store = useForm();

diff --git a/resources/js/stores/logic.ts b/resources/js/stores/logic.ts
@@ -16,6 +16,7 @@ interface LogicStore {
     validation: ValidationError[];
     isShowingLogicEditor: boolean;
     hideRule: FormBlockLogic | null;
+    backup: FormBlockLogic[] | null;
 }
 
 export const operators: Array<{ key: Operator; label: string }> = [
@@ -44,6 +45,7 @@ export const useLogic = defineStore("logic", {
             isShowingLogicEditor: false,
             hideRule: null,
             validation: [],
+            backup: null,
         };
     },
 
@@ -58,6 +60,18 @@ export const useLogic = defineStore("logic", {
             this.isShowingLogicEditor = false;
         },
 
+        backupLogic() {
+            this.backup = this.block?.logics ?? null;
+        },
+
+        restoreLogic() {
+            if (!this.block) {
+                return;
+            }
+
+            this.block.logics = this.backup ?? undefined;
+        },
+
         addRule() {
             if (!this.block) {
                 return;