chore: bump version (#1313)

apps/web/src/components/affine/workspace-setting-detail/panel/general/index.tsx

@@ -125,7 +125,7 @@ export const GeneralPanel: React.FC<PanelProps> = ({
                   shape="circle"
                   style={{ marginLeft: '24px' }}
                   onClick={() => {
-                    setInput(workspace.blockSuiteWorkspace.meta.name);
+                    setInput(workspace.blockSuiteWorkspace.meta.name ?? '');
                     setShowEditInput(false);
                   }}
                 >

apps/web/src/components/pure/footer/index.tsx

@@ -67,8 +67,8 @@ export const Footer: React.FC<FooterProps> = ({ user, onLogin, onLogout }) => {
 
 interface WorkspaceAvatarProps {
   size: number;
-  name: string;
-  avatar: string;
+  name: string | undefined;
+  avatar: string | undefined;
   style?: CSSProperties;
 }
 

apps/web/src/components/pure/workspace-avatar/index.tsx

@@ -1,5 +1,7 @@
+import { UNTITLED_WORKSPACE_NAME } from '@affine/env';
 import React from 'react';
 
+import { useBlockSuiteWorkspaceAvatar } from '../../../hooks/use-blocksuite-workspace-avatar';
 import { useWorkspaceBlobImage } from '../../../hooks/use-workspace-blob';
 import { BlockSuiteWorkspace, RemWorkspace } from '../../../shared';
 import { stringToColour } from '../../../utils';
@@ -86,12 +88,13 @@ export const BlockSuiteWorkspaceAvatar: React.FC<BlockSuiteWorkspaceAvatar> = ({
   style,
   ...props
 }) => {
-  const avatarURL = useWorkspaceBlobImage(workspace.meta.avatar, workspace);
+  const [avatar] = useBlockSuiteWorkspaceAvatar(workspace);
+  const avatarURL = useWorkspaceBlobImage(avatar ?? null, workspace);
   return (
     <Avatar
       {...props}
       size={size}
-      name={workspace.meta.name}
+      name={workspace.meta.name ?? UNTITLED_WORKSPACE_NAME}
       avatar_url={avatarURL ?? ''}
       style={style}
     />

apps/web/src/hooks/use-blocksuite-workspace-avatar.ts

@@ -0,0 +1,32 @@
+import { assertExists } from '@blocksuite/store';
+import { useCallback, useEffect, useState } from 'react';
+
+import { BlockSuiteWorkspace } from '../shared';
+
+export function useBlockSuiteWorkspaceAvatar(
+  blockSuiteWorkspace: BlockSuiteWorkspace | null
+) {
+  const [avatar, set] = useState<string | undefined>(
+    () => blockSuiteWorkspace?.meta.avatar
+  );
+  useEffect(() => {
+    if (blockSuiteWorkspace) {
+      set(blockSuiteWorkspace.meta.avatar);
+      const dispose = blockSuiteWorkspace.meta.commonFieldsUpdated.on(() => {
+        set(blockSuiteWorkspace.meta.avatar);
+      });
+      return () => {
+        dispose.dispose();
+      };
+    }
+  }, [blockSuiteWorkspace]);
+  const setAvatar = useCallback(
+    (avatar: string) => {
+      assertExists(blockSuiteWorkspace);
+      blockSuiteWorkspace.meta.setAvatar(avatar);
+      set(avatar);
+    },
+    [blockSuiteWorkspace]
+  );
+  return [avatar, setAvatar] as const;
+}

apps/web/src/hooks/use-blocksuite-workspace-name.ts

@@ -10,16 +10,11 @@ export function useBlockSuiteWorkspaceName(
   const [name, set] = useState(
     () => blockSuiteWorkspace?.meta.name ?? DEFAULT_WORKSPACE_NAME
   );
-  if (blockSuiteWorkspace) {
-    if (blockSuiteWorkspace.meta.name !== name) {
-      set(blockSuiteWorkspace.meta.name);
-    }
-  }
   useEffect(() => {
     if (blockSuiteWorkspace) {
-      set(blockSuiteWorkspace.meta.name);
+      set(blockSuiteWorkspace.meta.name ?? '');
       const dispose = blockSuiteWorkspace.meta.commonFieldsUpdated.on(() => {
-        set(blockSuiteWorkspace.meta.name);
+        set(blockSuiteWorkspace.meta.name ?? '');
       });
       return () => {
         dispose.dispose();

apps/web/src/hooks/use-workspace-blob.ts

@@ -16,13 +16,17 @@ export function useWorkspaceBlob(
 }
 
 export function useWorkspaceBlobImage(
-  key: string,
+  key: string | null,
   blockSuiteWorkspace: BlockSuiteWorkspace
 ) {
   const blobStorage = useWorkspaceBlob(blockSuiteWorkspace);
   const [imageURL, setImageURL] = useState<string | null>(null);
   useEffect(() => {
     const controller = new AbortController();
+    if (key === null) {
+      setImageURL(null);
+      return;
+    }
     blobStorage?.get(key).then(blob => {
       if (controller.signal.aborted) {
         return;