fix: page blink issue on navigation (#3833)

This commit is contained in:
Peng Xiao
2023-08-19 00:45:21 +08:00
committed by GitHub
parent 0ae6c977aa
commit ba676eb937

View File

@@ -1,5 +1,8 @@
import { Content, displayFlex } from '@affine/component'; import { Content, displayFlex } from '@affine/component';
import { appSidebarResizingAtom } from '@affine/component/app-sidebar'; import {
AppSidebarFallback,
appSidebarResizingAtom,
} from '@affine/component/app-sidebar';
import { BlockHubWrapper } from '@affine/component/block-hub'; import { BlockHubWrapper } from '@affine/component/block-hub';
import { NotificationCenter } from '@affine/component/notification-center'; import { NotificationCenter } from '@affine/component/notification-center';
import type { DraggableTitleCellData } from '@affine/component/page-list'; import type { DraggableTitleCellData } from '@affine/component/page-list';
@@ -135,11 +138,9 @@ export const WorkspaceLayout = function WorkspacesSuspense({
</CurrentWorkspaceContext> </CurrentWorkspaceContext>
</Suspense> </Suspense>
<CurrentWorkspaceContext> <CurrentWorkspaceContext>
<Suspense fallback={<WorkspaceFallback />}> <Provider>
<Provider> <WorkspaceLayoutInner>{children}</WorkspaceLayoutInner>
<WorkspaceLayoutInner>{children}</WorkspaceLayoutInner> </Provider>
</Provider>
</Suspense>
</CurrentWorkspaceContext> </CurrentWorkspaceContext>
</> </>
); );
@@ -231,30 +232,34 @@ export const WorkspaceLayoutInner = ({ children }: PropsWithChildren) => {
onDragEnd={handleDragEnd} onDragEnd={handleDragEnd}
> >
<AppContainer resizing={resizing}> <AppContainer resizing={resizing}>
<RootAppSidebar <Suspense fallback={<AppSidebarFallback />}>
isPublicWorkspace={false} <RootAppSidebar
onOpenQuickSearchModal={handleOpenQuickSearchModal} isPublicWorkspace={false}
onOpenSettingModal={handleOpenSettingModal} onOpenQuickSearchModal={handleOpenQuickSearchModal}
currentWorkspace={currentWorkspace} onOpenSettingModal={handleOpenSettingModal}
onOpenWorkspaceListModal={handleOpenWorkspaceListModal} currentWorkspace={currentWorkspace}
openPage={useCallback( onOpenWorkspaceListModal={handleOpenWorkspaceListModal}
(pageId: string) => { openPage={useCallback(
assertExists(currentWorkspace); (pageId: string) => {
return openPage(currentWorkspace.id, pageId); assertExists(currentWorkspace);
}, return openPage(currentWorkspace.id, pageId);
[currentWorkspace, openPage] },
)} [currentWorkspace, openPage]
createPage={handleCreatePage} )}
currentPath={location.pathname.split('?')[0]} createPage={handleCreatePage}
paths={pathGenerator} currentPath={location.pathname.split('?')[0]}
/> paths={pathGenerator}
<MainContainer padding={appSetting.clientBorder}> />
{children} </Suspense>
<ToolContainer> <Suspense fallback={<MainContainer />}>
<BlockHubWrapper blockHubAtom={rootBlockHubAtom} /> <MainContainer padding={appSetting.clientBorder}>
<HelpIsland showList={pageId ? undefined : showList} /> {children}
</ToolContainer> <ToolContainer>
</MainContainer> <BlockHubWrapper blockHubAtom={rootBlockHubAtom} />
<HelpIsland showList={pageId ? undefined : showList} />
</ToolContainer>
</MainContainer>
</Suspense>
</AppContainer> </AppContainer>
<PageListTitleCellDragOverlay /> <PageListTitleCellDragOverlay />
</DndContext> </DndContext>