extract menu additions to functions, remove ifs (#153)

* extract to function, remove ifs * swap CopyAsPng | CopyAsSvg shortcuts * 1.10.14
RoamJS · Sep 11, 2023 · f5ec606 · f5ec606
1 parent 33b1b51
commit f5ec606
Show file tree

Hide file tree

Showing 3 changed files with 56 additions and 60 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "query-builder",
-  "version": "1.10.13",
+  "version": "1.10.14",
   "description": "Introduces new user interfaces for building queries in Roam",
   "main": "./build/main.js",
   "author": {

diff --git a/src/components/TldrawCanvas.tsx b/src/components/TldrawCanvas.tsx
@@ -1340,6 +1340,57 @@ const TldrawCanvas = ({ title }: Props) => {
       );
     };
   }, [appRef, allNodes]);
+
+  // Menu Overrides
+  const addFullScreenToggle = (mainMenu: MenuGroup) => {
+    const viewSubMenu = mainMenu.children.find(
+      (m): m is SubMenu => m.type === "submenu" && m.id === "view"
+    );
+    const viewActionsGroup = viewSubMenu?.children.find(
+      (m): m is MenuGroup => m.type === "group" && m.id === "view-actions"
+    );
+    if (!viewActionsGroup) return;
+    viewActionsGroup.children.push({
+      type: "item",
+      readonlyOk: true,
+      id: "toggle-full-screen",
+      disabled: false,
+      checked: maximized,
+      actionItem: {
+        id: "toggle-full-screen",
+        label: "action.toggle-full-screen" as TLTranslationKey,
+        kbd: "!3",
+        onSelect: () => {
+          setMaximized(!maximized);
+        },
+        readonlyOk: true,
+      },
+    });
+  };
+  const editCopyAsShortcuts = (mainMenu: MenuGroup) => {
+    const editSubMenu = mainMenu.children.find(
+      (m): m is SubMenu => m.type === "submenu" && m.id === "edit"
+    );
+    const conversionsGroup = editSubMenu?.children.find(
+      (m): m is MenuGroup => m.type === "group" && m.id === "conversions"
+    );
+    const copyAsSubMenu = conversionsGroup?.children.find(
+      (m): m is SubMenu => m.type === "submenu" && m.id === "copy-as"
+    );
+    const copyAsGroup = copyAsSubMenu?.children.find(
+      (m): m is MenuGroup => m.type === "group" && m.id === "copy-as-group"
+    );
+    const copyAsPngItem = copyAsGroup?.children.find(
+      (m): m is MenuItem => m.type === "item" && m.id === "copy-as-png"
+    );
+    const copyAsSvgItem = copyAsGroup?.children.find(
+      (m): m is MenuItem => m.type === "item" && m.id === "copy-as-svg"
+    );
+    if (!copyAsPngItem || !copyAsSvgItem) return;
+    copyAsPngItem.actionItem.kbd = "$!C";
+    copyAsSvgItem.actionItem.kbd = "$!X";
+  };
+
   return (
     <div
       className={`border border-gray-300 rounded-md bg-white h-full w-full z-10 overflow-hidden ${
@@ -1574,63 +1625,8 @@ const TldrawCanvas = ({ title }: Props) => {
                 (m): m is MenuGroup => m.type === "group" && m.id === "menu"
               );
               if (mainMenu) {
-                const viewSubMenu = mainMenu.children.find(
-                  (m): m is SubMenu => m.type === "submenu" && m.id === "view"
-                );
-                if (viewSubMenu) {
-                  const viewActionsGroup = viewSubMenu.children.find(
-                    (m): m is MenuGroup =>
-                      m.type === "group" && m.id === "view-actions"
-                  );
-                  if (viewActionsGroup) {
-                    viewActionsGroup.children.push({
-                      type: "item",
-                      readonlyOk: true,
-                      id: "toggle-full-screen",
-                      disabled: false,
-                      checked: maximized,
-                      actionItem: {
-                        id: "toggle-full-screen",
-                        label: "action.toggle-full-screen" as TLTranslationKey,
-                        kbd: "!3",
-                        onSelect: () => {
-                          setMaximized(!maximized);
-                        },
-                        readonlyOk: true,
-                      },
-                    });
-                  }
-                }
-                const editSubMenu = mainMenu.children.find(
-                  (m): m is SubMenu => m.type === "submenu" && m.id === "edit"
-                );
-                if (editSubMenu) {
-                  const conversionsGroup = editSubMenu.children.find(
-                    (m): m is MenuGroup =>
-                      m.type === "group" && m.id === "conversions"
-                  );
-                  if (conversionsGroup) {
-                    const copyAsSubMenu = conversionsGroup.children.find(
-                      (m): m is MenuGroup =>
-                        m.type === "submenu" && m.id === "copy-as"
-                    );
-                    if (copyAsSubMenu) {
-                      const copyAsGroup = copyAsSubMenu.children.find(
-                        (m): m is MenuGroup =>
-                          m.type === "group" && m.id === "copy-as-group"
-                      );
-                      if (copyAsGroup) {
-                        const copyAsPngItem = copyAsGroup.children.find(
-                          (m): m is MenuItem =>
-                            m.type === "item" && m.id === "copy-as-png"
-                        );
-                        if (copyAsPngItem) {
-                          copyAsPngItem.actionItem.kbd = "$!X";
-                        }
-                      }
-                    }
-                  }
-                }
+                addFullScreenToggle(mainMenu);
+                editCopyAsShortcuts(mainMenu);
               }
               return menu;
             },