From b3da446e070f42e852dbf5948e2c8b6f51c228c0 Mon Sep 17 00:00:00 2001
From: Edward Kim <65283190+bepyan@users.noreply.github.com>
Date: Thu, 22 Aug 2024 21:44:55 +0900
Subject: [PATCH] fix: editor history (#94)

* feat: set initial data from props

* fix: undo lose focus

* fix: activate selected element tab
---
 src/components/editor/action.ts    | 15 +++++++++++----
 src/components/editor/provider.tsx | 22 ++++++++++++++++++----
 2 files changed, 29 insertions(+), 8 deletions(-)

diff --git a/src/components/editor/action.ts b/src/components/editor/action.ts
index 6bbed7b..adec3ed 100644
--- a/src/components/editor/action.ts
+++ b/src/components/editor/action.ts
@@ -81,6 +81,7 @@ const updateEditorHistory = (
     state: {
       ...editor.state,
       selectedElement: newSelectedElement,
+      currentTabValue: editorTabValue.ELEMENT_SETTINGS,
     },
     data: newData,
     history: {
@@ -368,10 +369,8 @@ const actionHandlers: {
     const isValidSelect = isValidSelectEditorElement(payload.elementDetails);
 
     const newTabValue = isValidSelect
-      ? editorTabValue.ELEMENTS
-      : editor.state.currentTabValue === editorTabValue.ELEMENT_SETTINGS
-        ? editorTabValue.ELEMENT_SETTINGS
-        : editor.state.currentTabValue;
+      ? editorTabValue.ELEMENT_SETTINGS
+      : editor.state.currentTabValue;
 
     return {
       ...editor,
@@ -433,6 +432,10 @@ const actionHandlers: {
           ...editor.history,
           currentIndex: nextIndex,
         },
+        state: {
+          ...editor.state,
+          selectedElement: emptyElement,
+        },
       };
     }
     return editor;
@@ -448,6 +451,10 @@ const actionHandlers: {
           ...editor.history,
           currentIndex: prevIndex,
         },
+        state: {
+          ...editor.state,
+          selectedElement: emptyElement,
+        },
       };
     }
     return editor;
diff --git a/src/components/editor/provider.tsx b/src/components/editor/provider.tsx
index 8bf4185..055a891 100644
--- a/src/components/editor/provider.tsx
+++ b/src/components/editor/provider.tsx
@@ -1,6 +1,12 @@
 "use client";
 
-import { createContext, useContext, useReducer, type Dispatch } from "react";
+import {
+  createContext,
+  useContext,
+  useMemo,
+  useReducer,
+  type Dispatch,
+} from "react";
 import { editorReducer, type EditorAction } from "~/components/editor/action";
 import {
   initialEditor,
@@ -36,12 +42,20 @@ export default function EditorProvider({
   editorData,
   editorState,
 }: EditorProviderProps) {
-  const [editor, dispatch] = useReducer(editorReducer, {
-    ...initialEditor,
-    data: {
+  const initialData = useMemo(() => {
+    return {
       ...initialEditor.data,
       ...editorData,
+    };
+  }, [editorData]);
+
+  const [editor, dispatch] = useReducer(editorReducer, {
+    ...initialEditor,
+    history: {
+      ...initialEditor.history,
+      list: [initialData],
     },
+    data: initialData,
     config: {
       ...initialEditorConfig,
       ...editorConfig,