From 809cdf622ca90df4bc2b5cb69d71946940979083 Mon Sep 17 00:00:00 2001
From: Philipp Reinking <philipp@deck9.co>
Date: Fri, 18 Oct 2024 18:05:16 +0200
Subject: [PATCH] improve logic editor cancel

---
 .../{BlockLogicEdit.vue => BlockLogicEditor.vue}   |  5 +++++
 .../js/components/Factory/Sidebar/Storyboard.vue   |  4 ++--
 resources/js/stores/logic.ts                       | 14 ++++++++++++++
 3 files changed, 21 insertions(+), 2 deletions(-)
 rename resources/js/components/Factory/Sidebar/{BlockLogicEdit.vue => BlockLogicEditor.vue} (97%)

diff --git a/resources/js/components/Factory/Sidebar/BlockLogicEdit.vue b/resources/js/components/Factory/Sidebar/BlockLogicEditor.vue
similarity index 97%
rename from resources/js/components/Factory/Sidebar/BlockLogicEdit.vue
rename to resources/js/components/Factory/Sidebar/BlockLogicEditor.vue
index 6eeb686..0fbe439 100644
--- a/resources/js/components/Factory/Sidebar/BlockLogicEdit.vue
+++ b/resources/js/components/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
index b0ca28e..111570a 100644
--- 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
index 6bd4aa4..f64994b 100644
--- 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;