fix(core): listFloatingToolbar does not appear as expected (#7124)

close AFF-1201

packages/frontend/core/src/components/page-list/collections/virtualized-collection-list.tsx

@@ -98,8 +98,12 @@ export const VirtualizedCollectionList = ({
   }, []);
 
   const handleDelete = useCallback(() => {
-    return collectionService.deleteCollection(info, ...selectedCollectionIds);
+    if (selectedCollectionIds.length === 0) {
-  }, [collectionService, info, selectedCollectionIds]);
+      return;
+    }
+    collectionService.deleteCollection(info, ...selectedCollectionIds);
+    hideFloatingToolbar();
+  }, [collectionService, hideFloatingToolbar, info, selectedCollectionIds]);
 
   return (
     <>
@@ -123,7 +127,7 @@ export const VirtualizedCollectionList = ({
         headerRenderer={collectionHeaderRenderer}
       />
       <ListFloatingToolbar
-        open={showFloatingToolbar && selectedCollectionIds.length > 0}
+        open={showFloatingToolbar}
         content={
           <Trans
             i18nKey="com.affine.collection.toolbar.selected"

packages/frontend/core/src/components/page-list/docs/virtualized-page-list.tsx

@@ -132,6 +132,9 @@ export const VirtualizedPageList = ({
   const { setTrashModal } = useTrashModalHelper(currentWorkspace.docCollection);
 
   const handleMultiDelete = useCallback(() => {
+    if (filteredSelectedPageIds.length === 0) {
+      return;
+    }
     const pageNameMapping = Object.fromEntries(
       pageMetas.map(meta => [meta.id, meta.title])
     );
@@ -171,7 +174,7 @@ export const VirtualizedPageList = ({
         headerRenderer={pageHeaderRenderer}
       />
       <ListFloatingToolbar
-        open={showFloatingToolbar && filteredSelectedPageIds.length > 0}
+        open={showFloatingToolbar}
         onDelete={handleMultiDelete}
         onClose={hideFloatingToolbar}
         content={

packages/frontend/core/src/components/page-list/tags/virtualized-tag-list.tsx

@@ -69,6 +69,9 @@ export const VirtualizedTagList = ({
   }, []);
 
   const handleDelete = useCallback(() => {
+    if (selectedTagIds.length === 0) {
+      return;
+    }
     onTagDelete(selectedTagIds);
     hideFloatingToolbar();
     return;
@@ -97,7 +100,7 @@ export const VirtualizedTagList = ({
         headerRenderer={tagHeaderRenderer}
       />
       <ListFloatingToolbar
-        open={showFloatingToolbar && selectedTagIds.length > 0}
+        open={showFloatingToolbar}
         content={
           <Trans
             i18nKey="com.affine.tag.toolbar.selected"

packages/frontend/core/src/components/page-list/virtualized-trash-list.tsx

@@ -67,6 +67,9 @@ export const VirtualizedTrashList = () => {
   }, [filteredSelectedPageIds, hideFloatingToolbar, restoreFromTrash, t]);
 
   const onConfirmPermanentlyDelete = useCallback(() => {
+    if (filteredSelectedPageIds.length === 0) {
+      return;
+    }
     openConfirmModal({
       title: `${t['com.affine.trashOperation.deletePermanently']()}?`,
       description: t['com.affine.trashOperation.deleteDescription'](),
@@ -77,7 +80,7 @@ export const VirtualizedTrashList = () => {
       },
       onConfirm: handleMultiDelete,
     });
-  }, [handleMultiDelete, openConfirmModal, t]);
+  }, [filteredSelectedPageIds.length, handleMultiDelete, openConfirmModal, t]);
 
   const pageOperationsRenderer = useCallback(
     (item: ListItem) => {
@@ -129,7 +132,7 @@ export const VirtualizedTrashList = () => {
         onSelectedIdsChange={setSelectedPageIds}
       />
       <ListFloatingToolbar
-        open={showFloatingToolbar && filteredSelectedPageIds.length > 0}
+        open={showFloatingToolbar}
         onDelete={onConfirmPermanentlyDelete}
         onClose={hideFloatingToolbar}
         onRestore={handleMultiRestore}