Feature: Traditional menu actions in desktop application part II (#6030)

* chore: skeleton for building and creating menus. Need electron to renderer interface to dynamically set the menu

* chore: skeleton typing for communication between nodes and web side

* chore: more skeleton for the different roles within the menu options, need more type safety

* chore: adding more skeleton and templates of what the menus could be

* chore: implemented first pass for helpRole links

* fix: syntax issue stopped the build step

* feature: loading different menus based on your page

* feature: Home page file role implemented

* chore: handling the build workflow for the signin page

* fix: moving edit actionst to the edit menu

* chore: adding preferences to the file role

* chore: redoing help roles based on the question mark widget

* fix: auto fmt

* chore: examples of accelerator strings for Menu.MenuItems keyboard shortcuts!

* chore: oddly specific toggle API for disabling MenuItems from JS. No rules!

* fix: do not implement a custom label disable thingy, use id on menu and use the native APIga

* fix: auto fmt

* fix: adding some typechecks and auto fmt fixes

* fix: trying to fix custom type?

* fix: nvm we back, the lsp on my editor borked for a second

* fix: adding one more level to the custom type for the labels

* chore: cleaning up type definitions to read easier

* fix: resolving yarn lint errors

* chore: adding file sign out

* chore: adding more file bar actions

* chore: ready for PR draft

* fix: preemptive GC collectoin bug fix if somehow a user interacts with a menu while it is being GCed

* fix: linking the OG source

* fix: set application menu to null to avoid default electron menu

* chore: trying to add more typescript

* chore: BIG workflow changes... better typing, less IPC junk

* fix: remapping the icp functions to the cb option select...

* chore: all og events are rehooked up with new workflow pattern

* feat: adding more options to the native bar!

* fix: todo

* chore: cleaning up some menus and adding more

* fix: desktop vs browser and lint errors

* fix: typescript did not like sample electorn JS code for the basic templates with isMac conditionals...

* fix: PR clean up

* fix: more PR cleanup

* A snapshot a day keeps the bugs away! 📷🐛

* fix: added the new help menu to the default sign in and modeling page

* fix: disabled two menu actions within sign in page since they will not do anything.

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* fix: mergining main, auto fixes

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* fix: saving off progress found an IPC on/off bug thanks electron!

* fix: fixed ipc renderer off/remove listener bug

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* chore: skeleton layout for the file menu in the modeling page.

* fix: adding types

* A snapshot a day keeps the bugs away! 📷🐛

* fix: more skeleton

* feat: adding file preferences project settings

* feat: adding share current part link to file menu

* fix: report a bug to refresha and report a bug

* fix: new type for webContents send payload that does not brick TS

* fix: removing import file from url since it is not working in the command palette for manual user input

* fix: removing old comment

* chore: adding user default units

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* fix: trying to create a new file but I don't think this the correct workflow...

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* fix: disabling create a file and folder until we get it properly implemented at the commad bar level

* fix: hooking up more commands

* fix: auto fixes

* chore: adding standard views

* chore: adding some E2E tests.

* chore: added E2E tests for each file menu

* fix: auto fixes

* chore: adding more edit role E2E tests

* chore: e2e test

* chore: adding help role e2e test

* A snapshot a day keeps the bugs away! 📷🐛

* chore: e2e test for all the menu options you can interact with in the frontend

* chore: hooking up more menu actions

* chore: adding pane actions

* fix: mac only menu fix and added start sketch

* chore: big edit for state management and command registration

* fix: auto fixes, tsc

* fix: codespell typo

* chore: implementing E2E tests for the menus since we cleared them.

* chore: file export current part e2e test

* chore: added all file role tests in modeling page

* chore: modeling page edit e2e tests

* chore: implemented view e2e test for modeling page

* chore: add all design e2e playright tests

* fix: auto linter,fmt

* chore: added modeling help role e2e tests

* fix: ugh this function isn't available in electron evalulate

* fix: new default project name

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Pierre Jacquier <pierrejacquier39@gmail.com>

e2e/playwright/lib/electron-helpers.ts

@@ -0,0 +1,7 @@
+export const throwError = (message: string): never => {
+  throw new Error(message)
+}
+
+export const throwTronAppMissing = () => {
+  throwError('tronApp is missing')
+}

src/components/FileMachineProvider.tsx

@@ -11,6 +11,8 @@ import type {
 } from 'xstate'
 import { fromPromise } from 'xstate'
 
+import { useAbsoluteFilePath } from '@src/hooks/useAbsoluteFilePath'
+import { useMenuListener } from '@src/hooks/useMenu'
 import { newKclFile } from '@src/lang/project'
 import { createNamedViewsCommand } from '@src/lib/commandBarConfigs/namedViewsConfig'
 import { createRouteCommands } from '@src/lib/commandBarConfigs/routeCommandConfig'
@@ -34,6 +36,7 @@ import { type IndexLoaderData } from '@src/lib/types'
 import { useSettings, useToken } from '@src/machines/appMachine'
 import { commandBarActor } from '@src/machines/commandBarMachine'
 import { fileMachine } from '@src/machines/fileMachine'
+import { modelingMenuCallbackMostActions } from '@src/menu/register'
 
 type MachineContext<T extends AnyStateMachine> = {
   state: StateFrom<T>
@@ -60,6 +63,14 @@ export const FileMachineProvider = ({
     []
   )
 
+  const filePath = useAbsoluteFilePath()
+  // Only create the native file menus on desktop
+  useEffect(() => {
+    if (isDesktop()) {
+      window.electron.createModelingPageMenu().catch(reportRejection)
+    }
+  }, [])
+
   // Only create the native file menus on desktop
   useEffect(() => {
     if (isDesktop()) {
@@ -414,6 +425,15 @@ export const FileMachineProvider = ({
     }
   )
 
+  const cb = modelingMenuCallbackMostActions(
+    settings,
+    navigate,
+    filePath,
+    project,
+    token
+  )
+  useMenuListener(cb)
+
   const kclCommandMemo = useMemo(
     () =>
       kclCommands({

src/components/ModelingMachineProvider.tsx

@@ -19,6 +19,7 @@ import type {
 import type { Node } from '@rust/kcl-lib/bindings/Node'
 import type { Plane } from '@rust/kcl-lib/bindings/Plane'
 
+import { useAppState } from '@src/AppState'
 import { letEngineAnimateAndSyncCamAfter } from '@src/clientSideScene/CameraControls'
 import {
   SEGMENT_BODIES,
@@ -26,6 +27,7 @@ import {
 } from '@src/clientSideScene/sceneConstants'
 import type { MachineManager } from '@src/components/MachineManagerProvider'
 import { MachineManagerContext } from '@src/components/MachineManagerProvider'
+import type { SidebarType } from '@src/components/ModelingSidebar/ModelingPanes'
 import { applyConstraintIntersect } from '@src/components/Toolbar/Intersect'
 import { applyConstraintAbsDistance } from '@src/components/Toolbar/SetAbsDistance'
 import {
@@ -38,8 +40,14 @@ import {
   applyConstraintLength,
 } from '@src/components/Toolbar/setAngleLength'
 import { useFileContext } from '@src/hooks/useFileContext'
+import {
+  useMenuListener,
+  useSketchModeMenuEnableDisable,
+} from '@src/hooks/useMenu'
+import { useNetworkContext } from '@src/hooks/useNetworkContext'
 import { useSetupEngineManager } from '@src/hooks/useSetupEngineManager'
 import useStateMachineCommands from '@src/hooks/useStateMachineCommands'
+import { useKclContext } from '@src/lang/KclProvider'
 import { updateModelingState } from '@src/lang/modelingWorkflows'
 import {
   insertNamedConstant,
@@ -111,6 +119,7 @@ import {
   modelingMachine,
   modelingMachineDefaultContext,
 } from '@src/machines/modelingMachine'
+import type { WebContentSendPayload } from '@src/menu/channels'
 
 export const ModelingMachineContext = createContext(
   {} as {
@@ -1756,6 +1765,142 @@ export const ModelingMachineProvider = ({
     }
   )
 
+  // Register file menu actions based off modeling send
+  const cb = (data: WebContentSendPayload) => {
+    const openPanes = modelingActor.getSnapshot().context.store.openPanes
+    if (data.menuLabel === 'View.Panes.Feature tree') {
+      const featureTree: SidebarType = 'feature-tree'
+      const alwaysAddFeatureTree: SidebarType[] = [
+        ...new Set([...openPanes, featureTree]),
+      ]
+      modelingSend({
+        type: 'Set context',
+        data: {
+          openPanes: alwaysAddFeatureTree,
+        },
+      })
+    } else if (data.menuLabel === 'View.Panes.KCL code') {
+      const code: SidebarType = 'code'
+      const alwaysAddCode: SidebarType[] = [...new Set([...openPanes, code])]
+      modelingSend({
+        type: 'Set context',
+        data: {
+          openPanes: alwaysAddCode,
+        },
+      })
+    } else if (data.menuLabel === 'View.Panes.Project files') {
+      const projectFiles: SidebarType = 'files'
+      const alwaysAddProjectFiles: SidebarType[] = [
+        ...new Set([...openPanes, projectFiles]),
+      ]
+      modelingSend({
+        type: 'Set context',
+        data: {
+          openPanes: alwaysAddProjectFiles,
+        },
+      })
+    } else if (data.menuLabel === 'View.Panes.Variables') {
+      const variables: SidebarType = 'variables'
+      const alwaysAddVariables: SidebarType[] = [
+        ...new Set([...openPanes, variables]),
+      ]
+      modelingSend({
+        type: 'Set context',
+        data: {
+          openPanes: alwaysAddVariables,
+        },
+      })
+    } else if (data.menuLabel === 'View.Panes.Logs') {
+      const logs: SidebarType = 'logs'
+      const alwaysAddLogs: SidebarType[] = [...new Set([...openPanes, logs])]
+      modelingSend({
+        type: 'Set context',
+        data: {
+          openPanes: alwaysAddLogs,
+        },
+      })
+    } else if (data.menuLabel === 'Design.Start sketch') {
+      modelingSend({
+        type: 'Enter sketch',
+        data: { forceNewSketch: true },
+      })
+    }
+  }
+  useMenuListener(cb)
+
+  const { overallState } = useNetworkContext()
+  const { isExecuting } = useKclContext()
+  const { isStreamReady } = useAppState()
+
+  // Assumes all commands are network commands
+  useSketchModeMenuEnableDisable(
+    modelingState.context.currentMode,
+    overallState,
+    isExecuting,
+    isStreamReady,
+    [
+      { menuLabel: 'Edit.Modify with Zoo Text-To-CAD' },
+      { menuLabel: 'View.Standard views' },
+      { menuLabel: 'View.Named views' },
+      { menuLabel: 'Design.Start sketch' },
+      {
+        menuLabel: 'Design.Create an offset plane',
+        commandName: 'Offset plane',
+        groupId: 'modeling',
+      },
+      {
+        menuLabel: 'Design.Create a helix',
+        commandName: 'Helix',
+        groupId: 'modeling',
+      },
+      {
+        menuLabel: 'Design.Create an additive feature.Extrude',
+        commandName: 'Extrude',
+        groupId: 'modeling',
+      },
+      {
+        menuLabel: 'Design.Create an additive feature.Revolve',
+        commandName: 'Revolve',
+        groupId: 'modeling',
+      },
+      {
+        menuLabel: 'Design.Create an additive feature.Sweep',
+        commandName: 'Sweep',
+        groupId: 'modeling',
+      },
+      {
+        menuLabel: 'Design.Create an additive feature.Loft',
+        commandName: 'Loft',
+        groupId: 'modeling',
+      },
+      {
+        menuLabel: 'Design.Apply modification feature.Fillet',
+        commandName: 'Fillet',
+        groupId: 'modeling',
+      },
+      {
+        menuLabel: 'Design.Apply modification feature.Chamfer',
+        commandName: 'Chamfer',
+        groupId: 'modeling',
+      },
+      {
+        menuLabel: 'Design.Apply modification feature.Shell',
+        commandName: 'Shell',
+        groupId: 'modeling',
+      },
+      {
+        menuLabel: 'Design.Create with Zoo Text-To-CAD',
+        commandName: 'Text-to-CAD',
+        groupId: 'modeling',
+      },
+      {
+        menuLabel: 'Design.Modify with Zoo Text-To-CAD',
+        commandName: 'Prompt-to-edit',
+        groupId: 'modeling',
+      },
+    ]
+  )
+
   // Add debug function to window object
   useEffect(() => {
     // @ts-ignore - we're intentionally adding this to window

src/hooks/useMenu.ts

@@ -1,7 +1,10 @@
-import { useEffect } from 'react'
+import { NetworkHealthState } from '@src/hooks/useNetworkStatus'
-
 import { isDesktop } from '@src/lib/isDesktop'
-import type { WebContentSendPayload } from '@src/menu/channels'
+import type { ToolbarModeName } from '@src/lib/toolbar'
+import { reportRejection } from '@src/lib/trap'
+import { useCommandBarState } from '@src/machines/commandBarMachine'
+import type { MenuLabels, WebContentSendPayload } from '@src/menu/channels'
+import { useEffect } from 'react'
 
 export function useMenuListener(
   callback: (data: WebContentSendPayload) => void
@@ -23,3 +26,70 @@ export function useMenuListener(
     }
   }, [])
 }
+
+// Enable disable menu actions specifically based on if you are in the modeling mode of sketching or modeling.
+// This is a similar behavior of the command bar which disables action if you are in sketch mode
+export function useSketchModeMenuEnableDisable(
+  currentMode: ToolbarModeName,
+  overallState: NetworkHealthState,
+  isExecuting: boolean,
+  isStreamReady: boolean,
+  menus: { menuLabel: MenuLabels; commandName?: string; groupId?: string }[]
+) {
+  const commandBarState = useCommandBarState()
+  const commands = commandBarState.context.commands
+
+  useEffect(() => {
+    const onDesktop = isDesktop()
+    if (!onDesktop) {
+      // NO OP for web
+      return
+    }
+
+    // Same exact logic as the command bar
+    const disableAllButtons =
+      (overallState !== NetworkHealthState.Ok &&
+        overallState !== NetworkHealthState.Weak) ||
+      isExecuting ||
+      !isStreamReady
+
+    // Enable or disable each menu based on the state of the application.
+    menus.forEach(({ menuLabel, commandName, groupId }) => {
+      // If someone goes wrong, disable all the buttons! Engine cannot take this request
+      if (disableAllButtons) {
+        window.electron.disableMenu(menuLabel).catch(reportRejection)
+        return
+      }
+
+      if (commandName && groupId) {
+        // If your menu is tied to a command bar action, see if the command exists in the command bar
+        const foundCommand = commands.find((command) => {
+          return command.name === commandName && command.groupId === groupId
+        })
+        if (!foundCommand) {
+          window.electron.disableMenu(menuLabel).catch(reportRejection)
+        } else {
+          if (currentMode === 'sketching') {
+            window.electron.disableMenu(menuLabel).catch(reportRejection)
+          } else if (currentMode === 'modeling') {
+            window.electron.enableMenu(menuLabel).catch(reportRejection)
+          }
+        }
+      } else {
+        // menu is not tied to a command bar, do the sketch mode check
+        if (currentMode === 'sketching') {
+          window.electron.disableMenu(menuLabel).catch(reportRejection)
+        } else if (currentMode === 'modeling') {
+          window.electron.enableMenu(menuLabel).catch(reportRejection)
+        }
+      }
+    })
+
+    return () => {
+      if (!onDesktop) {
+        // NO OP for web
+        return
+      }
+    }
+  }, [currentMode, commands])
+}

src/menu.ts

@@ -1,15 +1,27 @@
+import { modelingDesignRole } from '@src/menu/designRole'
+import { modelingEditRole, projectEditRole } from '@src/menu/editRole'
+import { modelingFileRole, projectFileRole } from '@src/menu/fileRole'
+import { helpRole } from '@src/menu/helpRole'
+import type { ZooMenuItemConstructorOptions } from '@src/menu/roles'
+import { modelingViewRole, projectViewRole } from '@src/menu/viewRole'
 import type { BrowserWindow } from 'electron'
 import { Menu, app } from 'electron'
 import os from 'node:os'
 
-import { projectEditRole } from '@src/menu/editRole'
-import { projectFileRole } from '@src/menu/fileRole'
-import { helpRole } from '@src/menu/helpRole'
-import type { ZooMenuItemConstructorOptions } from '@src/menu/roles'
-import { projectViewRole } from '@src/menu/viewRole'
-
 const isMac = os.platform() === 'darwin'
 
+/**
+ * Gotcha
+ * If you call Menu.setApplicationMenu([<file>,<edit>,<view>,<help>]) on Mac, it will turn <file> into <ApplicationName>
+ * you need to create a new menu in the 0th index for the <ApplicationName> aka
+ * Menu.setApplicationMenu([<ApplicationName>,<file>,<edit>,<view>,<help>])
+ * If you do not do this, <file> will not show up as file. It will be the <ApplicationName> and it contents live under that Menu
+ * The .setApplicationMenu does not tell you that the 0th index forces it to <ApplicationName> on Mac.
+ */
+function zooSetApplicationMenu(menu: Electron.Menu) {
+  Menu.setApplicationMenu(menu)
+}
+
 // Default electron menu.
 export function buildAndSetMenuForFallback(mainWindow: BrowserWindow) {
   const templateMac: ZooMenuItemConstructorOptions[] = [
@@ -121,22 +133,60 @@ export function buildAndSetMenuForFallback(mainWindow: BrowserWindow) {
 
   if (isMac) {
     const menu = Menu.buildFromTemplate(templateMac)
-    Menu.setApplicationMenu(menu)
+    zooSetApplicationMenu(menu)
   } else {
     const menu = Menu.buildFromTemplate(templateNotMac)
-    Menu.setApplicationMenu(menu)
+    zooSetApplicationMenu(menu)
   }
 }
+
+function appMenuMacOnly() {
+  let extraBits: ZooMenuItemConstructorOptions[] = []
+  if (isMac) {
+    extraBits = [
+      {
+        // @ts-ignore This is required for Mac's it will show the app name first. This is safe to ts-ignore, it is a string.
+        label: app.name,
+        submenu: [
+          { role: 'about' },
+          { type: 'separator' },
+          { role: 'services' },
+          { type: 'separator' },
+          { role: 'hide' },
+          { role: 'hideOthers' },
+          { role: 'unhide' },
+          { type: 'separator' },
+          { role: 'quit' },
+        ],
+      },
+    ]
+  }
+  return extraBits
+}
+
 // This will generate a new menu from the initial state
 // All state management from the previous menu is going to be lost.
 export function buildAndSetMenuForModelingPage(mainWindow: BrowserWindow) {
-  return buildAndSetMenuForFallback(mainWindow)
+  const template = [
+    // Expand empty elements for environments that are not Mac
+    ...appMenuMacOnly(),
+    modelingFileRole(mainWindow),
+    modelingEditRole(mainWindow),
+    modelingViewRole(mainWindow),
+    modelingDesignRole(mainWindow),
+    // Help role is the same for all pages
+    helpRole(mainWindow),
+  ]
+  const menu = Menu.buildFromTemplate(template)
+  zooSetApplicationMenu(menu)
 }
 
 // This will generate a new menu from the initial state
 // All state management from the previous menu is going to be lost.
 export function buildAndSetMenuForProjectPage(mainWindow: BrowserWindow) {
   const template = [
+    // Expand empty elements for environments that are not Mac
+    ...appMenuMacOnly(),
     projectFileRole(mainWindow),
     projectEditRole(mainWindow),
     projectViewRole(mainWindow),
@@ -144,7 +194,7 @@ export function buildAndSetMenuForProjectPage(mainWindow: BrowserWindow) {
     helpRole(mainWindow),
   ]
   const menu = Menu.buildFromTemplate(template)
-  Menu.setApplicationMenu(menu)
+  zooSetApplicationMenu(menu)
 }
 
 // Try to enable the menu based on the application menu

src/menu/channels.ts

@@ -7,6 +7,12 @@ export type MenuLabels =
   | 'Help.Command Palette...'
   | 'Help.Refresh and report a bug'
   | 'Help.Reset onboarding'
+  | 'Edit.Rename project'
+  | 'Edit.Delete project'
+  | 'Edit.Change project directory'
+  | 'Edit.Modify with Zoo Text-To-CAD'
+  | 'Edit.Edit parameter'
+  | 'Edit.Format code'
   | 'File.New project'
   | 'File.Open project'
   | 'File.Import file from URL'
@@ -16,10 +22,50 @@ export type MenuLabels =
   | 'File.Preferences.Theme'
   | 'File.Preferences.Theme color'
   | 'File.Sign out'
-  | 'Edit.Rename project'
+  | 'File.Create new file'
-  | 'Edit.Delete project'
+  | 'File.Create new folder'
-  | 'Edit.Change project directory'
+  | 'File.Load a sample model'
+  | 'File.Export current part'
+  | 'File.Share current part (via Zoo link)'
+  | 'File.Preferences.Project settings'
+  | 'Design.Start sketch'
+  | 'Design.Create an offset plane'
+  | 'Design.Create a helix'
+  | 'Design.Create a parameter'
+  | 'Design.Create an additive feature.Extrude'
+  | 'Design.Create an additive feature.Revolve'
+  | 'Design.Create an additive feature.Sweep'
+  | 'Design.Create an additive feature.Loft'
+  | 'Design.Apply modification feature.Fillet'
+  | 'Design.Apply modification feature.Chamfer'
+  | 'Design.Apply modification feature.Shell'
+  | 'Design.Create with Zoo Text-To-CAD'
+  | 'Design.Modify with Zoo Text-To-CAD'
   | 'View.Command Palette...'
+  | 'View.Orthographic view'
+  | 'View.Perspective view'
+  | 'View.Standard views.Right view'
+  | 'View.Standard views.Back view'
+  | 'View.Standard views.Top view'
+  | 'View.Standard views.Left view'
+  | 'View.Standard views.Front view'
+  | 'View.Standard views.Bottom view'
+  | 'View.Standard views.Reset view'
+  | 'View.Standard views.Center view on selection'
+  | 'View.Standard views.Refresh'
+  | 'View.Named views.Create named view'
+  | 'View.Named views.Load named view'
+  | 'View.Named views.Delete named view'
+  | 'View.Panes.Feature tree'
+  | 'View.Panes.KCL code'
+  | 'View.Panes.Project files'
+  | 'View.Panes.Variables'
+  | 'View.Panes.Logs'
+  | 'View.Panes.Debug'
+  | 'View.Standard views'
+  | 'View.Named views'
+  | 'Design.Create an additive feature'
+  | 'Design.Apply modification feature'
 
 export type WebContentSendPayload = {
   menuLabel: MenuLabels

src/menu/designRole.ts

@@ -0,0 +1,145 @@
+import { typeSafeWebContentsSend } from '@src/menu/channels'
+import type { ZooMenuItemConstructorOptions } from '@src/menu/roles'
+import type { BrowserWindow } from 'electron'
+
+export const modelingDesignRole = (
+  mainWindow: BrowserWindow
+): ZooMenuItemConstructorOptions => {
+  return {
+    label: 'Design',
+    submenu: [
+      {
+        label: 'Start sketch',
+        id: 'Design.Start sketch',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Design.Start sketch',
+          })
+        },
+      },
+      { type: 'separator' },
+      {
+        label: 'Create an offset plane',
+        id: 'Design.Create an offset plane',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Design.Create an offset plane',
+          })
+        },
+      },
+      {
+        label: 'Create a helix',
+        id: 'Design.Create a helix',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Design.Create a helix',
+          })
+        },
+      },
+      {
+        label: 'Create a parameter',
+        id: 'Design.Create a parameter',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Design.Create a parameter',
+          })
+        },
+      },
+      { type: 'separator' },
+      {
+        label: 'Create an additive feature',
+        id: 'Design.Create an additive feature',
+        submenu: [
+          {
+            label: 'Extrude',
+            id: 'Design.Create an additive feature.Extrude',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'Design.Create an additive feature.Extrude',
+              })
+            },
+          },
+          {
+            label: 'Revolve',
+            id: 'Design.Create an additive feature.Revolve',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'Design.Create an additive feature.Revolve',
+              })
+            },
+          },
+          {
+            label: 'Sweep',
+            id: 'Design.Create an additive feature.Sweep',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'Design.Create an additive feature.Sweep',
+              })
+            },
+          },
+          {
+            label: 'Loft',
+            id: 'Design.Create an additive feature.Loft',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'Design.Create an additive feature.Loft',
+              })
+            },
+          },
+        ],
+      },
+      {
+        label: 'Apply modification feature',
+        id: 'Design.Apply modification feature',
+        submenu: [
+          {
+            label: 'Fillet',
+            id: 'Design.Apply modification feature.Fillet',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'Design.Apply modification feature.Fillet',
+              })
+            },
+          },
+          {
+            label: 'Chamfer',
+            id: 'Design.Apply modification feature.Chamfer',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'Design.Apply modification feature.Chamfer',
+              })
+            },
+          },
+          {
+            label: 'Shell',
+            id: 'Design.Apply modification feature.Shell',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'Design.Apply modification feature.Shell',
+              })
+            },
+          },
+        ],
+      },
+      { type: 'separator' },
+      {
+        label: 'Create with Zoo Text-To-CAD',
+        id: 'Design.Create with Zoo Text-To-CAD',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Design.Create with Zoo Text-To-CAD',
+          })
+        },
+      },
+      {
+        label: 'Modify with Zoo Text-To-CAD',
+        id: 'Design.Modify with Zoo Text-To-CAD',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Design.Modify with Zoo Text-To-CAD',
+          })
+        },
+      },
+    ],
+  }
+}

