Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-14 05:14:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: wrap React.lazy with Suspense (#1915)

Browse Source
This commit is contained in:
Himself65
2023-04-12 22:33:31 -05:00
committed by GitHub
parent 2bcda973d3
commit 6180a4c3cb
8 changed files with 138 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
apps/web/src/components/page-detail-editor.tsx
View File

@@ -5,7 +5,7 @@ import { useBlockSuiteWorkspacePageTitle } from '@toeverything/hooks/use-blocksu
import { useAtomValue, useSetAtom } from 'jotai';
import Head from 'next/head';
import type React from 'react';
import { lazy, startTransition, useCallback } from 'react';
import { lazy, startTransition, Suspense, useCallback } from 'react';
import { currentEditorAtom, workspacePreferredModeAtom } from '../atoms';
import { usePageMeta } from '../hooks/use-page-meta';
@@ -64,32 +64,34 @@ export const PageDetailEditor: React.FC<PageDetailEditorProps> = ({
>
{header}
</WorkspaceHeader>
<Editor
style={{
height: 'calc(100% - 52px)',
}}
key={pageId}
mode={isPublic ? 'page' : currentMode}
page={page}
onInit={useCallback(
(page: Page, editor: Readonly<EditorContainer>) => {
startTransition(() => {
setEditor(editor);
});
onInit(page, editor);
},
[onInit, setEditor]
)}
onLoad={useCallback(
(page: Page, editor: EditorContainer) => {
startTransition(() => {
setEditor(editor);
});
onLoad?.(page, editor);
},
[onLoad, setEditor]
)}
/>
<Suspense>
<Editor
style={{
height: 'calc(100% - 52px)',
}}
key={pageId}
mode={isPublic ? 'page' : currentMode}
page={page}
onInit={useCallback(
(page: Page, editor: Readonly<EditorContainer>) => {
startTransition(() => {
setEditor(editor);
});
onInit(page, editor);
},
[onInit, setEditor]
)}
onLoad={useCallback(
(page: Page, editor: EditorContainer) => {
startTransition(() => {
setEditor(editor);
});
onLoad?.(page, editor);
},
[onLoad, setEditor]
)}
/>
</Suspense>
</>
);
};

14
apps/web/src/components/pure/help-island/index.tsx
View File

@@ -2,7 +2,7 @@ import { MuiFade, Tooltip } from '@affine/component';
import { config } from '@affine/env';
import { useTranslation } from '@affine/i18n';
import { CloseIcon, NewIcon } from '@blocksuite/icons';
import { lazy, useState } from 'react';
import { lazy, Suspense, useState } from 'react';
import { ShortcutsModal } from '../shortcuts-modal';
import { ContactIcon, HelpIcon, KeyboardIcon } from './Icons';
@@ -113,11 +113,13 @@ export const HelpIsland = ({
</StyledTriggerWrapper>
</MuiFade>
</StyledIsland>
<ContactModal
open={open}
onClose={() => setOpen(false)}
logoSrc="/imgs/affine-text-logo.png"
/>
<Suspense>
<ContactModal
open={open}
onClose={() => setOpen(false)}
logoSrc="/imgs/affine-text-logo.png"
/>
</Suspense>
<ShortcutsModal
open={openShortCut}
onClose={() => setOpenShortCut(false)}