feat(core): add new loading doc component (#11737)

packages/frontend/component/src/components/page-detail-skeleton/index.css.ts

@@ -1,18 +1,84 @@
 import { cssVar } from '@toeverything/theme';
+import { cssVarV2 } from '@toeverything/theme/v2';
 import { style } from '@vanilla-extract/css';
 export const pageDetailSkeletonStyle = style({
   padding: '0 20px',
-});
+  height: '100%',
-export const pageDetailSkeletonTitleStyle = style({
+  display: 'flex',
-  height: '52px',
+  flexDirection: 'column',
-  width: '100%',
+  justifyContent: 'center',
+  alignItems: 'center',
 });
 export const blockSuiteEditorStyle = style({
   maxWidth: cssVar('editorWidth'),
-  margin: '0 2rem',
+  margin: 'auto 2rem',
   padding: '0 24px',
+  display: 'flex',
+  flexDirection: 'column',
+  justifyContent: 'center',
+  alignItems: 'center',
+  height: '100%',
 });
-export const blockSuiteEditorHeaderStyle = style({
+export const illustration = style({
-  marginTop: '40px',
+  maxWidth: '100%',
-  marginBottom: '40px',
+  width: 300,
+  alignSelf: 'center',
+});
+export const content = style({
+  width: '100%',
+  textAlign: 'center',
+  maxWidth: '261px',
+  display: 'flex',
+  flexDirection: 'column',
+  alignItems: 'center',
+  justifyContent: 'center',
+  margin: '16px auto 0',
+  selectors: {
+    '&[data-longer-loading="true"]': {
+      maxWidth: '400px',
+    },
+  },
+});
+export const loadingIcon = style({
+  marginRight: '8px',
+});
+export const title = style({
+  fontSize: cssVar('fontBase'),
+  lineHeight: 1.6,
+  fontWeight: 500,
+  color: cssVarV2('text/primary'),
+  textAlign: 'center',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  gap: '8px',
+  marginBottom: '4px',
+});
+export const text = style({
+  fontSize: cssVar('fontSm'),
+  lineHeight: 1.6,
+  fontWeight: 400,
+  color: cssVarV2('text/secondary'),
+  textWrap: 'wrap',
+  wordBreak: 'break-word',
+  textAlign: 'center',
+  selectors: {
+    '&[data-longer-loading="true"]': {
+      textAlign: 'start',
+    },
+  },
+});
+export const actionButton = style({ marginTop: '24px' });
+export const mobileActionButton = style({
+  padding: '8px 18px',
+  height: 'auto',
+  fontWeight: 600,
+  marginTop: '24px',
+});
+
+export const actionContent = style({
+  padding: '0 4px',
+});
+export const mobileActionContent = style({
+  padding: '0 4px',
 });

packages/frontend/component/src/components/page-detail-skeleton/index.tsx

@@ -1,28 +1,89 @@
-import { Skeleton } from '../../ui/skeleton';
+import { Trans, useI18n } from '@affine/i18n';
-import {
+import clsx from 'clsx';
-  blockSuiteEditorHeaderStyle,
+import { useCallback } from 'react';
-  blockSuiteEditorStyle,
-  pageDetailSkeletonStyle,
-  pageDetailSkeletonTitleStyle,
-} from './index.css';
 
-export const EditorLoading = () => {
+import { Button } from '../../ui/button';
+import { Loading } from '../../ui/loading';
+import { ThemedImg } from '../../ui/themed-img';
+import imageUrlForDarkLoading from './assets/loading.dark.png';
+import imageUrlForLightLoading from './assets/loading.light.png';
+import * as styles from './index.css';
+
+export const EditorLoading = ({
+  longerLoading = false,
+}: {
+  longerLoading?: boolean;
+}) => {
+  const t = useI18n();
+  const reloadPage = useCallback(() => {
+    document.location.reload();
+  }, []);
   return (
-    <div className={blockSuiteEditorStyle}>
+    <div className={styles.blockSuiteEditorStyle}>
-      <Skeleton
+      <ThemedImg
-        className={blockSuiteEditorHeaderStyle}
+        style={{ width: '300px' }}
-        animation="wave"
+        draggable={false}
-        height={50}
+        className={styles.illustration}
+        lightSrc={imageUrlForLightLoading}
+        darkSrc={imageUrlForDarkLoading}
       />
-      <Skeleton animation="wave" height={30} width="40%" />
+      {longerLoading ? (
+        <div className={styles.content} data-longer-loading={true}>
+          <div>
+            <div className={styles.text} data-longer-loading={true}>
+              {t['com.affine.error.loading-timeout-error']()}
+            </div>
+            <div className={styles.text} data-longer-loading={true}>
+              <Trans
+                i18nKey="com.affine.error.contact-us"
+                components={{
+                  1: (
+                    <a
+                      style={{ color: 'var(--affine-primary-color)' }}
+                      href="https://community.affine.pro"
+                      target="__blank"
+                    />
+                  ),
+                }}
+              />
+            </div>
+          </div>
+          <Button
+            size="large"
+            className={clsx(
+              BUILD_CONFIG.isMobileEdition
+                ? styles.mobileActionButton
+                : styles.actionButton
+            )}
+            contentClassName={clsx(
+              BUILD_CONFIG.isMobileEdition
+                ? styles.mobileActionContent
+                : styles.actionContent
+            )}
+            onClick={reloadPage}
+            variant="primary"
+          >
+            {t['com.affine.error.reload']()}
+          </Button>
+        </div>
+      ) : (
+        <div className={styles.content}>
+          <div className={styles.title}>
+            <Loading size={20} className={styles.loadingIcon} />
+            {t['com.affine.loading']()}
+          </div>
+          <div className={styles.text}>
+            {t['com.affine.loading.description']()}
+          </div>
+        </div>
+      )}
     </div>
   );
 };
 
-export const PageDetailSkeleton = () => {
+export const PageDetailLoading = () => {
   return (
-    <div className={pageDetailSkeletonStyle}>
+    <div className={styles.pageDetailSkeletonStyle}>
-      <div className={pageDetailSkeletonTitleStyle} />
       <EditorLoading />
     </div>
   );

packages/frontend/core/src/blocksuite/block-suite-editor/blocksuite-editor.tsx

@@ -9,6 +9,7 @@ import {
   fontStyleOptions,
 } from '@affine/core/modules/editor-setting';
 import { FeatureFlagService } from '@affine/core/modules/feature-flag';
+import track from '@affine/track';
 import {
   customImageProxyMiddleware,
   ImageProxyService,
@@ -31,7 +32,6 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 
 import type { DefaultOpenProperty } from '../../components/doc-properties';
 import { BlocksuiteDocEditor, BlocksuiteEdgelessEditor } from './lit-adaper';
-import { NoPageRootError } from './no-page-error';
 import * as styles from './styles.css';
 
 export interface AffineEditorContainer extends HTMLElement {
@@ -289,7 +289,8 @@ const BlockSuiteEditorImpl = ({
 
 export const BlockSuiteEditor = (props: EditorProps) => {
   const [isLoading, setIsLoading] = useState(true);
-  const [error, setError] = useState<Error | null>(null);
+  const [longerLoading, setLongerLoading] = useState(false);
+  const [loadStartTime] = useState(Date.now());
 
   const editorSetting = useService(EditorSettingService).editorSetting;
   const settings = useLiveData(
@@ -319,28 +320,41 @@ export const BlockSuiteEditor = (props: EditorProps) => {
       return;
     }
     const timer = setTimeout(() => {
-      disposable.unsubscribe();
+      setLongerLoading(true);
-      setError(new NoPageRootError(props.page));
     }, 20 * 1000);
+    const reportErrorTimer = setTimeout(() => {
+      if (isLoading) {
+        track.doc.$.$.loadDoc({
+          workspaceId: props.page.workspace.id,
+          docId: props.page.id,
+          // time cost in ms
+          time: Date.now() - loadStartTime,
+          success: false,
+        });
+      }
+    }, 60 * 1000);
     const disposable = props.page.slots.rootAdded.subscribe(() => {
       disposable.unsubscribe();
+      track.doc.$.$.loadDoc({
+        workspaceId: props.page.workspace.id,
+        docId: props.page.id,
+        time: Date.now() - loadStartTime,
+        success: true,
+      });
       setIsLoading(false);
-      clearTimeout(timer);
+      setLongerLoading(false);
     });
     return () => {
       disposable.unsubscribe();
       clearTimeout(timer);
+      clearTimeout(reportErrorTimer);
     };
-  }, [props.page]);
+  }, [isLoading, loadStartTime, props.page]);
-
-  if (error) {
-    throw error;
-  }
 
   return (
     <Slot style={{ '--affine-font-family': fontFamily } as CSSProperties}>
       {isLoading ? (
-        <EditorLoading />
+        <EditorLoading longerLoading={longerLoading} />
       ) : (
         <BlockSuiteEditorImpl key={props.page.id} {...props} />
       )}

packages/frontend/core/src/components/affine/affine-error-boundary/error-basic/error-detail.tsx

@@ -75,8 +75,7 @@ export const ErrorDetail: FC<ErrorDetailProps> = props => {
   }, [onButtonClick, resetError]);
 
   const desc = descriptions.map((item, i) => (
-    // eslint-disable-next-line react/no-array-index-key
+    <p key={`error-desc-${i}`} className={styles.text}>
-    <p key={i} className={styles.text}>
       {item}
     </p>
   ));
@@ -137,15 +136,17 @@ export const ErrorDetail: FC<ErrorDetailProps> = props => {
 
 export function ContactUS() {
   return (
-    <Trans>
+    <Trans
-      If you are still experiencing this issue, please{' '}
+      i18nKey="com.affine.error.contact-us"
+      components={{
+        1: (
           <a
             style={{ color: 'var(--affine-primary-color)' }}
             href="https://community.affine.pro"
             target="__blank"
-      >
+          />
-        contact us through the community.
+        ),
-      </a>
+      }}
-    </Trans>
+    />
   );
 }

packages/frontend/core/src/desktop/pages/workspace/detail-page/detail-page.tsx

@@ -1,20 +1,34 @@
 import { Scrollable } from '@affine/component';
-import { PageDetailSkeleton } from '@affine/component/page-detail-skeleton';
+import { PageDetailLoading } from '@affine/component/page-detail-skeleton';
 import type { ChatPanel } from '@affine/core/blocksuite/ai';
 import { AIProvider } from '@affine/core/blocksuite/ai';
 import type { AffineEditorContainer } from '@affine/core/blocksuite/block-suite-editor';
 import { EditorOutlineViewer } from '@affine/core/blocksuite/outline-viewer';
+import { AffineErrorBoundary } from '@affine/core/components/affine/affine-error-boundary';
 import { PageAIOnboarding } from '@affine/core/components/affine/ai-onboarding';
+import { GlobalPageHistoryModal } from '@affine/core/components/affine/page-history-modal';
 import { DocPropertySidebar } from '@affine/core/components/doc-properties/sidebar';
 import { useGuard } from '@affine/core/components/guard';
 import { useAppSettingHelper } from '@affine/core/components/hooks/affine/use-app-setting-helper';
 import { useEnableAI } from '@affine/core/components/hooks/affine/use-enable-ai';
+import { useRegisterBlocksuiteEditorCommands } from '@affine/core/components/hooks/affine/use-register-blocksuite-editor-commands';
+import { useActiveBlocksuiteEditor } from '@affine/core/components/hooks/use-block-suite-editor';
+import { PageDetailEditor } from '@affine/core/components/page-detail-editor';
+import { TrashPageFooter } from '@affine/core/components/pure/trash-page-footer';
+import { TopTip } from '@affine/core/components/top-tip';
 import { DocService } from '@affine/core/modules/doc';
 import { EditorService } from '@affine/core/modules/editor';
 import { GlobalContextService } from '@affine/core/modules/global-context';
 import { PeekViewService } from '@affine/core/modules/peek-view';
 import { RecentDocsService } from '@affine/core/modules/quicksearch';
-import { ViewService } from '@affine/core/modules/workbench';
+import {
+  useIsActiveView,
+  ViewBody,
+  ViewHeader,
+  ViewService,
+  ViewSidebarTab,
+  WorkbenchService,
+} from '@affine/core/modules/workbench';
 import { WorkspaceService } from '@affine/core/modules/workspace';
 import { isNewTabTrigger } from '@affine/core/utils';
 import track from '@affine/track';
@@ -39,20 +53,6 @@ import { memo, useCallback, useEffect, useRef, useState } from 'react';
 import { useParams } from 'react-router-dom';
 import type { Subscription } from 'rxjs';
 
-import { AffineErrorBoundary } from '../../../../components/affine/affine-error-boundary';
-import { GlobalPageHistoryModal } from '../../../../components/affine/page-history-modal';
-import { useRegisterBlocksuiteEditorCommands } from '../../../../components/hooks/affine/use-register-blocksuite-editor-commands';
-import { useActiveBlocksuiteEditor } from '../../../../components/hooks/use-block-suite-editor';
-import { PageDetailEditor } from '../../../../components/page-detail-editor';
-import { TrashPageFooter } from '../../../../components/pure/trash-page-footer';
-import { TopTip } from '../../../../components/top-tip';
-import {
-  useIsActiveView,
-  ViewBody,
-  ViewHeader,
-  ViewSidebarTab,
-  WorkbenchService,
-} from '../../../../modules/workbench';
 import { PageNotFound } from '../../404';
 import * as styles from './detail-page.css';
 import { DetailPageHeader } from './detail-page-header';
@@ -386,7 +386,7 @@ export const Component = () => {
     <DetailPageWrapper
       pageId={pageId}
       canAccess={canAccess}
-      skeleton={<PageDetailSkeleton />}
+      skeleton={<PageDetailLoading />}
       notFound={<PageNotFound noPermission />}
     >
       <DetailPageImpl />

packages/frontend/core/src/mobile/pages/workspace/detail/mobile-detail-page.tsx

@@ -1,5 +1,5 @@
 import { useThemeColorV2 } from '@affine/component';
-import { PageDetailSkeleton } from '@affine/component/page-detail-skeleton';
+import { PageDetailLoading } from '@affine/component/page-detail-skeleton';
 import type { AffineEditorContainer } from '@affine/core/blocksuite/block-suite-editor';
 import { AffineErrorBoundary } from '@affine/core/components/affine/affine-error-boundary';
 import { useGuard } from '@affine/core/components/guard';
@@ -223,7 +223,7 @@ const DetailPageImpl = () => {
 const getSkeleton = (back: boolean) => (
   <>
     <PageHeader back={back} className={styles.header} />
-    <PageDetailSkeleton />
+    <PageDetailLoading />
   </>
 );
 const getNotFound = (back: boolean) => (

packages/frontend/core/src/modules/peek-view/view/doc-preview/doc-peek-view.tsx

@@ -1,5 +1,5 @@
 import { Scrollable } from '@affine/component';
-import { PageDetailSkeleton } from '@affine/component/page-detail-skeleton';
+import { PageDetailLoading } from '@affine/component/page-detail-skeleton';
 import { AIProvider } from '@affine/core/blocksuite/ai';
 import type { AffineEditorContainer } from '@affine/core/blocksuite/block-suite-editor';
 import { EditorOutlineViewer } from '@affine/core/blocksuite/outline-viewer';
@@ -160,7 +160,7 @@ function DocPeekPreviewEditor({
         <Scrollable.Viewport
           className={clsx('affine-page-viewport', styles.affineDocViewport)}
         >
-          <Suspense fallback={<PageDetailSkeleton />}>
+          <Suspense fallback={<PageDetailLoading />}>
             <BlockSuiteEditor
               className={styles.editor}
               mode={mode}
@@ -224,7 +224,7 @@ export function DocPeekPreview({
   // if sync engine has been synced and the page is null, show 404 page.
   if (!doc || !editor || !canAccess) {
     return loading || canAccess === undefined ? (
-      <PageDetailSkeleton key="current-page-is-null" />
+      <PageDetailLoading key="current-page-is-null" />
     ) : (
       <PageNotFound noPermission />
     );

packages/frontend/i18n/src/i18n.gen.ts

@@ -1989,6 +1989,10 @@ export function useAFFiNEI18N(): {
       * `Doc content is missing`
       */
     ["com.affine.error.no-page-root.title"](): string;
+    /**
+      * `It takes longer to load the doc content.`
+      */
+    ["com.affine.error.loading-timeout-error"](): string;
     /**
       * `Refetch`
       */
@@ -2596,9 +2600,13 @@ export function useAFFiNEI18N(): {
       */
     ["com.affine.lastYear"](): string;
     /**
-      * `Loading...`
+      * `Loading`
       */
     ["com.affine.loading"](): string;
+    /**
+      * `Loading document content, please wait a moment.`
+      */
+    ["com.affine.loading.description"](): string;
     /**
       * `Rename`
       */
@@ -8417,6 +8425,12 @@ export const TypedTrans: {
     }, {
         ["2"]: JSX.Element;
     }>>;
+    /**
+      * `If you are still experiencing this issue, please <1>contact us through the community</1>.`
+      */
+    ["com.affine.error.contact-us"]: ComponentType<TypedTransProps<Readonly<{}>, {
+        ["1"]: JSX.Element;
+    }>>;
     /**
       * `With the workspace creator's free account, every member can access up to <1>7 days<1> of version history.`
       */

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

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "الشهر الماضي",
   "com.affine.lastWeek": "الأسبوع الماضي",
   "com.affine.lastYear": "العام الماضي",
-  "com.affine.loading": "جاري التحميل...",
+  "com.affine.loading": "جاري التحميل",
   "com.affine.menu.rename": "إعادة التسمية",
   "com.affine.mobile.search.empty": "لم يتم العثور على نتائج",
   "com.affine.mobile.setting.about.appVersion": "إصدار التطبيق",

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

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "Letzter Monat",
   "com.affine.lastWeek": "Letzte Woche",
   "com.affine.lastYear": "Letztes Jahr",
-  "com.affine.loading": "Laden...",
+  "com.affine.loading": "Laden",
   "com.affine.menu.rename": "Umbenennen",
   "com.affine.mobile.search.empty": "Keine Ergebnisse gefunden",
   "com.affine.mobile.setting.about.appVersion": "App-Version",

packages/frontend/i18n/src/resources/el-GR.json

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "Προηγούμενος μήνας",
   "com.affine.lastWeek": "Προηγούμενη εβδομάδα",
   "com.affine.lastYear": "Προηγούμενο έτος",
-  "com.affine.loading": "Φόρτωση...",
+  "com.affine.loading": "Φόρτωση",
   "com.affine.menu.rename": "Μετονομασία",
   "com.affine.mobile.search.empty": "Δεν βρέθηκαν αποτελέσματα",
   "com.affine.mobile.setting.about.appVersion": "Έκδοση εφαρμογής",

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

@@ -496,6 +496,8 @@
   "com.affine.enableAffineCloudModal.custom-server.enable": "Enable Cloud",
   "com.affine.error.hide-error": "Hide error",
   "com.affine.error.no-page-root.title": "Doc content is missing",
+  "com.affine.error.loading-timeout-error": "It takes longer to load the doc content.",
+  "com.affine.error.contact-us": "If you are still experiencing this issue, please <1>contact us through the community</1>.",
   "com.affine.error.refetch": "Refetch",
   "com.affine.error.reload": "Reload AFFiNE",
   "com.affine.error.retry": "Refresh",
@@ -647,7 +649,8 @@
   "com.affine.lastMonth": "Last month",
   "com.affine.lastWeek": "Last week",
   "com.affine.lastYear": "Last year",
-  "com.affine.loading": "Loading...",
+  "com.affine.loading": "Loading",
+  "com.affine.loading.description": "Loading document content, please wait a moment.",
   "com.affine.menu.rename": "Rename",
   "com.affine.mobile.search.empty": "No results found",
   "com.affine.mobile.setting.about.appVersion": "App version",

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

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "Mes pasado",
   "com.affine.lastWeek": "La semana pasada",
   "com.affine.lastYear": "El año pasado",
-  "com.affine.loading": "Cargando...",
+  "com.affine.loading": "Cargando",
   "com.affine.menu.rename": "Renombrar",
   "com.affine.mobile.search.empty": "No se encontraron resultados",
   "com.affine.mobile.setting.about.appVersion": "Versión de la Aplicación",

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

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "ماه گذشته",
   "com.affine.lastWeek": "هفته گذشته",
   "com.affine.lastYear": "سال گذشته",
-  "com.affine.loading": "در حال بارگذاری...",
+  "com.affine.loading": "در حال بارگذاری",
   "com.affine.menu.rename": "تغییر نام",
   "com.affine.mobile.search.empty": "نتیجه‌ای یافت نشد",
   "com.affine.mobile.setting.about.appVersion": "نسخه برنامه",

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

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "Le mois dernier",
   "com.affine.lastWeek": "La semaine dernière ",
   "com.affine.lastYear": "L'année dernière ",
-  "com.affine.loading": "Chargement...",
+  "com.affine.loading": "Chargement",
   "com.affine.menu.rename": "Renommer",
   "com.affine.mobile.search.empty": "Aucun résultat trouvé",
   "com.affine.mobile.setting.about.appVersion": "Version de l'application",

packages/frontend/i18n/src/resources/it-IT.json

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "Ultimo mese",
   "com.affine.lastWeek": "Ultima settimana",
   "com.affine.lastYear": "Ultimo anno",
-  "com.affine.loading": "Caricamento...",
+  "com.affine.loading": "Caricamento",
   "com.affine.menu.rename": "Rinomina",
   "com.affine.mobile.search.empty": "Nessun risultato trovato",
   "com.affine.mobile.setting.about.appVersion": "Versione dell'app",

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

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "先月",
   "com.affine.lastWeek": "先週",
   "com.affine.lastYear": "昨年",
-  "com.affine.loading": "読み込み中...",
+  "com.affine.loading": "読み込み中",
   "com.affine.menu.rename": "名前の変更",
   "com.affine.mobile.search.empty": "結果が見つかりません",
   "com.affine.mobile.setting.about.appVersion": "アプリ版",

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

@@ -809,7 +809,7 @@
   "com.affine.lastMonth": "지난 달",
   "com.affine.lastWeek": "지난 주",
   "com.affine.lastYear": "지난 해",
-  "com.affine.loading": "로딩...",
+  "com.affine.loading": "로딩",
   "com.affine.moreThan30Days": "한 달 이상",
   "com.affine.moveToTrash.confirmModal.description": "{{title}} 을(를) 휴지통으로 옮김",
   "com.affine.moveToTrash.confirmModal.description.multiple": "{{ number }} 페이지를 휴지통으로 옮김",

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

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "Ostatni miesiąc",
   "com.affine.lastWeek": "Ostatni tydzień",
   "com.affine.lastYear": "Ostatni rok",
-  "com.affine.loading": "Ładowanie...",
+  "com.affine.loading": "Ładowanie",
   "com.affine.menu.rename": "Zmień nazwę",
   "com.affine.mobile.search.empty": "Nie znaleziono wyników",
   "com.affine.mobile.setting.about.appVersion": "Wersja aplikacji",

packages/frontend/i18n/src/resources/pt-BR.json

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "Mês passado",
   "com.affine.lastWeek": "Semana passada",
   "com.affine.lastYear": "Ano passado",
-  "com.affine.loading": "Carregando...",
+  "com.affine.loading": "Carregando",
   "com.affine.menu.rename": "Renomear",
   "com.affine.mobile.search.empty": "Nenhum resultado encontrado",
   "com.affine.mobile.setting.about.appVersion": "Versão do aplicativo",

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

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "Последний месяц",
   "com.affine.lastWeek": "Прошлая неделя",
   "com.affine.lastYear": "Прошлый год",
-  "com.affine.loading": "Загрузка...",
+  "com.affine.loading": "Загрузка",
   "com.affine.menu.rename": "Переименовать",
   "com.affine.mobile.search.empty": "Не найдено результатов",
   "com.affine.mobile.setting.about.appVersion": "Версия приложения",

packages/frontend/i18n/src/resources/sv-SE.json

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "Senaste månaden",
   "com.affine.lastWeek": "Senaste veckan",
   "com.affine.lastYear": "Förra året",
-  "com.affine.loading": "Laddar...",
+  "com.affine.loading": "Laddar",
   "com.affine.menu.rename": "Döp om",
   "com.affine.mobile.search.empty": "Inga resultat hittades",
   "com.affine.mobile.setting.about.appVersion": "App Version",

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

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "Минулий місяць",
   "com.affine.lastWeek": "Минулий тиждень",
   "com.affine.lastYear": "Минулий рік",
-  "com.affine.loading": "Завантаження...",
+  "com.affine.loading": "Завантаження",
   "com.affine.menu.rename": "Перейменувати",
   "com.affine.mobile.search.empty": "Нічого не знайдено",
   "com.affine.mobile.setting.about.appVersion": "Версія додатка",

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

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "上个月",
   "com.affine.lastWeek": "上周",
   "com.affine.lastYear": "去年",
-  "com.affine.loading": "加载中...",
+  "com.affine.loading": "加载中",
   "com.affine.menu.rename": "重命名",
   "com.affine.mobile.search.empty": "找到 0 个结果",
   "com.affine.mobile.setting.about.appVersion": "应用版本",

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

@@ -642,7 +642,7 @@
   "com.affine.lastMonth": "上個月",
   "com.affine.lastWeek": "上個星期",
   "com.affine.lastYear": "去年",
-  "com.affine.loading": "載入中⋯⋯",
+  "com.affine.loading": "載入中",
   "com.affine.menu.rename": "重新命名",
   "com.affine.mobile.search.empty": "找到 0 個結果",
   "com.affine.mobile.setting.about.appVersion": "App 版本",

packages/frontend/track/src/events.ts

@@ -49,6 +49,7 @@ type DocEvents =
   | 'openDocOptionsMenu'
   | 'openDocInfo'
   | 'copyBlockToLink'
+  | 'loadDoc'
   | 'bookmark'
   | 'editProperty'
   | 'editPropertyMeta'
@@ -409,6 +410,9 @@ const PageEvents = {
     },
   },
   doc: {
+    $: {
+      $: ['loadDoc'],
+    },
     editor: {
       slashMenu: ['linkDoc', 'createDoc', 'bookmark'],
       atMenu: [
@@ -714,6 +718,12 @@ export type EventArgs = {
     type: 'member' | 'invite' | 'more';
   };
   noAccessPrompted: {};
+  loadDoc: {
+    workspaceId: string;
+    docId: string;
+    time: number;
+    success: boolean;
+  };
 };
 
 // for type checking