src/menu/editRole.ts

@@ -68,3 +68,94 @@ export const projectEditRole = (
     ],
   }
 }
+
+export const modelingEditRole = (
+  mainWindow: BrowserWindow
+): ZooMenuItemConstructorOptions => {
+  let extraBits: ZooMenuItemConstructorOptions[] = [
+    { role: 'delete' },
+    { type: 'separator' },
+    { role: 'selectAll' },
+  ]
+  if (isMac) {
+    extraBits = [
+      { role: 'pasteAndMatchStyle' },
+      { role: 'delete' },
+      { role: 'selectAll' },
+      { type: 'separator' },
+      {
+        label: 'Speech',
+        submenu: [{ role: 'startSpeaking' }, { role: 'stopSpeaking' }],
+      },
+    ]
+  }
+  return {
+    label: 'Edit',
+    submenu: [
+      {
+        label: 'Modify with Zoo Text-To-CAD',
+        id: 'Edit.Modify with Zoo Text-To-CAD',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Edit.Modify with Zoo Text-To-CAD',
+          })
+        },
+      },
+      {
+        label: 'Edit parameter',
+        id: 'Edit.Edit parameter',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Edit.Edit parameter',
+          })
+        },
+      },
+      {
+        label: 'Format code',
+        id: 'Edit.Format code',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Edit.Format code',
+          })
+        },
+      },
+      { type: 'separator' },
+      {
+        label: 'Rename project',
+        id: 'Edit.Rename project',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Edit.Rename project',
+          })
+        },
+      },
+      {
+        label: 'Delete project',
+        id: 'Edit.Delete project',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Edit.Delete project',
+          })
+        },
+      },
+      { type: 'separator' },
+      {
+        label: 'Change project directory',
+        id: 'Edit.Change project directory',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'Edit.Change project directory',
+          })
+        },
+      },
+      { type: 'separator' },
+      { role: 'undo' },
+      { role: 'redo' },
+      { type: 'separator' },
+      { role: 'cut' },
+      { role: 'copy' },
+      { role: 'paste' },
+      ...extraBits,
+    ],
+  }
+}

