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;