diff --git a/apps/client/src/common/hooks/useElectronEvent.ts b/apps/client/src/common/hooks/useElectronEvent.ts index 4d25bf08f..f76d4b782 100644 --- a/apps/client/src/common/hooks/useElectronEvent.ts +++ b/apps/client/src/common/hooks/useElectronEvent.ts @@ -1,11 +1,31 @@ -export default function useElectronEvent() { - const isElectron = window?.process?.type === 'renderer'; +import { useCallback, useEffect } from 'react'; +import { useNavigate } from 'react-router-dom'; - const sendToElectron = (channel: string, args?: string | Record) => { - if (isElectron) { - window?.ipcRenderer.send(channel, args); +const isElectron = window.process?.type === 'renderer'; +const ipcRenderer = isElectron ? window.require('electron').ipcRenderer : null; + +export default function useElectronEvent() { + const navigate = useNavigate(); + + const sendToElectron = useCallback((channel: string, args?: string | Record) => { + if (isElectron && ipcRenderer) { + ipcRenderer.send(channel, args); } - }; + }, []); + + // listen to requests to change the editor location + useEffect(() => { + if (isElectron) { + ipcRenderer.on('request-editor-location', (_event: unknown, location: string) => { + navigate(location, { relative: 'route' }); + }); + } + + // Clean the listener after the component is dismounted + return () => { + ipcRenderer?.removeAllListeners(); + }; + }, [navigate]); return { isElectron, sendToElectron }; } diff --git a/apps/electron/src/main.js b/apps/electron/src/main.js index 166cad083..72b82b71e 100644 --- a/apps/electron/src/main.js +++ b/apps/electron/src/main.js @@ -113,6 +113,14 @@ function escalateError(error) { dialog.showErrorBox('An unrecoverable error occurred', error); } +/** + * Allows electron to ask react app redirect + * @param string location + */ +function redirectWindow(location) { + win.webContents.send('request-editor-location', location); +} + // Ensure there isn't another instance of the app running already const lock = app.requestSingleInstanceLock(); if (!lock) { @@ -182,14 +190,8 @@ app.whenReady().then(() => { .then((port) => { const clientUrl = getClientUrl(port); const serverUrl = getServerUrl(port); - const menu = getApplicationMenu( - askToQuit, - clientUrl, - serverUrl, - (path) => { - win.loadURL(`${clientUrl}/${path}`); - }, - (url) => win.webContents.downloadURL(url), + const menu = getApplicationMenu(askToQuit, clientUrl, serverUrl, redirectWindow, (url) => + win.webContents.downloadURL(url), ); Menu.setApplicationMenu(menu); diff --git a/apps/electron/src/menu/applicationMenu.js b/apps/electron/src/menu/applicationMenu.js index 9916ec625..6e64b5f54 100644 --- a/apps/electron/src/menu/applicationMenu.js +++ b/apps/electron/src/menu/applicationMenu.js @@ -79,15 +79,15 @@ function makeFileMenu(serverUrl, redirectWindow, download) { submenu: [ { label: 'New project...', - click: () => redirectWindow('editor?settings=project__manage&create=true'), + click: () => redirectWindow('/editor?settings=project__manage&create=true'), }, { label: 'Edit project info', - click: () => redirectWindow('editor?settings=project__data'), + click: () => redirectWindow('/editor?settings=project__data'), }, { label: 'Manage projects...', - click: () => redirectWindow('editor?settings=project__manage'), + click: () => redirectWindow('/editor?settings=project__manage'), }, { label: 'Download project', @@ -158,18 +158,18 @@ function makeSettingsMenu(redirectWindow) { { label: 'Open Settings', accelerator: 'CommandOrControl+,', - click: () => redirectWindow('editor?settings=project'), + click: () => redirectWindow('/editor?settings=project'), }, { label: 'Project', submenu: [ { label: 'Project data', - click: () => redirectWindow('editor?settings=project__data'), + click: () => redirectWindow('/editor?settings=project__data'), }, { label: 'Manage projects', - click: () => redirectWindow('editor?settings=project__manage'), + click: () => redirectWindow('/editor?settings=project__manage'), }, ], }, @@ -178,15 +178,15 @@ function makeSettingsMenu(redirectWindow) { submenu: [ { label: 'General settings', - click: () => redirectWindow('editor?settings=general__settings'), + click: () => redirectWindow('/editor?settings=general__settings'), }, { label: 'Editor settings', - click: () => redirectWindow('editor?settings=general__editor'), + click: () => redirectWindow('/editor?settings=general__editor'), }, { label: 'View settings', - click: () => redirectWindow('editor?settings=general__view'), + click: () => redirectWindow('/editor?settings=general__view'), }, ], }, @@ -195,11 +195,11 @@ function makeSettingsMenu(redirectWindow) { submenu: [ { label: 'Custom fields', - click: () => redirectWindow('editor?settings=feature_settings__custom'), + click: () => redirectWindow('/editor?settings=feature_settings__custom'), }, { label: 'URL presets', - click: () => redirectWindow('editor?settings=feature_settings__urlpresets'), + click: () => redirectWindow('/editor?settings=feature_settings__urlpresets'), }, ], }, @@ -208,11 +208,11 @@ function makeSettingsMenu(redirectWindow) { submenu: [ { label: 'Import spreadsheet', - click: () => redirectWindow('editor?settings=sources__xlsx'), + click: () => redirectWindow('/editor?settings=sources__xlsx'), }, { label: 'Sync with Google Sheet', - click: () => redirectWindow('editor?settings=sources__gsheet'), + click: () => redirectWindow('/editor?settings=sources__gsheet'), }, ], }, @@ -221,11 +221,11 @@ function makeSettingsMenu(redirectWindow) { submenu: [ { label: 'OSC settings', - click: () => redirectWindow('editor?settings=integrations__osc'), + click: () => redirectWindow('/editor?settings=integrations__osc'), }, { label: 'HTTP settings', - click: () => redirectWindow('editor?settings=integrations__http'), + click: () => redirectWindow('/editor?settings=integrations__http'), }, ], }, @@ -234,11 +234,11 @@ function makeSettingsMenu(redirectWindow) { submenu: [ { label: 'Event log', - click: () => redirectWindow('editor?settings=network__log'), + click: () => redirectWindow('/editor?settings=network__log'), }, { label: 'Manage cleints', - click: () => redirectWindow('editor?settings=network__clients'), + click: () => redirectWindow('/editor?settings=network__clients'), }, ], }, @@ -257,7 +257,7 @@ function makeHelpMenu(redirectWindow) { submenu: [ { label: `Ontime ${releaseTag}`, - click: () => redirectWindow('editor?settings=about'), + click: () => redirectWindow('/editor?settings=about'), }, { type: 'separator',