src/menu/fileRole.ts

@@ -100,3 +100,153 @@ export const projectFileRole = (
     ],
   }
 }
+
+export const modelingFileRole = (
+  mainWindow: BrowserWindow
+): ZooMenuItemConstructorOptions => {
+  return {
+    label: 'File',
+    submenu: [
+      // TODO: Once a safe command bar create new file and folder is implemented we can turn these on
+      // {
+      //   label: 'Create new file',
+      //   click: () => {
+      //     typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+      //       menuLabel: 'File.Create new file',
+      //     })
+      //   },
+      // },
+      // {
+      //   label: 'Create new folder',
+      //   click: () => {
+      //     typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+      //       menuLabel: 'File.Create new folder',
+      //     })
+      //   },
+      // },
+      {
+        label: 'New project',
+        id: 'File.New project',
+        accelerator: 'CommandOrControl+N',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'File.New project',
+          })
+        },
+      },
+      {
+        label: 'Open project',
+        id: 'File.Open project',
+        accelerator: 'CommandOrControl+P',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'File.Open project',
+          })
+        },
+      },
+      // TODO https://www.electronjs.org/docs/latest/tutorial/recent-documents
+      // Appears to be only Windows and Mac OS specific. Linux does not have support
+      { type: 'separator' },
+      {
+        label: 'Load a sample model',
+        id: 'File.Load a sample model',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'File.Load a sample model',
+          })
+        },
+      },
+      { type: 'separator' },
+      {
+        label: 'Export current part',
+        id: 'File.Export current part',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'File.Export current part',
+          })
+        },
+      },
+      {
+        label: 'Share current part (via Zoo link)',
+        id: 'File.Share current part (via Zoo link)',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'File.Share current part (via Zoo link)',
+          })
+        },
+      },
+      { type: 'separator' },
+      {
+        label: 'Preferences',
+        submenu: [
+          {
+            label: 'Project settings',
+            id: 'File.Preferences.Project settings',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'File.Preferences.Project settings',
+              })
+            },
+          },
+          {
+            label: 'User settings',
+            id: 'File.Preferences.User settings',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'File.Preferences.User settings',
+              })
+            },
+          },
+          {
+            label: 'Keybindings',
+            id: 'File.Preferences.Keybindings',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'File.Preferences.Keybindings',
+              })
+            },
+          },
+          {
+            label: 'User default units',
+            id: 'File.Preferences.User default units',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'File.Preferences.User default units',
+              })
+            },
+          },
+          {
+            label: 'Theme',
+            id: 'File.Preferences.Theme',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'File.Preferences.Theme',
+              })
+            },
+          },
+          {
+            label: 'Theme color',
+            id: 'File.Preferences.Theme color',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'File.Preferences.Theme color',
+              })
+            },
+          },
+        ],
+      },
+      { type: 'separator' },
+      // Last in list
+      {
+        label: 'Sign out',
+        id: 'File.Sign out',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'File.Sign out',
+          })
+        },
+      },
+      isMac ? { role: 'close' } : { role: 'quit' },
+    ],
+  }
+}

