diff --git a/playwright/e2e/page-list.spec.ts b/playwright/e2e/page-list.spec.ts index 8aac07978..09ace6768 100644 --- a/playwright/e2e/page-list.spec.ts +++ b/playwright/e2e/page-list.spec.ts @@ -140,3 +140,25 @@ test.describe('Page list drag and drop', () => { await editor.hasCollectiveLink(page1.data.title) }) }) + +test.describe('Page list collapse all', () => { + test('Collapse all pages but keep current page visible', async ({ page, user, collective, pageList }) => { + const parent = await collective.createPage({ title: 'Parent', user, page }) + const child = await collective.createPage({ title: 'Child', parentId: parent.data.id, user, page }) + await collective.createPage({ title: 'Grandchild', parentId: child.data.id, user, page }) + const other = await collective.createPage({ title: 'Other', user, page }) + await collective.createPage({ title: 'Other child', parentId: other.data.id, user, page }) + + await child.open() + await expect(pageList.getPageItem('Grandchild')).toBeVisible() + await pageList.toggleExpandPage('Other') + await expect(pageList.getPageItem('Other child')).toBeVisible() + + await pageList.collapseAll() + + // Parent of current page stays expanded, everything else collapses + await expect(pageList.getPageItem('Child')).toBeVisible() + await expect(pageList.getPageItem('Grandchild')).toHaveCount(0) + await expect(pageList.getPageItem('Other child')).toHaveCount(0) + }) +}) diff --git a/playwright/support/sections/PageListSection.ts b/playwright/support/sections/PageListSection.ts index 3d830dcd6..d6e0348ba 100644 --- a/playwright/support/sections/PageListSection.ts +++ b/playwright/support/sections/PageListSection.ts @@ -39,6 +39,11 @@ export class PageListSection { .click() } + public async collapseAll(): Promise { + await this.el.getByRole('button', { name: 'Page list options' }).click() + await this.page.getByRole('menuitem', { name: 'Collapse all pages' }).click() + } + public async addPage(parentTitle: string): Promise { const item = this.getPageItem(parentTitle) // The add-subpage button is only shown on hover diff --git a/src/components/PageList.vue b/src/components/PageList.vue index 1f282c634..8bd61bc58 100644 --- a/src/components/PageList.vue +++ b/src/components/PageList.vue @@ -47,13 +47,9 @@ + :aria-label="t('collectives', 'Page list options')"> {{ sortedBy('byTitleAsc') ? t('collectives', 'Sort descending by title') : t('collectives', 'Sort ascending by title') }} + { + scrollToPage(this.currentPageId) + }) + }, + updateScrollerHeights() { const [filteredPagesScrollerMaxHeight, contentFilteredPagesScrollerMaxHeight] = this.scrollerMaxHeights this.$nextTick(() => { diff --git a/src/stores/pages.js b/src/stores/pages.js index d60068f9b..3b36d651a 100644 --- a/src/stores/pages.js +++ b/src/stores/pages.js @@ -550,6 +550,16 @@ export const usePagesStore = defineStore('pages', { } }, + // Collapse all pages of current collective except parents of current page + collapseAll() { + for (const page of this.pages) { + delete this.collapsed[page.id] + } + if (this.currentPage) { + this.expandParents(this.currentPage.parentId) + } + }, + setNewPageParentId(id) { this.newPageParentId = id },