refactor: create collection (#3406)

apps/core/src/components/pure/workspace-slider-bar/collections/add-collection-button.tsx

@@ -3,11 +3,12 @@ import {
   EditCollectionModel,
   useCollectionManager,
 } from '@affine/component/page-list';
+import type { Collection } from '@affine/env/filter';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { PlusIcon } from '@blocksuite/icons';
 import type { Workspace } from '@blocksuite/store';
 import { uuidv4 } from '@blocksuite/store';
-import { useState } from 'react';
+import { useCallback, useState } from 'react';
 
 import { useGetPageInfoById } from '../../../../hooks/use-get-page-info';
 
@@ -22,18 +23,23 @@ export const AddCollectionButton = ({
   const setting = useCollectionManager(workspace.id);
   const t = useAFFiNEI18N();
   const [show, showUpdateCollection] = useState(false);
-  const defaultCollection = {
-    id: uuidv4(),
-    name: '',
-    pinned: true,
-    filterList: [],
-    workspaceId: workspace.id,
-  };
+  const [defaultCollection, setDefaultCollection] = useState<Collection>();
+  const handleClick = useCallback(() => {
+    showUpdateCollection(true);
+    setDefaultCollection({
+      id: uuidv4(),
+      name: '',
+      pinned: true,
+      filterList: [],
+      workspaceId: workspace.id,
+    });
+  }, [showUpdateCollection, workspace.id]);
+
   return (
     <>
       <IconButton
         data-testid="slider-bar-add-collection-button"
-        onClick={() => showUpdateCollection(true)}
+        onClick={handleClick}
         size="small"
       >
         <PlusIcon />

apps/core/src/components/workspace-header.tsx

@@ -9,7 +9,6 @@ import type { WorkspaceHeaderProps } from '@affine/env/workspace';
 import { WorkspaceFlavour, WorkspaceSubPath } from '@affine/env/workspace';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { SettingsIcon } from '@blocksuite/icons';
-import { uuidv4 } from '@blocksuite/store';
 import type { ReactElement } from 'react';
 import { useCallback } from 'react';
 
@@ -71,13 +70,9 @@ export function WorkspaceHeader({
                     currentWorkspace.blockSuiteWorkspace.meta.properties
                   }
                   getPageInfo={getPageInfoById}
-                  init={{
-                    id: uuidv4(),
-                    name: '',
-                    filterList: setting.currentCollection.filterList,
-                    workspaceId: currentWorkspaceId,
-                  }}
                   onConfirm={saveToCollection}
+                  filterList={setting.currentCollection.filterList}
+                  workspaceId={currentWorkspaceId}
                 ></SaveCollectionButton>
               ) : null}
             </div>