src/menu/register.ts

@@ -0,0 +1,264 @@
+import { AxisNames } from '@src/lib/constants'
+import { copyFileShareLink } from '@src/lib/links'
+import { PATHS } from '@src/lib/paths'
+import type { Project } from '@src/lib/project'
+import type { SettingsType } from '@src/lib/settings/initialSettings'
+import {
+  codeManager,
+  engineCommandManager,
+  sceneInfra,
+} from '@src/lib/singletons'
+import { reportRejection } from '@src/lib/trap'
+import { uuidv4 } from '@src/lib/utils'
+import { authActor, settingsActor } from '@src/machines/appMachine'
+import { commandBarActor } from '@src/machines/commandBarMachine'
+import type { WebContentSendPayload } from '@src/menu/channels'
+import type { NavigateFunction } from 'react-router-dom'
+
+export function modelingMenuCallbackMostActions(
+  settings: SettingsType,
+  navigate: NavigateFunction,
+  filePath: string,
+  project: Project | undefined,
+  token: string | undefined
+) {
+  // Menu listeners
+  const cb = (data: WebContentSendPayload) => {
+    if (data.menuLabel === 'File.New project') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: {
+          groupId: 'projects',
+          name: 'Create project',
+          argDefaultValues: {
+            name: settings.projects.defaultProjectName.current,
+          },
+        },
+      })
+    } else if (data.menuLabel === 'File.Open project') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: {
+          groupId: 'projects',
+          name: 'Open project',
+        },
+      })
+    } else if (data.menuLabel === 'Edit.Rename project') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: {
+          groupId: 'projects',
+          name: 'Rename project',
+        },
+      })
+    } else if (data.menuLabel === 'Edit.Delete project') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: {
+          groupId: 'projects',
+          name: 'Delete project',
+        },
+      })
+    } else if (data.menuLabel === 'File.Preferences.User settings') {
+      navigate(filePath + PATHS.SETTINGS_USER)
+    } else if (data.menuLabel === 'File.Preferences.Keybindings') {
+      navigate(filePath + PATHS.SETTINGS_KEYBINDINGS)
+    } else if (data.menuLabel === 'Edit.Change project directory') {
+      navigate(filePath + PATHS.SETTINGS_USER + '#projectDirectory')
+    } else if (data.menuLabel === 'File.Preferences.Project settings') {
+      navigate(filePath + PATHS.SETTINGS_PROJECT)
+    } else if (data.menuLabel === 'File.Sign out') {
+      authActor.send({ type: 'Log out' })
+    } else if (
+      data.menuLabel === 'View.Command Palette...' ||
+      data.menuLabel === 'Help.Command Palette...'
+    ) {
+      commandBarActor.send({ type: 'Open' })
+    } else if (data.menuLabel === 'File.Preferences.Theme') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: {
+          groupId: 'settings',
+          name: 'app.theme',
+        },
+      })
+    } else if (data.menuLabel === 'File.Preferences.Theme color') {
+      navigate(filePath + PATHS.SETTINGS_USER + '#themeColor')
+    } else if (data.menuLabel === 'File.Share current part (via Zoo link)') {
+      copyFileShareLink({
+        token: token ?? '',
+        code: codeManager.code,
+        name: project?.name || '',
+      }).catch(reportRejection)
+    } else if (data.menuLabel === 'File.Preferences.User default units') {
+      navigate(filePath + PATHS.SETTINGS_USER + '#defaultUnit')
+    } else if (data.menuLabel === 'File.Export current part') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: {
+          groupId: 'modeling',
+          name: 'Export',
+        },
+      })
+    } else if (data.menuLabel === 'File.Load a sample model') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: {
+          groupId: 'code',
+          name: 'open-kcl-example',
+        },
+      })
+    } else if (data.menuLabel === 'File.Create new file') {
+      // NO OP. A safe command bar create new file is not implemented yet.
+    } else if (data.menuLabel === 'Edit.Modify with Zoo Text-To-CAD') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Prompt-to-edit', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Edit.Edit parameter') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'event.parameter.edit', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Edit.Format code') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'format-code', groupId: 'code' },
+      })
+    } else if (data.menuLabel === 'View.Orthographic view') {
+      settingsActor.send({
+        type: 'set.modeling.cameraProjection',
+        data: {
+          level: 'user',
+          value: 'orthographic',
+        },
+      })
+    } else if (data.menuLabel === 'View.Perspective view') {
+      settingsActor.send({
+        type: 'set.modeling.cameraProjection',
+        data: {
+          level: 'user',
+          value: 'perspective',
+        },
+      })
+    } else if (data.menuLabel === 'View.Standard views.Right view') {
+      sceneInfra.camControls
+        .updateCameraToAxis(AxisNames.X)
+        .catch(reportRejection)
+    } else if (data.menuLabel === 'View.Standard views.Back view') {
+      sceneInfra.camControls
+        .updateCameraToAxis(AxisNames.Y)
+        .catch(reportRejection)
+    } else if (data.menuLabel === 'View.Standard views.Top view') {
+      sceneInfra.camControls
+        .updateCameraToAxis(AxisNames.Z)
+        .catch(reportRejection)
+    } else if (data.menuLabel === 'View.Standard views.Left view') {
+      sceneInfra.camControls
+        .updateCameraToAxis(AxisNames.NEG_X)
+        .catch(reportRejection)
+    } else if (data.menuLabel === 'View.Standard views.Front view') {
+      sceneInfra.camControls
+        .updateCameraToAxis(AxisNames.NEG_Y)
+        .catch(reportRejection)
+    } else if (data.menuLabel === 'View.Standard views.Bottom view') {
+      sceneInfra.camControls
+        .updateCameraToAxis(AxisNames.NEG_Z)
+        .catch(reportRejection)
+    } else if (data.menuLabel === 'View.Standard views.Reset view') {
+      sceneInfra.camControls.resetCameraPosition().catch(reportRejection)
+    } else if (
+      data.menuLabel === 'View.Standard views.Center view on selection'
+    ) {
+      // Gotcha: out of band from modelingMachineProvider, has no state or extra workflows. I am taking the function's logic and porting it here.
+      engineCommandManager
+        .sendSceneCommand({
+          type: 'modeling_cmd_req',
+          cmd_id: uuidv4(),
+          cmd: {
+            type: 'default_camera_center_to_selection',
+            camera_movement: 'vantage',
+          },
+        })
+        .catch(reportRejection)
+    } else if (data.menuLabel === 'View.Standard views.Refresh') {
+      globalThis?.window?.location.reload()
+    } else if (data.menuLabel === 'View.Named views.Create named view') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Create named view', groupId: 'namedViews' },
+      })
+    } else if (data.menuLabel === 'View.Named views.Load named view') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Load named view', groupId: 'namedViews' },
+      })
+    } else if (data.menuLabel === 'View.Named views.Delete named view') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Delete named view', groupId: 'namedViews' },
+      })
+    } else if (data.menuLabel === 'Design.Create an offset plane') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Offset plane', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Design.Create a helix') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Helix', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Design.Create a parameter') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'event.parameter.create', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Design.Create an additive feature.Extrude') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Extrude', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Design.Create an additive feature.Revolve') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Revolve', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Design.Create an additive feature.Sweep') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Sweep', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Design.Create an additive feature.Loft') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Loft', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Design.Apply modification feature.Fillet') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Fillet', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Design.Apply modification feature.Chamfer') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Chamfer', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Design.Apply modification feature.Shell') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Shell', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Design.Create with Zoo Text-To-CAD') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Text-to-CAD', groupId: 'modeling' },
+      })
+    } else if (data.menuLabel === 'Design.Modify with Zoo Text-To-CAD') {
+      commandBarActor.send({
+        type: 'Find and select command',
+        data: { name: 'Prompt-to-edit', groupId: 'modeling' },
+      })
+    }
+  }
+  return cb
+}

