diff --git a/packages/app/src/components/header/header.tsx b/packages/app/src/components/header/header.tsx
index 82f0558ae9..1287ff72d6 100644
--- a/packages/app/src/components/header/header.tsx
+++ b/packages/app/src/components/header/header.tsx
@@ -37,10 +37,10 @@ type HeaderRightItemNames =
   | 'syncUser';
 
 const HeaderRightItems: Record<HeaderRightItemNames, ReactNode> = {
-  editorOptionMenu: <EditorOptionMenu />,
-  trashButtonGroup: <TrashButtonGroup />,
-  themeModeSwitch: <ThemeModeSwitch />,
-  syncUser: <SyncUser />,
+  editorOptionMenu: <EditorOptionMenu key="editorOptionMenu" />,
+  trashButtonGroup: <TrashButtonGroup key="trashButtonGroup" />,
+  themeModeSwitch: <ThemeModeSwitch key="themeModeSwitch" />,
+  syncUser: <SyncUser key="syncUser" />,
 };
 
 export const Header = ({
diff --git a/packages/app/src/components/workspace-slider-bar/index.tsx b/packages/app/src/components/workspace-slider-bar/index.tsx
index fe2492451a..ea9cee1636 100644
--- a/packages/app/src/components/workspace-slider-bar/index.tsx
+++ b/packages/app/src/components/workspace-slider-bar/index.tsx
@@ -74,6 +74,15 @@ export const WorkSpaceSliderBar = () => {
   const [showTip, setShowTip] = useState(false);
   const [show, setShow] = useLocalStorage('AFFINE_SLIDE_BAR', false, true);
   const { t } = useTranslation();
+
+  const paths = {
+    all: currentWorkspaceId ? `/workspace/${currentWorkspaceId}/all` : '',
+    favorite: currentWorkspaceId
+      ? `/workspace/${currentWorkspaceId}/favorite`
+      : '',
+    trash: currentWorkspaceId ? `/workspace/${currentWorkspaceId}/trash` : '',
+  };
+
   return (
     <>
       <StyledSliderBar show={show}>
@@ -88,21 +97,13 @@ export const WorkSpaceSliderBar = () => {
         >
           <SearchIcon /> Quick search
         </StyledListItem>
-        <Link href={{ pathname: `/workspace/${currentWorkspaceId}/all` }}>
-          <StyledListItem
-            active={router.pathname === `/workspace/${currentWorkspaceId}/all`}
-          >
+        <Link href={{ pathname: paths.all }}>
+          <StyledListItem active={router.pathname === paths.all}>
             <AllPagesIcon /> <span>All pages</span>
           </StyledListItem>
         </Link>
-        <StyledListItem
-          active={
-            router.pathname === `/workspace/${currentWorkspaceId}/favorite`
-          }
-        >
-          <StyledLink
-            href={{ pathname: `/workspace/${currentWorkspaceId}/favorite` }}
-          >
+        <StyledListItem active={router.pathname === paths.favorite}>
+          <StyledLink href={{ pathname: paths.favorite }}>
             <FavouritesIcon />
             Favourites
           </StyledLink>
@@ -132,12 +133,8 @@ export const WorkSpaceSliderBar = () => {
           </StyledListItem>
         </Tooltip>
 
-        <Link href={{ pathname: `/workspace/${currentWorkspaceId}/trash` }}>
-          <StyledListItem
-            active={
-              router.pathname === `/workspace/${currentWorkspaceId}/trash`
-            }
-          >
+        <Link href={{ pathname: paths.trash }}>
+          <StyledListItem active={router.pathname === paths.trash}>
             <TrashIcon /> Trash
           </StyledListItem>
         </Link>
diff --git a/packages/app/src/components/workspace-slider-bar/style.ts b/packages/app/src/components/workspace-slider-bar/style.ts
index 064590e93d..acc936f7ea 100644
--- a/packages/app/src/components/workspace-slider-bar/style.ts
+++ b/packages/app/src/components/workspace-slider-bar/style.ts
@@ -43,7 +43,7 @@ export const StyledArrowButton = styled.button<{ isShow: boolean }>(
   }
 );
 
-export const StyledListItem = styled.button<{
+export const StyledListItem = styled.div<{
   active?: boolean;
   disabled?: boolean;
 }>(({ theme, active, disabled }) => {
diff --git a/packages/app/src/pages/workspace/index.tsx b/packages/app/src/pages/workspace/index.tsx
new file mode 100644
index 0000000000..1f7dd2d518
--- /dev/null
+++ b/packages/app/src/pages/workspace/index.tsx
@@ -0,0 +1,5 @@
+const Page = () => {
+  return <div>Hello, there is [workspace]/index.</div>;
+};
+
+export default Page;
diff --git a/packages/app/src/providers/app-state-provider/dynamic-blocksuite.tsx b/packages/app/src/providers/app-state-provider/dynamic-blocksuite.tsx
index e7d8447b3f..c2a803e529 100644
--- a/packages/app/src/providers/app-state-provider/dynamic-blocksuite.tsx
+++ b/packages/app/src/providers/app-state-provider/dynamic-blocksuite.tsx
@@ -91,10 +91,13 @@ const DynamicBlocksuite = ({
         if (indexDBProvider) {
           (indexDBProvider as IndexedDBDocProvider)?.on('synced', async () => {
             const updates = await downloadWorkspace({ workspaceId });
-            updates &&
+
+            if (updates.byteLength) {
               Workspace.Y.applyUpdate(workspace.doc, new Uint8Array(updates));
-            // if after update, the space:meta is empty, then we need to get map with doc
-            workspace.doc.getMap('space:meta');
+              // if after update, the space:meta is empty, then we need to get map with doc
+              workspace.doc.getMap('space:meta');
+            }
+
             resolve(workspace);
           });
         } else {