From 43b390a079786bb2985e5433f2cd93918295c172 Mon Sep 17 00:00:00 2001
From: Carlos Valente <carlosvalente@pm.me>
Date: Sun, 27 Oct 2024 10:20:01 +0100
Subject: [PATCH] refactor: register modal in electron

---
 apps/client/src/common/hooks/useElectronEvent.ts  | 15 +++++++++------
 .../panel/project-panel/ManageProjects.tsx        |  6 +++---
 apps/client/src/features/editors/Editor.tsx       |  4 ++++
 apps/electron/src/menu/applicationMenu.js         | 10 +++++++---
 4 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/apps/client/src/common/hooks/useElectronEvent.ts b/apps/client/src/common/hooks/useElectronEvent.ts
index f76d4b782..93d03b0e7 100644
--- a/apps/client/src/common/hooks/useElectronEvent.ts
+++ b/apps/client/src/common/hooks/useElectronEvent.ts
@@ -4,15 +4,20 @@ import { useNavigate } from 'react-router-dom';
 const isElectron = window.process?.type === 'renderer';
 const ipcRenderer = isElectron ? window.require('electron').ipcRenderer : null;
 
-export default function useElectronEvent() {
-  const navigate = useNavigate();
-
+export function useElectronEvent() {
   const sendToElectron = useCallback((channel: string, args?: string | Record<string, unknown>) => {
     if (isElectron && ipcRenderer) {
       ipcRenderer.send(channel, args);
     }
   }, []);
 
+  return { isElectron, sendToElectron };
+}
+
+export function useElectronListener() {
+  const navigate = useNavigate();
+  const { isElectron } = useElectronEvent();
+
   // listen to requests to change the editor location
   useEffect(() => {
     if (isElectron) {
@@ -25,7 +30,5 @@ export default function useElectronEvent() {
     return () => {
       ipcRenderer?.removeAllListeners();
     };
-  }, [navigate]);
-
-  return { isElectron, sendToElectron };
+  }, [isElectron, navigate]);
 }
diff --git a/apps/client/src/features/app-settings/panel/project-panel/ManageProjects.tsx b/apps/client/src/features/app-settings/panel/project-panel/ManageProjects.tsx
index d25a0e1ec..0a020ef5e 100644
--- a/apps/client/src/features/app-settings/panel/project-panel/ManageProjects.tsx
+++ b/apps/client/src/features/app-settings/panel/project-panel/ManageProjects.tsx
@@ -20,10 +20,10 @@ export default function ManageProjects() {
 
   const fileInputRef = useRef<HTMLInputElement>(null);
 
-  const isCreatingProject = searchParams.get('create') === 'true';
+  const isCreatingProject = searchParams.get('new') === 'true';
 
   const handleToggleCreate = () => {
-    searchParams.set('create', isCreatingProject ? 'false' : 'true');
+    searchParams.set('new', isCreatingProject ? 'false' : 'true');
     setSearchParams(searchParams);
   };
 
@@ -53,7 +53,7 @@ export default function ManageProjects() {
   };
 
   const handleCloseForm = () => {
-    searchParams.delete('create');
+    searchParams.delete('new');
     setSearchParams(searchParams);
   };
 
diff --git a/apps/client/src/features/editors/Editor.tsx b/apps/client/src/features/editors/Editor.tsx
index 3627dc924..0fc2045b8 100644
--- a/apps/client/src/features/editors/Editor.tsx
+++ b/apps/client/src/features/editors/Editor.tsx
@@ -6,6 +6,7 @@ import { IoClose } from '@react-icons/all-files/io5/IoClose';
 import { IoSettingsOutline } from '@react-icons/all-files/io5/IoSettingsOutline';
 
 import ProductionNavigationMenu from '../../common/components/navigation-menu/ProductionNavigationMenu';
+import { useElectronListener } from '../../common/hooks/useElectronEvent';
 import { useWindowTitle } from '../../common/hooks/useWindowTitle';
 import AppSettings from '../app-settings/AppSettings';
 import useAppSettingsNavigation from '../app-settings/useAppSettingsNavigation';
@@ -26,6 +27,9 @@ export default function Editor() {
 
   useWindowTitle('Editor');
 
+  // we need to register the listener to change the editor location
+  useElectronListener();
+
   // listen to shutdown request from electron process
   useEffect(() => {
     if (window.process?.type === 'renderer') {
diff --git a/apps/electron/src/menu/applicationMenu.js b/apps/electron/src/menu/applicationMenu.js
index 23b3d4fef..072b7e653 100644
--- a/apps/electron/src/menu/applicationMenu.js
+++ b/apps/electron/src/menu/applicationMenu.js
@@ -81,14 +81,18 @@ function makeFileMenu(serverUrl, redirectWindow, download) {
     submenu: [
       {
         label: 'New project...',
-        click: () => redirectWindow('/editor?settings=project__manage&create=true'),
+        click: () => redirectWindow('/editor?settings=project__manage&new=true'),
       },
       {
-        label: 'Edit project info',
+        label: 'Quick start...',
+        click: () => redirectWindow('/editor?settings=project__create'),
+      },
+      {
+        label: 'Edit project info...',
         click: () => redirectWindow('/editor?settings=project__data'),
       },
       {
-        label: 'Manage projects...',
+        label: 'Manage projects',
         click: () => redirectWindow('/editor?settings=project__manage'),
       },
       {