src/menu/roles.ts

@@ -21,6 +21,12 @@ type FileRoleLabel =
   | 'Sign out'
   | 'Theme'
   | 'Theme color'
+  | 'Export current part'
+  | 'Create new file'
+  | 'Create new folder'
+  | 'Share current part (via Zoo link)'
+  | 'Project settings'
+  | 'Load a sample model'
   | 'User default units'
 
 type EditRoleLabel =
@@ -28,6 +34,9 @@ type EditRoleLabel =
   | 'Delete project'
   | 'Change project directory'
   | 'Speech'
+  | 'Edit parameter'
+  | 'Modify with Zoo Text-To-CAD'
+  | 'Format code'
 
 type HelpRoleLabel =
   | 'Refresh and report a bug'
@@ -42,7 +51,49 @@ type HelpRoleLabel =
   | 'Get started with Text-to-CAD'
   | 'Show all commands'
 
-type ViewRoleLabel = 'Command Palette...' | 'Appearance'
+type ViewRoleLabel =
+  | 'Command Palette...'
+  | 'Appearance'
+  | 'Panes'
+  | 'Feature tree'
+  | 'KCL code'
+  | 'Project files'
+  | 'Variables'
+  | 'Logs'
+  | 'Debug'
+  | 'Standard views'
+  | 'Orthographic view'
+  | 'Perspective view'
+  | 'Right view'
+  | 'Back view'
+  | 'Top view'
+  | 'Left view'
+  | 'Front view'
+  | 'Bottom view'
+  | 'Reset view'
+  | 'Center view on selection'
+  | 'Refresh'
+  | 'Named views'
+  | 'Create named view'
+  | 'Load named view'
+  | 'Delete named view'
+
+type DesignRoleLabel =
+  | 'Design'
+  | 'Create a parameter'
+  | 'Create with Zoo Text-To-CAD'
+  | 'Start sketch'
+  | 'Create an offset plane'
+  | 'Create a helix'
+  | 'Create an additive feature'
+  | 'Extrude'
+  | 'Revolve'
+  | 'Sweep'
+  | 'Loft'
+  | 'Apply modification feature'
+  | 'Fillet'
+  | 'Chamfer'
+  | 'Shell'
 
 // Only export the union of all the internal types since they are all labels
 // The internal types are only for readability within the file
