feat: open about page in setting modal when click about menu (#6245)

Co-authored-by: EYHN <cneyhn@gmail.com>

packages/frontend/core/src/providers/modal-provider.tsx

@@ -1,9 +1,16 @@
+import { events } from '@affine/electron-api';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import { WorkspaceManager } from '@toeverything/infra';
 import { useService } from '@toeverything/infra/di';
 import { useLiveData } from '@toeverything/infra/livedata';
 import { useAtom } from 'jotai';
-import { lazy, type ReactElement, Suspense, useCallback } from 'react';
+import {
+  lazy,
+  type ReactElement,
+  Suspense,
+  useCallback,
+  useEffect,
+} from 'react';
 
 import {
   authAtom,
@@ -116,6 +123,18 @@ export const Setting = () => {
     [setOpenSettingModalAtom]
   );
 
+  useEffect(() => {
+    if (environment.isDesktop) {
+      return events?.applicationMenu.openAboutPageInSettingModal(() =>
+        setOpenSettingModalAtom({
+          activeTab: 'about',
+          open: true,
+        })
+      );
+    }
+    return;
+  }, [setOpenSettingModalAtom]);
+
   if (!open) {
     return null;
   }

packages/frontend/electron/src/main/application-menu/create.ts

@@ -2,7 +2,7 @@ import { app, Menu } from 'electron';
 
 import { isMacOS } from '../../shared/utils';
 import { revealLogFile } from '../logger';
-import { initAndShowMainWindow } from '../main-window';
+import { initAndShowMainWindow, showMainWindow } from '../main-window';
 import { checkForUpdates } from '../updater';
 import { applicationMenuSubjects } from './subject';
 
@@ -22,7 +22,13 @@ export function createApplicationMenu() {
           {
             label: app.name,
             submenu: [
-              { role: 'about' },
+              {
+                label: `About ${app.getName()}`,
+                click: async () => {
+                  await showMainWindow();
+                  applicationMenuSubjects.openAboutPageInSettingModal.next();
+                },
+              },
               { type: 'separator' },
               { role: 'services' },
               { type: 'separator' },

packages/frontend/electron/src/main/application-menu/index.ts

@@ -17,4 +17,11 @@ export const applicationMenuEvents = {
       sub.unsubscribe();
     };
   },
+  openAboutPageInSettingModal: (fn: () => void) => {
+    const sub =
+      applicationMenuSubjects.openAboutPageInSettingModal.subscribe(fn);
+    return () => {
+      sub.unsubscribe();
+    };
+  },
 } satisfies Record<string, MainEventRegister>;

packages/frontend/electron/src/main/application-menu/subject.ts

@@ -2,4 +2,5 @@ import { Subject } from 'rxjs';
 
 export const applicationMenuSubjects = {
   newPageAction: new Subject<void>(),
+  openAboutPageInSettingModal: new Subject<void>(),
 };

packages/frontend/electron/src/main/main-window.ts

@@ -215,6 +215,15 @@ export async function getMainWindow() {
   return window;
 }
 
+export async function showMainWindow() {
+  const window = await getMainWindow();
+  if (!window) return;
+  if (window.isMinimized()) {
+    window.restore();
+  }
+  window.focus();
+}
+
 export async function handleOpenUrlInHiddenWindow(url: string) {
   const win = new BrowserWindow({
     width: 1200,