mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-02-14 21:27:20 +00:00
fix: wrap React.lazy with Suspense (#1915)
This commit is contained in:
@@ -3,7 +3,7 @@ import { arrayMove } from '@dnd-kit/sortable';
|
||||
import { useAtom, useAtomValue, useSetAtom } from 'jotai';
|
||||
import { useRouter } from 'next/router';
|
||||
import type React from 'react';
|
||||
import { lazy, useCallback, useTransition } from 'react';
|
||||
import { lazy, Suspense, useCallback, useTransition } from 'react';
|
||||
|
||||
import {
|
||||
currentWorkspaceIdAtom,
|
||||
@@ -49,71 +49,75 @@ export function Modals() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<WorkspaceListModal
|
||||
disabled={transitioning}
|
||||
user={user}
|
||||
workspaces={workspaces}
|
||||
currentWorkspaceId={currentWorkspaceId}
|
||||
open={openWorkspacesModal || workspaces.length === 0}
|
||||
onClose={useCallback(() => {
|
||||
setOpenWorkspacesModal(false);
|
||||
}, [setOpenWorkspacesModal])}
|
||||
onMoveWorkspace={useCallback(
|
||||
(activeId, overId) => {
|
||||
const oldIndex = workspaces.findIndex(w => w.id === activeId);
|
||||
const newIndex = workspaces.findIndex(w => w.id === overId);
|
||||
transition(() =>
|
||||
setWorkspaces(workspaces =>
|
||||
arrayMove(workspaces, oldIndex, newIndex)
|
||||
)
|
||||
);
|
||||
},
|
||||
[setWorkspaces, workspaces]
|
||||
)}
|
||||
onClickWorkspace={useCallback(
|
||||
workspace => {
|
||||
<Suspense>
|
||||
<WorkspaceListModal
|
||||
disabled={transitioning}
|
||||
user={user}
|
||||
workspaces={workspaces}
|
||||
currentWorkspaceId={currentWorkspaceId}
|
||||
open={openWorkspacesModal || workspaces.length === 0}
|
||||
onClose={useCallback(() => {
|
||||
setOpenWorkspacesModal(false);
|
||||
setCurrentWorkspace(workspace.id);
|
||||
jumpToSubPath(workspace.id, WorkspaceSubPath.ALL);
|
||||
},
|
||||
[jumpToSubPath, setCurrentWorkspace, setOpenWorkspacesModal]
|
||||
)}
|
||||
onClickWorkspaceSetting={useCallback(
|
||||
workspace => {
|
||||
setOpenWorkspacesModal(false);
|
||||
setCurrentWorkspace(workspace.id);
|
||||
jumpToSubPath(workspace.id, WorkspaceSubPath.SETTING);
|
||||
},
|
||||
[jumpToSubPath, setCurrentWorkspace, setOpenWorkspacesModal]
|
||||
)}
|
||||
onClickLogin={useAffineLogIn()}
|
||||
onClickLogout={useAffineLogOut()}
|
||||
onCreateWorkspace={useCallback(() => {
|
||||
setOpenCreateWorkspaceModal(true);
|
||||
}, [setOpenCreateWorkspaceModal])}
|
||||
/>
|
||||
<CreateWorkspaceModal
|
||||
open={openCreateWorkspaceModal}
|
||||
onClose={useCallback(() => {
|
||||
setOpenCreateWorkspaceModal(false);
|
||||
}, [setOpenCreateWorkspaceModal])}
|
||||
onCreate={useCallback(
|
||||
async name => {
|
||||
const id = await createLocalWorkspace(name);
|
||||
}, [setOpenWorkspacesModal])}
|
||||
onMoveWorkspace={useCallback(
|
||||
(activeId, overId) => {
|
||||
const oldIndex = workspaces.findIndex(w => w.id === activeId);
|
||||
const newIndex = workspaces.findIndex(w => w.id === overId);
|
||||
transition(() =>
|
||||
setWorkspaces(workspaces =>
|
||||
arrayMove(workspaces, oldIndex, newIndex)
|
||||
)
|
||||
);
|
||||
},
|
||||
[setWorkspaces, workspaces]
|
||||
)}
|
||||
onClickWorkspace={useCallback(
|
||||
workspace => {
|
||||
setOpenWorkspacesModal(false);
|
||||
setCurrentWorkspace(workspace.id);
|
||||
jumpToSubPath(workspace.id, WorkspaceSubPath.ALL);
|
||||
},
|
||||
[jumpToSubPath, setCurrentWorkspace, setOpenWorkspacesModal]
|
||||
)}
|
||||
onClickWorkspaceSetting={useCallback(
|
||||
workspace => {
|
||||
setOpenWorkspacesModal(false);
|
||||
setCurrentWorkspace(workspace.id);
|
||||
jumpToSubPath(workspace.id, WorkspaceSubPath.SETTING);
|
||||
},
|
||||
[jumpToSubPath, setCurrentWorkspace, setOpenWorkspacesModal]
|
||||
)}
|
||||
onClickLogin={useAffineLogIn()}
|
||||
onClickLogout={useAffineLogOut()}
|
||||
onCreateWorkspace={useCallback(() => {
|
||||
setOpenCreateWorkspaceModal(true);
|
||||
}, [setOpenCreateWorkspaceModal])}
|
||||
/>
|
||||
</Suspense>
|
||||
<Suspense>
|
||||
<CreateWorkspaceModal
|
||||
open={openCreateWorkspaceModal}
|
||||
onClose={useCallback(() => {
|
||||
setOpenCreateWorkspaceModal(false);
|
||||
setOpenWorkspacesModal(false);
|
||||
setCurrentWorkspace(id);
|
||||
return jumpToSubPath(id, WorkspaceSubPath.ALL);
|
||||
},
|
||||
[
|
||||
createLocalWorkspace,
|
||||
jumpToSubPath,
|
||||
setCurrentWorkspace,
|
||||
setOpenCreateWorkspaceModal,
|
||||
setOpenWorkspacesModal,
|
||||
]
|
||||
)}
|
||||
/>
|
||||
}, [setOpenCreateWorkspaceModal])}
|
||||
onCreate={useCallback(
|
||||
async name => {
|
||||
const id = await createLocalWorkspace(name);
|
||||
setOpenCreateWorkspaceModal(false);
|
||||
setOpenWorkspacesModal(false);
|
||||
setCurrentWorkspace(id);
|
||||
return jumpToSubPath(id, WorkspaceSubPath.ALL);
|
||||
},
|
||||
[
|
||||
createLocalWorkspace,
|
||||
jumpToSubPath,
|
||||
setCurrentWorkspace,
|
||||
setOpenCreateWorkspaceModal,
|
||||
setOpenWorkspacesModal,
|
||||
]
|
||||
)}
|
||||
/>
|
||||
</Suspense>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user