@@ -52,6 +103,7 @@ export type ZooLabel =
   | EditRoleLabel
   | HelpRoleLabel
   | ViewRoleLabel
+  | DesignRoleLabel
 
 // Extend the interface with additional custom properties
 export interface ZooMenuItemConstructorOptions

src/menu/viewRole.ts

@@ -47,3 +47,244 @@ export const projectViewRole = (
     ],
   }
 }
+
+export const modelingViewRole = (
+  mainWindow: BrowserWindow
+): ZooMenuItemConstructorOptions => {
+  let extraBits: ZooMenuItemConstructorOptions[] = [{ role: 'close' }]
+  if (isMac) {
+    extraBits = [
+      { type: 'separator' },
+      { role: 'front' },
+      { type: 'separator' },
+      { role: 'window' },
+    ]
+  }
+  return {
+    label: 'View',
+    submenu: [
+      {
+        label: 'Command Palette...',
+        id: 'View.Command Palette...',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'View.Command Palette...',
+          })
+        },
+      },
+      { type: 'separator' },
+      {
+        label: 'Orthographic view',
+        id: 'View.Orthographic view',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'View.Orthographic view',
+          })
+        },
+      },
+      {
+        label: 'Perspective view',
+        id: 'View.Perspective view',
+        click: () => {
+          typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+            menuLabel: 'View.Perspective view',
+          })
+        },
+      },
+      { type: 'separator' },
+      {
+        label: 'Standard views',
+        id: 'View.Standard views',
+        submenu: [
+          {
+            label: 'Right view',
+            id: 'View.Standard views.Right view',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Standard views.Right view',
+              })
+            },
+          },
+          {
+            label: 'Back view',
+            id: 'View.Standard views.Back view',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Standard views.Back view',
+              })
+            },
+          },
+
+          {
+            label: 'Top view',
+            id: 'View.Standard views.Top view',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Standard views.Top view',
+              })
+            },
+          },
+
+          {
+            label: 'Left view',
+            id: 'View.Standard views.Left view',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Standard views.Left view',
+              })
+            },
+          },
+
+          {
+            label: 'Front view',
+            id: 'View.Standard views.Front view',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Standard views.Front view',
+              })
+            },
+          },
+
+          {
+            label: 'Bottom view',
+            id: 'View.Standard views.Bottom view',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Standard views.Bottom view',
+              })
+            },
+          },
+          { type: 'separator' },
+          {
+            label: 'Reset view',
+            id: 'View.Standard views.Reset view',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Standard views.Reset view',
+              })
+            },
+          },
+
+          {
+            label: 'Center view on selection',
+            id: 'View.Standard views.Center view on selection',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Standard views.Center view on selection',
+              })
+            },
+          },
+          {
+            label: 'Refresh',
+            id: 'View.Standard views.Refresh',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Standard views.Refresh',
+              })
+            },
+          },
+        ],
+      },
+      {
+        label: 'Named views',
+        id: 'View.Named views',
+        submenu: [
+          {
+            label: 'Create named view',
+            id: 'View.Named views.Create named view',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Named views.Create named view',
+              })
+            },
+          },
+
+          {
+            label: 'Load named view',
+            id: 'View.Named views.Load named view',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Named views.Load named view',
+              })
+            },
+          },
+
+          {
+            label: 'Delete named view',
+            id: 'View.Named views.Delete named view',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Named views.Delete named view',
+              })
+            },
+          },
+        ],
+      },
+      { type: 'separator' },
+      {
+        label: 'Panes',
+        submenu: [
+          {
+            label: 'Feature tree',
+            id: 'View.Panes.Feature tree',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Panes.Feature tree',
+              })
+            },
+          },
+          {
+            label: 'KCL code',
+            id: 'View.Panes.KCL code',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Panes.KCL code',
+              })
+            },
+          },
+          {
+            label: 'Project files',
+            id: 'View.Panes.Project files',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Panes.Project files',
+              })
+            },
+          },
+          {
+            label: 'Variables',
+            id: 'View.Panes.Variables',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Panes.Variables',
+              })
+            },
+          },
+          {
+            label: 'Logs',
+            id: 'View.Panes.Logs',
+            click: () => {
+              typeSafeWebContentsSend(mainWindow, 'menu-action-clicked', {
+                menuLabel: 'View.Panes.Logs',
+              })
+            },
+          },
+        ],
+      },
+      {
+        label: 'Appearance',
+        submenu: [
+          { role: 'togglefullscreen' },
+          { type: 'separator' },
+          { role: 'zoomIn' },
+          { role: 'zoomOut' },
+          { role: 'resetZoom' },
+        ],
+      },
+      { type: 'separator' },
+      { role: 'minimize' },
+      { role: 'zoom' },
+      ...extraBits,
+    ],
+  }
+}