feat(core): add open link in app to doc menu (#8597)

add "open in desktop app" menu item for editor

fix AF-1547

packages/frontend/core/src/components/affine/auth/oauth.tsx

@@ -35,7 +35,7 @@ export function OAuth({ redirectUrl }: { redirectUrl?: string }) {
   const oauthProviders = useLiveData(
     serverConfig.config$.map(r => r?.oauthProviders)
   );
-  const schema = urlService.getClientSchema();
+  const scheme = urlService.getClientScheme();
 
   if (!oauth) {
     return <Skeleton height={50} />;
@@ -46,7 +46,7 @@ export function OAuth({ redirectUrl }: { redirectUrl?: string }) {
       key={provider}
       provider={provider}
       redirectUrl={redirectUrl}
-      schema={schema}
+      scheme={scheme}
       popupWindow={url => {
         urlService.openPopupWindow(url);
       }}
@@ -57,12 +57,12 @@ export function OAuth({ redirectUrl }: { redirectUrl?: string }) {
 function OAuthProvider({
   provider,
   redirectUrl,
-  schema,
+  scheme,
   popupWindow,
 }: {
   provider: OAuthProviderType;
   redirectUrl?: string;
-  schema?: string;
+  scheme?: string;
   popupWindow: (url: string) => void;
 }) {
   const { icon } = OAuthProviderMap[provider];
@@ -76,8 +76,8 @@ function OAuthProvider({
       params.set('redirect_uri', redirectUrl);
     }
 
-    if (schema) {
-      params.set('client', schema);
+    if (scheme) {
+      params.set('client', scheme);
     }
 
     // TODO: Android app scheme not implemented
@@ -87,7 +87,7 @@ function OAuthProvider({
       BUILD_CONFIG.serverUrlPrefix + `/oauth/login?${params.toString()}`;
 
     popupWindow(oauthUrl);
-  }, [popupWindow, provider, redirectUrl, schema]);
+  }, [popupWindow, provider, redirectUrl, scheme]);
 
   return (
     <Button

packages/frontend/core/src/components/affine/setting-modal/general-setting/about/index.tsx

@@ -5,6 +5,10 @@ import {
   SettingWrapper,
 } from '@affine/component/setting-components';
 import { useAppUpdater } from '@affine/core/components/hooks/use-app-updater';
+import {
+  appIconMap,
+  appNames,
+} from '@affine/core/modules/open-in-app/constant';
 import { UrlService } from '@affine/core/modules/url';
 import { useI18n } from '@affine/i18n';
 import { mixpanel } from '@affine/track';
@@ -13,7 +17,6 @@ import { useService } from '@toeverything/infra';
 import { useCallback } from 'react';
 
 import { useAppSettingHelper } from '../../../../../components/hooks/affine/use-app-setting-helper';
-import { appIconMap, appNames } from '../../../../../desktop/pages/open-app';
 import { relatedLinks } from './config';
 import * as styles from './style.css';
 import { UpdateCheckSection } from './update-check-section';

packages/frontend/core/src/components/affine/subscription-landing/index.tsx

@@ -20,8 +20,8 @@ const UpgradeSuccessLayout = ({
 
   const { jumpToIndex, openInApp } = useNavigateHelper();
   const openAffine = useCallback(() => {
-    if (params.get('schema')) {
-      openInApp(params.get('schema') ?? 'affine', 'bring-to-front');
+    if (params.get('scheme')) {
+      openInApp(params.get('scheme') ?? 'affine', 'bring-to-front');
     } else {
       jumpToIndex();
     }

packages/frontend/core/src/components/blocksuite/block-suite-header/menu/index.tsx

@@ -19,6 +19,7 @@ import { IsFavoriteIcon } from '@affine/core/components/pure/icons';
 import { useDetailPageHeaderResponsive } from '@affine/core/desktop/pages/workspace/detail-page/use-header-responsive';
 import { DocInfoService } from '@affine/core/modules/doc-info';
 import { EditorService } from '@affine/core/modules/editor';
+import { getOpenUrlInDesktopAppLink } from '@affine/core/modules/open-in-app/utils';
 import { WorkbenchService } from '@affine/core/modules/workbench';
 import { ViewService } from '@affine/core/modules/workbench/services/view';
 import { WorkspaceFlavour } from '@affine/env/workspace';
@@ -33,6 +34,7 @@ import {
   HistoryIcon,
   ImportIcon,
   InformationIcon,
+  LocalWorkspaceIcon,
   OpenInNewIcon,
   PageIcon,
   SaveIcon,
@@ -258,6 +260,13 @@ export const PageHeaderMenuButton = ({
     </>
   );
 
+  const onOpenInDesktop = useCallback(() => {
+    const url = getOpenUrlInDesktopAppLink(window.location.href, true);
+    if (url) {
+      window.open(url, '_blank');
+    }
+  }, []);
+
   const EditMenu = (
     <>
       {showResponsiveMenu ? ResponsiveMenuItems : null}
@@ -362,6 +371,15 @@ export const PageHeaderMenuButton = ({
         data-testid="editor-option-menu-delete"
         onSelect={handleOpenTrashModal}
       />
+      {BUILD_CONFIG.isWeb ? (
+        <MenuItem
+          prefixIcon={<LocalWorkspaceIcon />}
+          data-testid="editor-option-menu-link"
+          onSelect={onOpenInDesktop}
+        >
+          {t['com.affine.header.option.open-in-desktop']()}
+        </MenuItem>
+      ) : null}
     </>
   );
   if (isInTrash) {

packages/frontend/core/src/components/hooks/use-navigate-helper.ts

@@ -160,9 +160,9 @@ export function useNavigateHelper() {
   );
 
   const openInApp = useCallback(
-    (schema: string, path: string) => {
-      const encodedUrl = encodeURIComponent(`${schema}://${path}`);
-      return navigate(`/open-app/url?schema=${schema}&url=${encodedUrl}`);
+    (scheme: string, path: string) => {
+      const encodedUrl = encodeURIComponent(`${scheme}://${path}`);
+      return navigate(`/open-app/url?scheme=${scheme}&url=${encodedUrl}`);
     },
     [navigate]
   );