update router query with selected node

Author: softmarshmallow

editor-packages/editor-canvas/canvas/canvas.tsx

@@ -16,7 +16,7 @@ import type { XY, XYWH } from "../types";
 
 const designq = utils.query;
 
-const INITIAL_SCALE = 1;
+const INITIAL_SCALE = 0.5;
 const INITIAL_XY: XY = [0, 0];
 const LAYER_HOVER_HIT_MARGIN = 3.5;
 const MIN_ZOOM = 0.02;

editor/core/reducers/editor-reducer.ts

@@ -1,22 +1,39 @@
 import produce from "immer";
 import { Action, SelectNodeAction, SelectPageAction } from "core/actions";
 import { EditorState } from "core/states";
+import { useRouter } from "next/router";
 
 export function editorReducer(state: EditorState, action: Action): EditorState {
+  const router = useRouter();
+
   // TODO: handle actions here.
   switch (action.type) {
     case "select-node": {
       const { node } = <SelectNodeAction>action;
       console.clear();
       console.info("cleard console by editorReducer#select-node");
+
+      // update router
+      router.query.node = node ?? state.selectedPage;
+      router.push(router);
+
       return produce(state, (draft) => {
         draft.selectedNodes = [node].filter(Boolean);
       });
     }
     case "select-page": {
       const { page } = <SelectPageAction>action;
+
+      console.clear();
+      console.info("cleard console by editorReducer#select-page");
+
+      // update router
+      router.query.node = page;
+      router.push(router);
+
       return produce(state, (draft) => {
         draft.selectedPage = page;
+        draft.selectedNodes = [];
       });
     }
     default: