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

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

View File

@@ -26,7 +26,7 @@ test('Show favorite items in sidebar', async ({ page, workspace }) => {
const favoriteBtn = page.getByTestId('editor-option-menu-favorite');
await favoriteBtn.click();
const favoriteListItemInSidebar = page.getByTestId(
'favorite-list-item-' + newPageId
'favourite-page-' + newPageId
);
expect(await favoriteListItemInSidebar.textContent()).toBe(
'this is a new page to favorite'
@@ -55,7 +55,7 @@ test('Show favorite reference in sidebar', async ({ page, workspace }) => {
const favoriteBtn = page.getByTestId('editor-option-menu-favorite');
await favoriteBtn.click();
const favItemTestId = 'favorite-list-item-' + newPageId;
const favItemTestId = 'favourite-page-' + newPageId;
const favoriteListItemInSidebar = page.getByTestId(favItemTestId);
expect(await favoriteListItemInSidebar.textContent()).toBe(
@@ -69,7 +69,7 @@ test('Show favorite reference in sidebar', async ({ page, workspace }) => {
await expect(collapseButton).toBeVisible();
await collapseButton.click();
await expect(
page.locator('[data-type="favorite-list-item"] >> text=Another page')
page.locator('[data-type="reference-page"] >> text=Another page')
).toBeVisible();
const currentWorkspace = await workspace.current();
@@ -110,7 +110,7 @@ test("Deleted page's reference will not be shown in sidebar", async ({
// confirm delete
await page.locator('button >> text=Delete').click();
const favItemTestId = 'favorite-list-item-' + newPageId;
const favItemTestId = 'favourite-page-' + newPageId;
const favoriteListItemInSidebar = page.getByTestId(favItemTestId);
expect(await favoriteListItemInSidebar.textContent()).toBe(
@@ -137,7 +137,7 @@ test('Add new favorite page via sidebar', async ({ page }) => {
await getBlockSuiteEditorTitle(page).fill('this is a new fav page');
// check if the page title is shown in the favorite list
const favItem = page.locator(
'[data-type=favorite-list-item] >> text=this is a new fav page'
'[data-type=favourite-list-item] >> text=this is a new fav page'
);
await expect(favItem).toBeVisible();
});