fix(core): handle the situation where the app cannot be opened after logging in (#8915)

Added buttons to open the web version of AFFiNE and download the latest client to handle the situation where the application cannot be opened after logging in.

![CleanShot 2024-11-25 at 17 19 37@2x](https://github.com/user-attachments/assets/fd4e00fa-61a2-45ac-9bbc-fc4e4a8abc4e)

packages/frontend/core/src/modules/open-in-app/views/open-in-app-page.css.ts

@@ -43,6 +43,7 @@ export const promptLink = style({
   fontWeight: 500,
   textDecoration: 'none',
   fontSize: cssVar('fontSm'),
+  cursor: 'pointer',
 });
 export const centerContent = style({
   display: 'flex',
@@ -54,6 +55,14 @@ export const prompt = style({
   marginTop: 20,
   marginBottom: 12,
 });
+
+export const accidentHandling = style({
+  marginTop: 20,
+  display: 'flex',
+  flexDirection: 'column',
+  rowGap: 12,
+  alignItems: 'center',
+});
 export const editSettingsLink = style({
   fontWeight: 500,
   textDecoration: 'none',

packages/frontend/core/src/modules/open-in-app/views/open-in-app-page.tsx

@@ -6,6 +6,7 @@ import { LocalWorkspaceIcon, Logo1Icon } from '@blocksuite/icons/rc';
 import { useService } from '@toeverything/infra';
 import type { MouseEvent } from 'react';
 import { useCallback } from 'react';
+import { Link } from 'react-router-dom';
 
 import { GlobalDialogService } from '../../dialogs';
 import { getOpenUrlInDesktopAppLink } from '../utils';
@@ -17,19 +18,19 @@ interface OpenAppProps {
   urlToOpen?: string | null;
   openHereClicked?: (e: MouseEvent) => void;
 }
+const channel = BUILD_CONFIG.appBuildType;
+const url =
+  'https://affine.pro/download' + (channel !== 'stable' ? '/beta-canary' : '');
 
 export const OpenInAppPage = ({ urlToOpen, openHereClicked }: OpenAppProps) => {
   // default to open the current page in desktop app
   urlToOpen ??= getOpenUrlInDesktopAppLink(window.location.href, true);
   const globalDialogService = useService(GlobalDialogService);
   const t = useI18n();
-  const channel = BUILD_CONFIG.appBuildType;
+
   const openDownloadLink = useCallback(() => {
-    const url =
-      'https://affine.pro/download' +
-      (channel !== 'stable' ? '/beta-canary' : '');
     open(url, '_blank');
-  }, [channel]);
+  }, []);
 
   const appIcon = appIconMap[channel];
   const appName = appNames[channel];
@@ -139,6 +140,22 @@ export const OpenInAppPage = ({ urlToOpen, openHereClicked }: OpenAppProps) => {
             {t['com.affine.auth.open.affine.try-again']()}
           </a>
         </div>
+        <div className={styles.accidentHandling}>
+          <div className={styles.prompt}>
+            {t['com.affine.auth.open.affine.still-have-problems']()}
+          </div>
+          <Link to="/" replace className={styles.promptLink}>
+            {t['com.affine.auth.open.affine.continue-with-browser']()}
+          </Link>
+          <a
+            className={styles.promptLink}
+            href={url}
+            target="_blank"
+            rel="noreferrer"
+          >
+            {t['com.affine.auth.open.affine.download-latest-client']()}
+          </a>
+        </div>
       </div>
 
       {maybeDocLink ? (

packages/frontend/i18n/src/i18n-completenesses.json

@@ -16,7 +16,7 @@
   "ko": 79,
   "pl": 0,
   "pt-BR": 86,
-  "ru": 74,
+  "ru": 73,
   "sv-SE": 4,
   "ur": 3,
   "zh-Hans": 100,

packages/frontend/i18n/src/resources/en.json

@@ -234,6 +234,9 @@
   "com.affine.auth.open.affine.prompt": "Opening <1>AFFiNE</1> app now",
   "com.affine.auth.open.affine.open-doc-prompt": "This doc is now opened in <1>AFFiNE</1> app",
   "com.affine.auth.open.affine.try-again": "Try again",
+  "com.affine.auth.open.affine.still-have-problems": "Still have problems?",
+  "com.affine.auth.open.affine.continue-with-browser": "Continue with Browser",
+  "com.affine.auth.open.affine.download-latest-client": "Download Latest Client",
   "com.affine.auth.open.affine.doc.open-here": "Open here instead",
   "com.affine.auth.open.affine.doc.edit-settings": "Edit settings",
   "com.affine.auth.open.affine.doc.footer-text": "Requires AFFiNE desktop app version 0.18 or later.",

packages/frontend/i18n/src/resources/zh-Hans.json

@@ -234,6 +234,9 @@
   "com.affine.auth.open.affine.prompt": "正在打开 <1>AFFiNE</1> 应用\n",
   "com.affine.auth.open.affine.open-doc-prompt": "已在 <1>AFFiNE</1> 客户端中打开此文档",
   "com.affine.auth.open.affine.try-again": "重试",
+  "com.affine.auth.open.affine.still-have-problems": "仍然遇到问题？",
+  "com.affine.auth.open.affine.continue-with-browser": "使用浏览器继续",
+  "com.affine.auth.open.affine.download-latest-client": "下载最新客户端",
   "com.affine.auth.open.affine.doc.open-here": "在此处打开",
   "com.affine.auth.open.affine.doc.edit-settings": "编辑设置",
   "com.affine.auth.open.affine.doc.footer-text": "需要 AFFiNE 桌面应用程序版本 0.18 或更高。",