Remove reload and force reload from menus (#202)

main/background.ts

@@ -1,4 +1,11 @@
-import { BrowserWindow, app, nativeTheme, crashReporter } from "electron";
+import {
+  BrowserWindow,
+  app,
+  nativeTheme,
+  crashReporter,
+  Menu,
+  MenuItem,
+} from "electron";
 import log from "electron-log";
 import serve from "electron-serve";
 import { createIPCHandler } from "electron-trpc/main";
@@ -73,13 +80,53 @@ async function createThemeChangeHandler() {
   updateTitleBarOverlay();
 }
 
+function setAppMenu() {
+  const defaultMenu = Menu.getApplicationMenu();
+  if (!defaultMenu) {
+    log.warn("No default menu found");
+    return;
+  }
+
+  const newMenu = new Menu();
+  for (const menuItem of defaultMenu.items) {
+    const newSubmenu = new Menu();
+
+    const filteredMenu =
+      menuItem.submenu?.items.filter(
+        (subMenuItem) =>
+          // We want to prevent the window from being reloaded since our dynamic routes aren't statically
+          // generated. This causes the app to 404 if the user reloads on a dynamic route. We tried calling
+          // preventDefault in beforeunload in the app and explicitly called window.destroy() in the window.close
+          // event on the main process, but that caused a crash in electron-trpc when closing the app while a TRPC
+          // subscription was active. Removing reload and forcereload also disables their keybindings, so it
+          // should prevent users from reloading the app.
+          // @ts-expect-error subMenuItem.role should be forcereload instead of forceReload
+          subMenuItem.role != "reload" && subMenuItem.role != "forcereload",
+      ) ?? [];
+    for (const subMenuItem of filteredMenu) {
+      newSubmenu.append(subMenuItem);
+    }
+
+    newMenu.append(
+      new MenuItem({
+        type: menuItem.type,
+        label: menuItem.label,
+        submenu: newSubmenu,
+      }),
+    );
+  }
+
+  Menu.setApplicationMenu(newMenu);
+}
+
 app.whenReady().then(() => {
   if (isProd) {
     updater.init();
   }
 
   createThemeChangeHandler();
   setNativeThemeSource();
+  setAppMenu();
   migrateNodeAppBetaContacts();
 
   const handler = createIPCHandler({ router });

main/main-window.ts

@@ -140,12 +140,6 @@ class MainWindow {
       return { action: "deny" };
     });
 
-    // We're intentially preventing the browser from handling unload events (e.g. close, refresh)
-    // so we have to handle closing the window manually.
-    this.window.on("close", () => {
-      this.window?.destroy();
-    });
-
     this.window.on("closed", () => {
       this.window = null;
       const [promise, resolve] = PromiseUtils.split<BrowserWindow>();

renderer/pages/_app.tsx

@@ -1,7 +1,6 @@
 import { ChakraProvider } from "@chakra-ui/react";
 import { AppProps } from "next/app";
 import Head from "next/head";
-import { useEffect } from "react";
 import { useIsClient } from "usehooks-ts";
 
 import { ErrorBoundary } from "@/components/ErrorBoundary/ErrorBoundary";
@@ -52,17 +51,6 @@ const systemColorModeManager = new SystemColorModeManager();
 export default function MyApp({ Component, pageProps }: AppProps) {
   const isClient = useIsClient();
 
-  useEffect(() => {
-    // Prevent window from unloading (i.e. closing or being reloaded). This is due to dynamic routes not
-    // being statically generated, which causes the app to 404 if the user reloads on a dynamic route.
-    // Closing the window is handled by the main process, which listens for the "close" event and destroys
-    // the window.
-    window.addEventListener("beforeunload", (e) => {
-      e.preventDefault();
-      e.returnValue = true;
-    });
-  }, []);
-
   if (!isClient) {
     return null;
   }