diff --git a/packages/component/src/components/page-list/view/collection-bar.tsx b/packages/component/src/components/page-list/view/collection-bar.tsx index 322816c0c1..ae0d2aa882 100644 --- a/packages/component/src/components/page-list/view/collection-bar.tsx +++ b/packages/component/src/components/page-list/view/collection-bar.tsx @@ -19,26 +19,28 @@ import { Button } from '../../../ui/button/button'; import { useCollectionManager } from '../use-collection-manager'; import * as styles from './collection-bar.css'; -export const CollectionBar = ({ - getPageInfo, - propertiesMeta, - columnsCount, - workspaceId, -}: { +interface CollectionBarProps { getPageInfo: GetPageInfoById; propertiesMeta: PropertiesMeta; columnsCount: number; workspaceId: string; -}) => { +} + +interface CollectionBarAction { + icon: ReactNode; + click: () => void; + className?: string; + name: string; + tooltip: string; +} + +export const CollectionBar = (props: CollectionBarProps) => { + const { getPageInfo, propertiesMeta, columnsCount, workspaceId } = props; + const t = useAFFiNEI18N(); const setting = useCollectionManager(workspaceId); const collection = setting.currentCollection; const [open, setOpen] = useState(false); - const actions: { - icon: ReactNode; - click: () => void; - className?: string; - name: string; - }[] = useMemo( + const actions = useMemo( () => [ { icon: ( @@ -56,6 +58,9 @@ export const CollectionBar = ({ ), name: 'pin', + tooltip: collection.pinned + ? t['com.affine.collection-bar.action.tooltip.unpin']() + : t['com.affine.collection-bar.action.tooltip.pin'](), className: styles.pin, click: () => { return setting.updateCollection({ @@ -67,6 +72,7 @@ export const CollectionBar = ({ { icon: , name: 'edit', + tooltip: t['com.affine.collection-bar.action.tooltip.edit'](), click: () => { setOpen(true); }, @@ -74,6 +80,7 @@ export const CollectionBar = ({ { icon: , name: 'delete', + tooltip: t['com.affine.collection-bar.action.tooltip.delete'](), click: () => { setting.deleteCollection(collection.id).catch(err => { console.error(err); @@ -81,10 +88,10 @@ export const CollectionBar = ({ }, }, ], - [setting, collection] + [collection, t, setting] ); const onClose = useCallback(() => setOpen(false), []); - const t = useAFFiNEI18N(); + return !setting.isDefault ? ( @@ -120,14 +127,19 @@ export const CollectionBar = ({ {actions.map(action => { return ( -
- {action.icon} -
+
+ {action.icon} +
+ ); })} diff --git a/packages/i18n/src/resources/en.json b/packages/i18n/src/resources/en.json index c74d5d0b1f..dcbc24a8f2 100644 --- a/packages/i18n/src/resources/en.json +++ b/packages/i18n/src/resources/en.json @@ -374,6 +374,10 @@ "Collections": "Collections", "Save As New Collection": "Save As New Collection", "Update Collection": "Update Collection", + "com.affine.collection-bar.action.tooltip.pin": "Pin to Sidebar", + "com.affine.collection-bar.action.tooltip.unpin": "Unpin", + "com.affine.collection-bar.action.tooltip.edit": "Edit", + "com.affine.collection-bar.action.tooltip.delete": "Delete", "Back to all": "Back to all", "Edit Filter": "Edit Filter", "Unpin": "Unpin", diff --git a/packages/i18n/src/resources/zh-Hans.json b/packages/i18n/src/resources/zh-Hans.json index 8c3389c704..29883aa907 100644 --- a/packages/i18n/src/resources/zh-Hans.json +++ b/packages/i18n/src/resources/zh-Hans.json @@ -404,5 +404,9 @@ "com.affine.settings.workspace.remove.message": "从此设备中删除工作区,并可选择删除所有数据。", "com.affine.settings.appearance.sidebar.noise": "侧边栏的噪点背景", "com.affine.settings.appearance.sidebar.translucent": "侧边栏的透明效果", - "com.affine.settings.appearance.sidebar.translucent.message": "在侧边栏使用半透明效果。" + "com.affine.settings.appearance.sidebar.translucent.message": "在侧边栏使用半透明效果。", + "com.affine.collection-bar.action.tooltip.pin": "固定到侧边栏", + "com.affine.collection-bar.action.tooltip.unpin": "取消固定", + "com.affine.collection-bar.action.tooltip.edit": "编辑", + "com.affine.collection-bar.action.tooltip.delete": "删除" }