luulam/AFFiNE
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

feat(core): support sidebar page item dnd (#5132)

Browse Source 
Added the ability to drag page items from the `all pages` view to the sidebar, including `favourites,` `collection` and `trash`. Page items in `favourites` and `collection` can also be dragged between each other. However, linked subpages cannot be dragged.

Additionally, an operation menu and ‘add’ button have been provided for the sidebar’s page items, enabling the addition of a subpage, renaming, deletion or removal from the sidebar.

On the code front, the `useSidebarDrag` hooks have been implemented for consolidating drag events. The functions `getDragItemId` and `getDropItemId` have been created, and they accept type and ID to obtain itemId.

https://github.com/toeverything/AFFiNE/assets/102217452/d06bac18-3c28-41c9-a7d4-72de955d7b11
This commit is contained in:
JimmFly
2023-12-12 16:04:57 +00:00
parent b782b3fb1b
commit f4a52c031f
34 changed files with 1191 additions and 328 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
tests/affine-local/e2e/local-first-collections-items.spec.ts
View File

@@ -60,18 +60,16 @@ test('Show collections items in sidebar', async ({ page }) => {
const collectionPage = collections.getByTestId('collection-page').nth(0);
expect(await collectionPage.textContent()).toBe('test page');
await collectionPage.hover();
await collectionPage.getByTestId('collection-page-options').click();
const deletePage = page
.getByTestId('collection-page-option')
.getByText('Delete');
await collectionPage
.getByTestId('left-sidebar-page-operation-button')
.click();
const deletePage = page.getByText('Delete');
await deletePage.click();
await page.getByTestId('confirm-delete-page').click();
expect(await collections.getByTestId('collection-page').count()).toBe(0);
await first.hover();
await first.getByTestId('collection-options').click();
const deleteCollection = page
.getByTestId('collection-option')
.getByText('Delete');
const deleteCollection = page.getByText('Delete');
await deleteCollection.click();
await page.waitForTimeout(50);
expect(await items.count()).toBe(0);
@@ -100,13 +98,10 @@ test('edit collection', async ({ page }) => {
const first = items.first();
await first.hover();
await first.getByTestId('collection-options').click();
const editCollection = page
.getByTestId('collection-option')
.getByText('Rename');
const editCollection = page.getByText('Rename');
await editCollection.click();
const title = page.getByTestId('input-collection-title');
await title.fill('123');
await page.getByTestId('save-collection').click();
await page.getByTestId('rename-modal-input').fill('123');
await page.keyboard.press('Enter');
await page.waitForTimeout(100);
expect(await first.textContent()).toBe('123');
});
@@ -123,9 +118,8 @@ test('edit collection and change filter date', async ({ page }) => {
.getByTestId('collection-option')
.getByText('Rename');
await editCollection.click();
const title = page.getByTestId('input-collection-title');
await title.fill('123');
await page.getByTestId('save-collection').click();
await page.getByTestId('rename-modal-input').fill('123');
await page.keyboard.press('Enter');
await page.waitForTimeout(100);
expect(await first.textContent()).toBe('123');
});