From 4624a4923dcce3abaf7ce399a5b7f19be7153469 Mon Sep 17 00:00:00 2001
From: JimmFly <447268514@qq.com>
Date: Tue, 2 Apr 2024 08:35:26 +0000
Subject: [PATCH] feat(core): add favorite operation to all collection (#6428)
https://github.com/toeverything/AFFiNE/assets/102217452/d90553aa-6076-4ecc-996b-a8398991982a
---
.../core/src/components/page-list/list.css.ts | 10 +--
.../components/page-list/operation-cell.tsx | 65 +++++++++++++++----
2 files changed, 59 insertions(+), 16 deletions(-)
diff --git a/packages/frontend/core/src/components/page-list/list.css.ts b/packages/frontend/core/src/components/page-list/list.css.ts
index 6b0af3dc62..82310a8c78 100644
--- a/packages/frontend/core/src/components/page-list/list.css.ts
+++ b/packages/frontend/core/src/components/page-list/list.css.ts
@@ -1,7 +1,8 @@
import { cssVar } from '@toeverything/theme';
import { createContainer, style } from '@vanilla-extract/css';
-import * as itemStyles from './docs/page-list-item.css';
+import { root as collectionItemRoot } from './collections/collection-list-item.css';
+import { root as pageItemRoot } from './docs/page-list-item.css';
export const listRootContainer = createContainer('list-root-container');
export const pageListScrollContainer = style({
width: '100%',
@@ -48,9 +49,10 @@ export const favoriteCell = style({
flexShrink: 0,
opacity: 0,
selectors: {
- [`&[data-favorite], ${itemStyles.root}:hover &`]: {
- opacity: 1,
- },
+ [`&[data-favorite], ${pageItemRoot}:hover &, ${collectionItemRoot}:hover &`]:
+ {
+ opacity: 1,
+ },
},
});
export const clearLinkStyle = style({
diff --git a/packages/frontend/core/src/components/page-list/operation-cell.tsx b/packages/frontend/core/src/components/page-list/operation-cell.tsx
index acc18c6037..0954655473 100644
--- a/packages/frontend/core/src/components/page-list/operation-cell.tsx
+++ b/packages/frontend/core/src/components/page-list/operation-cell.tsx
@@ -285,6 +285,10 @@ export const CollectionOperationCell = ({
info,
}: CollectionOperationCellProps) => {
const t = useAFFiNEI18N();
+ const favAdapter = useService(FavoriteItemsAdapter);
+ const favourite = useLiveData(
+ favAdapter.isFavorite$(collection.id, 'collection')
+ );
const { open: openEditCollectionModal, node: editModal } =
useEditCollection(config);
@@ -322,10 +326,28 @@ export const CollectionOperationCell = ({
return service.deleteCollection(info, collection.id);
}, [service, info, collection]);
+ const onToggleFavoriteCollection = useCallback(() => {
+ const status = favAdapter.isFavorite(collection.id, 'collection');
+ favAdapter.toggle(collection.id, 'collection');
+ toast(
+ status
+ ? t['com.affine.toastMessage.removedFavorites']()
+ : t['com.affine.toastMessage.addedFavorites']()
+ );
+ }, [favAdapter, collection.id, t]);
+
return (
<>
{editModal}
{editNameModal}
+
+
+
@@ -336,21 +358,40 @@ export const CollectionOperationCell = ({
-