feat: LWW replaceOperator

dineug · Oct 21, 2023 · dd943ab · dd943ab
1 parent dd7a605
commit dd943ab
Show file tree

Hide file tree

Showing 9 changed files with 175 additions and 101 deletions.
diff --git a/packages/erd-editor/src/engine/history.actions.ts b/packages/erd-editor/src/engine/history.actions.ts
@@ -1,5 +1,6 @@
 import { AnyAction } from '@dineug/r-html';
 import { safeCallback } from '@dineug/shared';
+import { cloneDeep } from 'lodash-es';
 
 import { History } from '@/engine/history';
 import { Store } from '@/engine/store';
@@ -39,11 +40,18 @@ function push(store: Store, history: History, actions: AnyAction[]) {
   if (!undoActions.length || !redoActions.length) return;
 
   history.push({
-    undo: () => store.dispatchSync(undoActions),
-    redo: () => store.dispatchSync(redoActions),
+    undo: () => store.dispatchSync(undoActions.map(cloneAction)),
+    redo: () => store.dispatchSync(redoActions.map(cloneAction)),
   });
 }
 
+function cloneAction(action: AnyAction) {
+  return {
+    ...cloneDeep(action),
+    timestamp: Date.now(),
+  };
+}
+
 export const pushHistory =
   (store: Store, history: History) => (actions: AnyAction[]) => {
     safeCallback(push, store, history, actions);

diff --git a/packages/erd-editor/src/engine/modules/editor/atom.actions.ts b/packages/erd-editor/src/engine/modules/editor/atom.actions.ts
@@ -83,9 +83,10 @@ export const clearAction = createAction<ActionMap[typeof ActionType.clear]>(
 );
 
 const clear: ReducerType<typeof ActionType.clear> = state => {
-  const { doc, collections } = schemaV3Parser({});
+  const { doc, collections, lww } = schemaV3Parser({});
   state.doc = doc;
   state.collections = collections;
+  state.lww = lww;
 };
 
 export const loadJsonAction = createAction<
@@ -96,11 +97,12 @@ const loadJson: ReducerType<typeof ActionType.loadJson> = (
   state,
   { payload: { value } }
 ) => {
-  const { version, settings, doc, collections } = parser(value);
+  const { version, settings, doc, collections, lww } = parser(value);
   state.version = version;
   state.settings = settings;
   state.doc = doc;
   state.collections = collections;
+  state.lww = lww;
 };
 
 export const editorReducers = {

diff --git a/packages/erd-editor/src/engine/modules/editor/generator.actions.ts b/packages/erd-editor/src/engine/modules/editor/generator.actions.ts
@@ -17,7 +17,7 @@ export const moveAllAction$ = (
   movementX: number,
   movementY: number
 ): GeneratorAction =>
-  function* ({ editor: { selectedMap } }) {
+  function* ({ editor: { selectedMap }, settings: { zoomLevel } }) {
     const { tableIds, memoIds } = Object.entries(selectedMap).reduce(
       (acc, [id, type]) => {
         if (type === SelectType.table) {
@@ -34,12 +34,23 @@ export const moveAllAction$ = (
       }
     );
 
+    const newMovementX = movementX / zoomLevel;
+    const newMovementY = movementY / zoomLevel;
+
     if (tableIds.length) {
-      yield moveTableAction({ ids: tableIds, movementX, movementY });
+      yield moveTableAction({
+        ids: tableIds,
+        movementX: newMovementX,
+        movementY: newMovementY,
+      });
     }
 
     if (memoIds.length) {
-      yield moveMemoAction({ ids: memoIds, movementX, movementY });
+      yield moveMemoAction({
+        ids: memoIds,
+        movementX: newMovementX,
+        movementY: newMovementY,
+      });
     }
   };
 

diff --git a/packages/erd-editor/src/engine/modules/memo/atom.actions.ts b/packages/erd-editor/src/engine/modules/memo/atom.actions.ts
@@ -70,14 +70,16 @@ export const changeMemoValueAction = createAction<
 >(ActionType.changeMemoValue);
 
 const changeMemoValue: ReducerType<typeof ActionType.changeMemoValue> = (
-  { collections },
-  { payload: { id, value } }
+  { collections, lww },
+  { payload: { id, value }, timestamp }
 ) => {
   const collection = query(collections).collection('memoEntities');
   collection.getOrCreate(id, id => createMemo({ id }));
 
-  collection.updateOne(id, memo => {
-    memo.value = value;
+  collection.replaceOperator(lww, timestamp, id, 'value', () => {
+    collection.updateOne(id, memo => {
+      memo.value = value;
+    });
   });
 };
 

diff --git a/packages/erd-editor/src/engine/modules/settings/atom.actions.ts b/packages/erd-editor/src/engine/modules/settings/atom.actions.ts
@@ -1,6 +1,7 @@
 import { createAction } from '@dineug/r-html';
 import { createInRange } from '@dineug/shared';
 
+import { replaceOperator } from '@/utils/collection/lww';
 import {
   canvasSizeInRange,
   hasBracketType,
@@ -18,10 +19,12 @@ export const changeDatabaseNameAction = createAction<
 >(ActionType.changeDatabaseName);
 
 const changeDatabaseName: ReducerType<typeof ActionType.changeDatabaseName> = (
-  { settings },
-  { payload: { value } }
+  { settings, lww },
+  { payload: { value }, timestamp }
 ) => {
-  settings.databaseName = value;
+  replaceOperator(lww, timestamp, '', 'settings.databaseName', () => {
+    settings.databaseName = value;
+  });
 };
 
 export const resizeAction = createAction<ActionMap[typeof ActionType.resize]>(

diff --git a/packages/erd-editor/src/engine/modules/table/atom.actions.ts b/packages/erd-editor/src/engine/modules/table/atom.actions.ts
@@ -70,16 +70,18 @@ export const changeTableNameAction = createAction<
 >(ActionType.changeTableName);
 
 const changeTableName: ReducerType<typeof ActionType.changeTableName> = (
-  { collections },
-  { payload: { id, value } },
+  { collections, lww },
+  { payload: { id, value }, timestamp },
   { toWidth }
 ) => {
   const collection = query(collections).collection('tableEntities');
   collection.getOrCreate(id, id => createTable({ id }));
 
-  collection.updateOne(id, table => {
-    table.name = value;
-    table.ui.widthName = toWidth(value);
+  collection.replaceOperator(lww, timestamp, id, 'name', () => {
+    collection.updateOne(id, table => {
+      table.name = value;
+      table.ui.widthName = toWidth(value);
+    });
   });
 };
 
@@ -88,16 +90,18 @@ export const changeTableCommentAction = createAction<
 >(ActionType.changeTableComment);
 
 const changeTableComment: ReducerType<typeof ActionType.changeTableComment> = (
-  { collections },
-  { payload: { id, value } },
+  { collections, lww },
+  { payload: { id, value }, timestamp },
   { toWidth }
 ) => {
   const collection = query(collections).collection('tableEntities');
   collection.getOrCreate(id, id => createTable({ id }));
 
-  collection.updateOne(id, table => {
-    table.comment = value;
-    table.ui.widthComment = toWidth(value);
+  collection.replaceOperator(lww, timestamp, id, 'comment', () => {
+    collection.updateOne(id, table => {
+      table.comment = value;
+      table.ui.widthComment = toWidth(value);
+    });
   });
 };