feat(core): cmd+f search in doc function (#7040)

You can use the cmd+F shortcut key to trigger the FindInPage function.

packages/frontend/electron/src/main/find-in-page/handlers.ts

@@ -0,0 +1,17 @@
+export const findInPageHandlers = {
+  findInPage: async (
+    event: Electron.IpcMainInvokeEvent,
+    text: string,
+    options?: Electron.FindInPageOptions
+  ) => {
+    const webContents = event.sender;
+    return webContents.findInPage(text, options);
+  },
+  stopFindInPage: async (
+    event: Electron.IpcMainInvokeEvent,
+    action: 'clearSelection' | 'keepSelection' | 'activateSelection'
+  ) => {
+    const webContents = event.sender;
+    return webContents.stopFindInPage(action);
+  },
+};

packages/frontend/electron/src/main/find-in-page/index.ts

@@ -0,0 +1 @@
+export * from './handlers';

packages/frontend/electron/src/main/handlers.ts

@@ -3,6 +3,7 @@ import { ipcMain } from 'electron';
 import { clipboardHandlers } from './clipboard';
 import { configStorageHandlers } from './config-storage';
 import { exportHandlers } from './export';
+import { findInPageHandlers } from './find-in-page';
 import { getLogFilePath, logger, revealLogFile } from './logger';
 import { uiHandlers } from './ui/handlers';
 import { updaterHandlers } from './updater';
@@ -24,6 +25,7 @@ export const allHandlers = {
   export: exportHandlers,
   updater: updaterHandlers,
   configStorage: configStorageHandlers,
+  findInPage: findInPageHandlers,
 };
 
 export const registerHandlers = () => {

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

@@ -169,6 +169,16 @@ async function createWindow(additionalArguments: string[]) {
     uiSubjects.onFullScreen$.next(false);
   });
 
+  browserWindow.webContents.on('found-in-page', (_event, result) => {
+    const { requestId, activeMatchOrdinal, matches, finalUpdate } = result;
+    browserWindow.webContents.send('found-in-page-result', {
+      requestId,
+      activeMatchOrdinal,
+      matches,
+      finalUpdate,
+    });
+  });
+
   /**
    * URL for main window.
    */

packages/frontend/electron/src/preload/bootstrap.ts

@@ -1,6 +1,6 @@
 import { contextBridge } from 'electron';
 
-import { affine, appInfo, getElectronAPIs } from './electron-api';
+import { affine, appInfo, cmdFind, getElectronAPIs } from './electron-api';
 
 const { apis, events } = getElectronAPIs();
 
@@ -10,6 +10,7 @@ contextBridge.exposeInMainWorld('events', events);
 
 try {
   contextBridge.exposeInMainWorld('affine', affine);
+  contextBridge.exposeInMainWorld('cmdFind', cmdFind);
 } catch (error) {
   console.error('Failed to expose affine APIs to window object!', error);
 }

packages/frontend/electron/src/preload/electron-api.ts

@@ -47,6 +47,20 @@ export const affine = {
   },
 };
 
+export const cmdFind = {
+  findInPage: (text: string, options?: Electron.FindInPageOptions) =>
+    ipcRenderer.invoke('findInPage:findInPage', text, options),
+  stopFindInPage: (
+    action: 'clearSelection' | 'keepSelection' | 'activateSelection'
+  ) => ipcRenderer.invoke('findInPage:stopFindInPage', action),
+  onFindInPageResult: (callBack: (data: any) => void) =>
+    ipcRenderer.on('found-in-page-result', (_event, data) => callBack(data)),
+  offFindInPageResult: (callBack: (data: any) => void) =>
+    ipcRenderer.removeListener('found-in-page-result', (_event, data) =>
+      callBack(data)
+    ),
+};
+
 export function getElectronAPIs() {
   const mainAPIs = getMainAPIs();
   const helperAPIs = getHelperAPIs();