fix: page blink issue on navigation (#3833)

apps/core/src/layouts/workspace-layout.tsx

@@ -1,5 +1,8 @@
 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 { NotificationCenter } from '@affine/component/notification-center';
 import type { DraggableTitleCellData } from '@affine/component/page-list';
@@ -135,11 +138,9 @@ export const WorkspaceLayout = function WorkspacesSuspense({
         </CurrentWorkspaceContext>
       </Suspense>
       <CurrentWorkspaceContext>
-        <Suspense fallback={<WorkspaceFallback />}>
         <Provider>
           <WorkspaceLayoutInner>{children}</WorkspaceLayoutInner>
         </Provider>
-        </Suspense>
       </CurrentWorkspaceContext>
     </>
   );
@@ -231,6 +232,7 @@ export const WorkspaceLayoutInner = ({ children }: PropsWithChildren) => {
         onDragEnd={handleDragEnd}
       >
         <AppContainer resizing={resizing}>
+          <Suspense fallback={<AppSidebarFallback />}>
             <RootAppSidebar
               isPublicWorkspace={false}
               onOpenQuickSearchModal={handleOpenQuickSearchModal}
@@ -248,6 +250,8 @@ export const WorkspaceLayoutInner = ({ children }: PropsWithChildren) => {
               currentPath={location.pathname.split('?')[0]}
               paths={pathGenerator}
             />
+          </Suspense>
+          <Suspense fallback={<MainContainer />}>
             <MainContainer padding={appSetting.clientBorder}>
               {children}
               <ToolContainer>
@@ -255,6 +259,7 @@ export const WorkspaceLayoutInner = ({ children }: PropsWithChildren) => {
                 <HelpIsland showList={pageId ? undefined : showList} />
               </ToolContainer>
             </MainContainer>
+          </Suspense>
         </AppContainer>
         <PageListTitleCellDragOverlay />
       </DndContext>