> =
},
});
+const defaultCollection = {
+ id: NIL,
+ name: 'All',
+ filterList: [],
+};
const collectionAtom = atomWithReset<{
currentId: string;
defaultCollection: Collection;
}>({
currentId: NIL,
- defaultCollection: {
- id: NIL,
- name: 'All',
- filterList: [],
- },
+ defaultCollection: defaultCollection,
});
export const useSavedCollections = () => {
@@ -102,7 +103,7 @@ export const useSavedCollections = () => {
};
};
-export const useAllPageSetting = () => {
+export const useCollectionManager = () => {
const { savedCollections, saveCollection, deleteCollection, addPage } =
useSavedCollections();
const [collectionData, setCollectionData] = useAtom(collectionAtom);
@@ -132,6 +133,18 @@ export const useAllPageSetting = () => {
const backToAll = useCallback(() => {
setCollectionData(RESET);
}, [setCollectionData]);
+ const setTemporaryFilter = useCallback(
+ (filterList: Filter[]) => {
+ setCollectionData({
+ currentId: NIL,
+ defaultCollection: {
+ ...defaultCollection,
+ filterList: filterList,
+ },
+ });
+ },
+ [setCollectionData]
+ );
const currentCollection =
collectionData.currentId === NIL
? collectionData.defaultCollection
@@ -149,6 +162,7 @@ export const useAllPageSetting = () => {
backToAll,
deleteCollection,
addPage,
+ setTemporaryFilter,
};
};
export const filterByFilterList = (filterList: Filter[], varMap: VariableMap) =>
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 f26b50c8b7..2634ef9844 100644
--- a/packages/component/src/components/page-list/view/collection-bar.tsx
+++ b/packages/component/src/components/page-list/view/collection-bar.tsx
@@ -1,4 +1,5 @@
import { EditCollectionModel } from '@affine/component/page-list';
+import type { PropertiesMeta } from '@affine/env/filter';
import type { GetPageInfoById } from '@affine/env/page-info';
import {
DeleteIcon,
@@ -13,15 +14,19 @@ import type { ReactNode } from 'react';
import { useCallback, useMemo, useState } from 'react';
import { Button } from '../../../ui/button/button';
-import { useAllPageSetting } from '../use-all-page-setting';
+import { useCollectionManager } from '../use-collection-manager';
import * as styles from './collection-bar.css';
export const CollectionBar = ({
getPageInfo,
+ propertiesMeta,
+ columnsCount,
}: {
getPageInfo: GetPageInfoById;
+ propertiesMeta: PropertiesMeta;
+ columnsCount: number;
}) => {
- const setting = useAllPageSetting();
+ const setting = useCollectionManager();
const collection = setting.currentCollection;
const [open, setOpen] = useState(false);
const actions: {
@@ -80,6 +85,7 @@ export const CollectionBar = ({
|
|
- |
- |
+ {Array.from({ length: columnsCount - 2 }).map((_, i) => (
+ |
+ ))}
;
+ setting: ReturnType;
updateCollection: (view: Collection) => void;
}) => {
const actions: {
@@ -118,9 +119,11 @@ const CollectionOption = ({
export const CollectionList = ({
setting,
getPageInfo,
+ propertiesMeta,
}: {
- setting: ReturnType;
+ setting: ReturnType;
getPageInfo: GetPageInfoById;
+ propertiesMeta: PropertiesMeta;
}) => {
const t = useAFFiNEI18N();
const [open] = useAtom(appSidebarOpenAtom);
@@ -205,6 +208,7 @@ export const CollectionList = ({
placement="bottom-start"
content={
@@ -221,6 +225,7 @@ export const CollectionList = ({
void;
onConfirmText?: string;
getPageInfo: GetPageInfoById;
+ propertiesMeta: PropertiesMeta;
};
export const EditCollectionModel = ({
init,
@@ -32,12 +34,14 @@ export const EditCollectionModel = ({
open,
onClose,
getPageInfo,
+ propertiesMeta,
}: {
init?: Collection;
onConfirm: (view: Collection) => void;
open: boolean;
onClose: () => void;
getPageInfo: GetPageInfoById;
+ propertiesMeta: PropertiesMeta;
}) => {
return (
@@ -56,6 +60,7 @@ export const EditCollectionModel = ({
/>
{init ? (
void;
}) => {
@@ -189,6 +195,7 @@ export const EditCollection = ({
>
Filters
onChange({
@@ -262,6 +269,7 @@ export const SaveCollectionButton = ({
init,
onConfirm,
getPageInfo,
+ propertiesMeta,
}: CreateCollectionProps) => {
const [show, changeShow] = useState(false);
return (
@@ -280,6 +288,7 @@ export const SaveCollectionButton = ({
{
await selectMonthFromMonthPicker(page, nextMonth);
await checkDatePickerMonth(page, nextMonth);
});
+const createTag = async (page: Page, name: string) => {
+ await page.keyboard.type(name);
+ await page.keyboard.press('ArrowUp');
+ await page.keyboard.press('Enter');
+};
+const createPageWithTag = async (
+ page: Page,
+ options: {
+ title: string;
+ tags: string[];
+ }
+) => {
+ await page.getByTestId('all-pages').click();
+ await newPage(page);
+ await getBlockSuiteEditorTitle(page).click();
+ await getBlockSuiteEditorTitle(page).fill('test page');
+ await page.locator('affine-page-meta-data').click();
+ await page.locator('.add-tag').click();
+ for (const name of options.tags) {
+ await createTag(page, name);
+ }
+ await page.keyboard.press('Escape');
+};
+const changeFilter = async (page: Page, to: string | RegExp) => {
+ await page.getByTestId('filter-name').click();
+ await page
+ .getByTestId('filter-name-select')
+ .locator('button', { hasText: to })
+ .click();
+};
+
+async function selectTag(page: Page, name: string | RegExp) {
+ await page.getByTestId('filter-arg').click();
+ await page
+ .getByTestId('multi-select')
+ .getByTestId('select-option')
+ .getByText(name)
+ .click();
+ await page.getByTestId('filter-arg').click();
+}
+
+test('allow creation of filters by tags', async ({ page }) => {
+ await openHomePage(page);
+ await waitEditorLoad(page);
+ await closeDownloadTip(page);
+ await createPageWithTag(page, { title: 'Page A', tags: ['A'] });
+ await createPageWithTag(page, { title: 'Page B', tags: ['B'] });
+ await clickSideBarAllPageButton(page);
+ await createFirstFilter(page, 'Tags');
+ await checkFilterName(page, 'is not empty');
+ await checkPagesCount(page, 2);
+ await changeFilter(page, /^contains all/);
+ await checkPagesCount(page, 3);
+ await selectTag(page, 'A');
+ await checkPagesCount(page, 1);
+ await changeFilter(page, /^does not contains all/);
+ await selectTag(page, 'B');
+ await checkPagesCount(page, 2);
+});
diff --git a/tests/parallels/local-first-collections-items.spec.ts b/tests/parallels/local-first-collections-items.spec.ts
index d696eacb5a..b1118fa8c6 100644
--- a/tests/parallels/local-first-collections-items.spec.ts
+++ b/tests/parallels/local-first-collections-items.spec.ts
@@ -101,3 +101,26 @@ test('edit collection', async ({ page }) => {
await page.getByTestId('save-collection').click();
expect(await first.textContent()).toBe('123');
});
+
+test('create temporary filter by click tag', async ({ page }) => {
+ await openHomePage(page);
+ await waitEditorLoad(page);
+ await newPage(page);
+ await getBlockSuiteEditorTitle(page).click();
+ await getBlockSuiteEditorTitle(page).fill('test page');
+ await page.locator('affine-page-meta-data').click();
+ await page.locator('.add-tag').click();
+ await page.keyboard.type('TODO Tag');
+ await page.keyboard.press('Enter');
+ await page.keyboard.press('Escape');
+ await page.locator('.tag', { hasText: 'TODO Tag' }).click();
+ await closeDownloadTip(page);
+ const cell = page.getByRole('cell', {
+ name: 'test page',
+ });
+ await expect(cell).toBeVisible();
+ expect(await page.getByTestId('title').count()).toBe(1);
+ await page.getByTestId('filter-arg').click();
+ await page.getByRole('tooltip').getByText('TODO Tag').click();
+ expect(await page.getByTestId('title').count()).toBe(2);
+});
|