refactor(electron): move electron-api to framework (#8601)

fix AF-1394

packages/frontend/core/src/desktop/pages/404.tsx

@@ -3,8 +3,12 @@ import {
   NotFoundPage,
 } from '@affine/component/not-found-page';
 import { useAsyncCallback } from '@affine/core/components/hooks/affine-async-hooks';
-import { apis } from '@affine/electron-api';
-import { useLiveData, useService } from '@toeverything/infra';
+import { DesktopApiService } from '@affine/core/modules/desktop-api/service';
+import {
+  useLiveData,
+  useService,
+  useServiceOptional,
+} from '@toeverything/infra';
 import type { ReactElement } from 'react';
 import { useCallback, useEffect, useState } from 'react';
 
@@ -22,6 +26,7 @@ export const PageNotFound = ({
   noPermission?: boolean;
 }): ReactElement => {
   const authService = useService(AuthService);
+  const desktopApi = useServiceOptional(DesktopApiService);
   const account = useLiveData(authService.session.account$);
   const { jumpToIndex } = useNavigateHelper();
   const [open, setOpen] = useState(false);
@@ -41,8 +46,8 @@ export const PageNotFound = ({
   }, [authService]);
 
   useEffect(() => {
-    apis?.ui.pingAppLayoutReady().catch(console.error);
-  }, []);
+    desktopApi?.handler.ui.pingAppLayoutReady().catch(console.error);
+  }, [desktopApi]);
 
   // not using workbench location or router location deliberately
   // strip the origin

packages/frontend/core/src/desktop/pages/index.tsx

@@ -1,8 +1,9 @@
-import { apis } from '@affine/electron-api';
+import { DesktopApiService } from '@affine/core/modules/desktop-api/service';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import {
   useLiveData,
   useService,
+  useServiceOptional,
   WorkspacesService,
 } from '@toeverything/infra';
 import {
@@ -118,9 +119,11 @@ export const Component = ({
     defaultIndexRoute,
   ]);
 
+  const desktopApi = useServiceOptional(DesktopApiService);
+
   useEffect(() => {
-    apis?.ui.pingAppLayoutReady().catch(console.error);
-  }, []);
+    desktopApi?.handler.ui.pingAppLayoutReady().catch(console.error);
+  }, [desktopApi]);
 
   useEffect(() => {
     setCreating(true);

packages/frontend/core/src/desktop/pages/onboarding.tsx

@@ -1,5 +1,5 @@
-import { apis } from '@affine/electron-api';
-import { assertExists } from '@blocksuite/affine/global/utils';
+import { DesktopApiService } from '@affine/core/modules/desktop-api/service';
+import { useServiceOptional } from '@toeverything/infra';
 import { useCallback } from 'react';
 import { redirect } from 'react-router-dom';
 
@@ -25,18 +25,18 @@ export const loader = () => {
 export const Component = () => {
   const { jumpToIndex } = useNavigateHelper();
   const [, setOnboarding] = useAppConfigStorage('onBoarding');
+  const desktopApi = useServiceOptional(DesktopApiService);
 
   const openApp = useCallback(() => {
     if (BUILD_CONFIG.isElectron) {
-      assertExists(apis);
-      apis.ui.handleOpenMainApp().catch(err => {
+      desktopApi?.handler.ui.handleOpenMainApp().catch(err => {
         console.log('failed to open main app', err);
       });
     } else {
       jumpToIndex(RouteLogic.REPLACE);
       setOnboarding(false);
     }
-  }, [jumpToIndex, setOnboarding]);
+  }, [jumpToIndex, setOnboarding, desktopApi]);
 
   return <Onboarding onOpenApp={openApp} />;
 };

packages/frontend/core/src/desktop/pages/workspace/index.tsx

@@ -53,7 +53,7 @@ export const Component = (): ReactElement => {
       match &&
       match.params.docId &&
       match.params.workspaceId &&
-      // // TODO(eyhn): need a better way to check if it's a docId
+      // TODO(eyhn): need a better way to check if it's a docId
       workbenchRoutes.find(route =>
         matchPath(route.path, '/' + match.params.docId)
       )?.path === '/:pageId'