@conduction/nextcloud-vue 2.96.0 → 2.98.0

package/src/components/CnIndexPage/CnIndexPage.vue

@@ -13,15 +13,15 @@
 		     region (WCAG 2.4.6 / 1.3.1). -->
 		<slot
 			name="header"
-			:title="title"
+			:title="presented('title')"
 			:description="headerDescription"
 			:icon="resolvedIcon"
 			:showTitle="showTitle">
 			<CnPageHeader
-				:title="title"
+				:title="presented('title')"
 				:description="headerDescription"
 				:icon="showTitleIcon && !isBoardLook ? resolvedIcon : ''"
-				:breadcrumb="breadcrumb"
+				:breadcrumb="presented('breadcrumb')"
 				:meta="headerMetaText"
 				:visuallyHidden="!showTitle">
 				<!-- The board's header buttons (`headerButtons`), beside the
@@ -125,11 +125,11 @@
 		<!-- Page tabs a named source declares (`pageTabs()`): sibling lists
 		     of the same thing, such as a flow list and its runs this week.
 		     Links, not tabs: each one is its own page. -->
-		<nav v-if="sourcePageTabs.length > 0"
+		<nav v-if="effectivePageTabs.length > 0"
 			class="cn-index-page__page-tabs"
 			:aria-label="title || t('nextcloud-vue', 'Pages')"
 			data-testid="cn-index-page-tabs">
-			<a v-for="tab in sourcePageTabs"
+			<a v-for="tab in effectivePageTabs"
 				:key="tab.id || tab.to"
 				class="cn-index-page__page-tab"
 				:class="{ 'cn-index-page__page-tab--active': isActivePageTab(tab) }"
@@ -193,7 +193,7 @@
 			:sortValue="sortSelectValue"
 			:showSearch="inlineSearch || isBoardLook"
 			:searchValue="effectiveSearchValue"
-			:searchPlaceholder="searchPlaceholder ? cnTranslate(searchPlaceholder) : searchPlaceholder"
+			:searchPlaceholder="presented('searchPlaceholder') ? cnTranslate(presented('searchPlaceholder')) : presented('searchPlaceholder')"
 			:showCountWithSearch="showCountWithSearch"
 			:refreshing="effectiveRefreshing"
 			:refreshDisabled="refreshDisabled"
@@ -1075,6 +1075,23 @@
 					class="cn-index-page__pagination"
 					@pageChanged="onPageEvent"
 					@pageSizeChanged="onPageSizeEvent" />
+
+				<!-- A notice under the list (`notice`): DqPrivacy's "Een
+				     AVG-verzoek is een zaak met ..." band. -->
+				<NcNoteCard
+					v-if="notice && notice.text"
+					class="cn-index-page__notice"
+					:type="noticeType"
+					data-testid="cn-index-page-notice">
+					{{ cnTranslate(notice.text) }}
+				</NcNoteCard>
+
+				<!-- Cards after the list (`afterList`), stacked in order (PqSocial). -->
+				<CnIndexPageWidgets
+					v-if="presentedAfterList.length > 0"
+					class="cn-index-page__after-list"
+					variant="after-list"
+					:widgets="presentedAfterList" />
 			</div>
 
 			<!-- The open record, beside the list on a wide screen and instead
@@ -1158,7 +1175,7 @@
 <script>
 import { getCurrentUser } from '@nextcloud/auth'
 import { translatePlural as n, translate as t } from '@nextcloud/l10n'
-import { NcActionButton, NcActionCaption, NcActionCheckbox, NcActionLink, NcActions, NcActionSeparator, NcButton, NcCheckboxRadioSwitch, NcLoadingIcon } from '@nextcloud/vue'
+import { NcActionButton, NcActionCaption, NcActionCheckbox, NcActionLink, NcActions, NcActionSeparator, NcButton, NcCheckboxRadioSwitch, NcLoadingIcon, NcNoteCard } from '@nextcloud/vue'
 import { getCurrentInstance, inject, markRaw, ref } from 'vue'
 import AlertCircleOutline from 'vue-material-design-icons/AlertCircleOutline.vue'
 import Close from 'vue-material-design-icons/Close.vue'
@@ -1200,13 +1217,14 @@ import {
 } from '../../utils/boardReferenceColumns.js'
 import { reportBindingProblems } from '../../utils/diagnostics.js'
 import { fetchGroupedCounts } from '../../utils/fetchAggregate.js'
-import { fetchFilterCounts } from '../../utils/fetchFilterCounts.js'
+import { fetchFilterCounts, fetchListTotal } from '../../utils/fetchFilterCounts.js'
 import { buildExportUrl } from '../../utils/indexExportHelpers.js'
 import { lensUnavailableText } from '../../utils/lensAvailability.js'
 import { isModifiedClick, openRowTarget } from '../../utils/linkNavigation.js'
 import { resolveClaimedTeams, resolveClaimTokens, splitViewsIntoTabs, viewAsTab, viewIdOf } from '../../utils/listLenses.js'
 import { LIST_SHORTCUTS, listPaletteCommands, shortcutFor } from '../../utils/listShortcuts.js'
 import { multiKeySort } from '../../utils/multiKeySort.js'
+import { fetchGroups } from '../../utils/nextcloudDirectory.js'
 import { OBJECTS_CHANGED_EVENT } from '../../utils/objectSignals.js'
 import { objectUrlOf, patchObject } from '../../utils/objectWrite.js'
 import { withPersonalLenses } from '../../utils/personalLenses.js'
@@ -1219,7 +1237,7 @@ import { isNewTabClick, isNewTabHandled, isRowMiddleClick, markNewTabHandled, pr
 import { DEFAULT_ROW_INDICATOR_CAP } from '../../utils/rowIndicators.js'
 import { buildRouteQueryFromViewState, buildViewCreatePayload, extractViewState, extractViewStateFromRouteQuery, normalizeSharedWith, savedViewScope, viewMatchesScope } from '../../utils/savedViewHelpers.js'
 import { columnsFromSchema, fieldsFromSchema } from '../../utils/schema.js'
-import { resolveScopeLayout } from '../../utils/scopeListLayout.js'
+import { resolveScopeLayout, resolveScopePresentation } from '../../utils/scopeListLayout.js'
 import { dispatchObjectCreated } from '../../utils/walkthroughSignals.js'
 import { CnActionButtons } from '../CnActionButtons/index.js'
 import { CnActionsBar } from '../CnActionsBar/index.js'
@@ -1490,6 +1508,7 @@ export default {
 
 	components: {
 		CnIndexPageWidgets,
+		NcNoteCard,
 		CnBuildiqEditButton,
 		CnFollowToggle,
 		NcLoadingIcon,
@@ -1658,6 +1677,35 @@ export default {
 			default: '',
 		},
 
+		/**
+		 * Tabs to sibling pages above the toolbar (manifest `config.pageTabs`),
+		 * each `{ id?, label, route?, params?, query?, href?, countFrom?: {
+		 * register, schema, filter? } }`: DqPrivacy's "AVG-verzoeken |
+		 * Datalekken". The current page's tab is marked; `countFrom` adds the
+		 * count of that list. Wins over a named source's own page tabs.
+		 *
+		 * @type {Array<object>|null}
+		 * @spec openspec/changes/index-page-tabs-notice/specs/index-page/spec.md#requirement-an-index-page-can-link-its-sibling-pages-as-tabs
+		 */
+		pageTabs: {
+			type: Array,
+			default: null,
+		},
+
+		/**
+		 * A notice under the list (manifest `config.notice`): `{ text,
+		 * variant?: 'info' | 'success' | 'warning' }`, a band that explains
+		 * the list, such as who decides what. The text goes through the host
+		 * translate.
+		 *
+		 * @type {{text: string, variant?: string}|null}
+		 * @spec openspec/changes/index-page-tabs-notice/specs/index-page/spec.md#requirement-an-index-page-can-show-a-notice-under-its-list
+		 */
+		notice: {
+			type: Object,
+			default: null,
+		},
+
 		/** Optional description shown below the title */
 		description: {
 			type: String,
@@ -3045,6 +3093,33 @@ export default {
 			default: () => [],
 		},
 
+		/**
+		 * Cards after the list (manifest `config.afterList`): dashboard widget
+		 * definitions `{ id, type, title?, content, headerLink? }` stacked
+		 * under the list in the listed order, the counterpart of `statRow`
+		 * above it. A query preset or a scope can set its own.
+		 *
+		 * @spec openspec/changes/index-scope-presentation/specs/index-page/spec.md#requirement-an-index-page-can-draw-widgets-after-its-list
+		 * @type {Array<object>}
+		 */
+		afterList: {
+			type: Array,
+			default: () => [],
+		},
+
+		/**
+		 * The route query pairs that chose this page's query preset, set by
+		 * CnPageRenderer. They scope the list, so they show no removable
+		 * active-filter chip.
+		 *
+		 * @spec openspec/changes/index-scope-presentation/specs/index-page/spec.md#requirement-the-query-that-chose-a-preset-is-not-a-removable-filter
+		 * @type {object|null}
+		 */
+		fixedFilters: {
+			type: Object,
+			default: null,
+		},
+
 		/**
 		 * Where a row carries the actions the server says this caller may run
 		 * on it: a dotted path, read off the rows the list already fetched, so
@@ -3645,6 +3720,8 @@ export default {
 			tabCounts: null,
 			// The counts of the `filterStrip` pills, by pill key ('all', 'v0', ...).
 			filterStripCounts: null,
+			/** The `countFrom` counts of the manifest page tabs, by index. */
+			pageTabCounts: {},
 			/** The tabs `quickFiltersFrom` produced, or null before they load. */
 			generatedQuickFilters: null,
 			/** Count per saved-view id, for the views control; null = none. */
@@ -3673,6 +3750,8 @@ export default {
 			 */
 			folderSidebarAllValues: [],
 			folderRegisterList: [],
+			/** The Nextcloud groups a `folderSidebar.source: 'groups'` pane lists. */
+			folderGroupList: [],
 			// `x-index` blocks read off the schema rows a `source: 'register'`
 			// folder list was built from, keyed by folder id. The layout a case
 			// type carries travels with the record rather than being restated
@@ -4194,7 +4273,8 @@ export default {
 			}
 			// The index boards draw all four segments, so the board look does
 			// too unless the manifest names its own list.
-			const listed = Array.isArray(this.viewSwitch) ? this.viewSwitch : ['table', 'cards', 'board', 'map']
+			const viewSwitch = this.presented('viewSwitch')
+			const listed = Array.isArray(viewSwitch) ? viewSwitch : ['table', 'cards', 'board', 'map']
 			const offered = [...this.effectiveToggleModes, ...(this.showMapSegment ? ['map'] : [])]
 			return listed.filter((mode) => ['table', 'cards', 'board', 'map'].includes(mode) && !offered.includes(mode))
 		},
@@ -4589,7 +4669,7 @@ export default {
 		 */
 		folderSidebarSource() {
 			const s = this.folderSidebar && this.folderSidebar.source
-			return (s === 'register' || !s) ? 'custom' : s
+			return (s === 'register' || s === 'groups' || !s) ? 'custom' : s
 		},
 
 		/**
@@ -4606,6 +4686,9 @@ export default {
 			if (this.folderSidebar.source === 'register') {
 				return this.folderRegisterList
 			}
+			if (this.folderSidebar.source === 'groups') {
+				return this.folderGroupList
+			}
 			return this.folderSidebar.folders || []
 		},
 
@@ -4665,6 +4748,58 @@ export default {
 			})
 		},
 
+		/**
+		 * This page's own value of each presentation key, which a query preset
+		 * may have set: what `presented()` falls back to without a scope.
+		 *
+		 * @return {object}
+		 * @spec openspec/changes/index-scope-presentation/specs/index-page/spec.md#requirement-a-preset-or-a-scope-sets-the-list-s-presentation
+		 */
+		ownPresentation() {
+			return {
+				title: this.title,
+				quickFilters: this.quickFilters,
+				cardFields: this.cardFields,
+				countText: this.countText,
+				searchPlaceholder: this.searchPlaceholder,
+				footerNote: this.footerNote,
+				viewSwitch: this.viewSwitch,
+				addLabel: this.addLabel,
+				headerButtons: this.headerButtons,
+				breadcrumb: this.breadcrumb,
+				headerMeta: this.headerMeta,
+				afterList: this.afterList,
+			}
+		},
+
+		/**
+		 * The presentation the active scope declares (`title`, `countText`,
+		 * `quickFilters`, `addLabel`, `afterList` and the other query preset
+		 * keys), from its folder entry or its row's `x-index`. Empty without a
+		 * scope, so the page's own values stand.
+		 *
+		 * @return {object}
+		 * @spec openspec/changes/index-scope-presentation/specs/index-page/spec.md#requirement-a-preset-or-a-scope-sets-the-list-s-presentation
+		 */
+		activeScopePresentation() {
+			if (!this.folderSidebar) {
+				return {}
+			}
+			return resolveScopePresentation({ scope: this.activeScope, row: this.activeScopeRow })
+		},
+
+		/**
+		 * The widgets drawn after the list: the active scope's `afterList`,
+		 * else the page's.
+		 *
+		 * @return {Array<object>}
+		 * @spec openspec/changes/index-scope-presentation/specs/index-page/spec.md#requirement-an-index-page-can-draw-widgets-after-its-list
+		 */
+		presentedAfterList() {
+			const list = this.presented('afterList')
+			return Array.isArray(list) ? list : []
+		},
+
 		/**
 		 * The fields the search box searches over while a scope declaring
 		 * `searchFields` is active. Read by `useSelfFetchList`'s fixed-filter
@@ -5124,8 +5259,9 @@ export default {
 		 * @return {?Array<string>}
 		 */
 		resolvedCardFields() {
-			if (Array.isArray(this.cardFields) && this.cardFields.length > 0) {
-				return this.cardFields
+			const cardFields = this.presented('cardFields')
+			if (Array.isArray(cardFields) && cardFields.length > 0) {
+				return cardFields
 			}
 			if (!this.isBoardLook) {
 				return null
@@ -5164,6 +5300,10 @@ export default {
 					}
 				})
 			}
+			// An `actions` column: the page's row actions it names, as buttons.
+			cols = cols.map((col) => (col && typeof col === 'object' && col.widget === 'actions'
+				? { ...col, sortable: false, widgetProps: { ...(col.widgetProps || {}), items: (row) => this.actionColumnItems(col, row), run: this.runColumnAction } }
+				: col))
 			// The Recent lens owns the order: no column sorts while it is on.
 			if (this.recentLensActive) {
 				cols = cols.map((col) => (col && typeof col === 'object' ? { ...col, sortable: false } : col))
@@ -5314,7 +5454,7 @@ export default {
 		 * @return {string} The id field key.
 		 */
 		folderPassthroughIdField() {
-			if (this.folderSidebar && this.folderSidebar.source === 'register') {
+			if (this.folderSidebar && (this.folderSidebar.source === 'register' || this.folderSidebar.source === 'groups')) {
 				return 'id'
 			}
 			return (this.folderSidebar && this.folderSidebar.idField) || 'id'
@@ -5324,7 +5464,7 @@ export default {
 		 * @return {string} The name field key for CnFolderSidebar's custom list.
 		 */
 		folderPassthroughNameField() {
-			if (this.folderSidebar && this.folderSidebar.source === 'register') {
+			if (this.folderSidebar && (this.folderSidebar.source === 'register' || this.folderSidebar.source === 'groups')) {
 				return 'name'
 			}
 			return (this.folderSidebar && this.folderSidebar.nameField) || 'name'
@@ -6040,6 +6180,51 @@ export default {
 			return (source.pageTabs() || []).filter((tab) => tab && tab.to && tab.label)
 		},
 
+		/**
+		 * The page tabs to draw: the manifest's `pageTabs`, each with its
+		 * `countFrom` count once known, else a named source's own.
+		 *
+		 * @return {Array<object>} The tabs, `{ id, label, to, count? }`.
+		 * @spec openspec/changes/index-page-tabs-notice/specs/index-page/spec.md#requirement-an-index-page-can-link-its-sibling-pages-as-tabs
+		 */
+		/**
+		 * The notice band's NcNoteCard type: its `variant`, else info.
+		 *
+		 * @return {string}
+		 * @spec openspec/changes/index-page-tabs-notice/specs/index-page/spec.md#requirement-an-index-page-can-show-a-notice-under-its-list
+		 */
+		noticeType() {
+			const variant = this.notice && this.notice.variant
+			return ['success', 'warning', 'error'].includes(variant) ? variant : 'info'
+		},
+
+		effectivePageTabs() {
+			if (!Array.isArray(this.pageTabs) || this.pageTabs.length === 0) {
+				return this.sourcePageTabs
+			}
+			return this.pageTabs
+				.filter((tab) => tab && typeof tab.label === 'string' && tab.label !== '' && (tab.route || tab.to || tab.href))
+				.map((tab, index) => {
+					const to = tab.route
+						? { name: tab.route, ...(tab.params ? { params: tab.params } : {}), ...(tab.query ? { query: tab.query } : {}) }
+						: (tab.to || tab.href)
+					const count = this.pageTabCounts[index]
+					return { id: tab.id || `page-tab-${index}`, label: this.cnTranslate(tab.label), to, ...(typeof count === 'number' ? { count } : {}) }
+				})
+		},
+
+		/**
+		 * What the page tab counts depend on, as one key.
+		 *
+		 * @return {string}
+		 * @spec openspec/changes/index-page-tabs-notice/specs/index-page/spec.md#requirement-an-index-page-can-link-its-sibling-pages-as-tabs
+		 */
+		pageTabCountKey() {
+			const tabs = Array.isArray(this.pageTabs) ? this.pageTabs : []
+			const sources = tabs.map((tab) => (tab && tab.countFrom && tab.countFrom.register && tab.countFrom.schema ? tab.countFrom : null))
+			return sources.some(Boolean) ? JSON.stringify(sources) : ''
+		},
+
 		/**
 		 * The numbers on the quick filters: a named source counts its own
 		 * tabs (`tabCounts()`), a self-fetching page asks OpenRegister.
@@ -6061,11 +6246,15 @@ export default {
 		 * @return {string} The note, translated, or ''.
 		 */
 		effectiveFooterNote() {
-			if (this.footerNote) {
-				return this.cnTranslate(this.footerNote)
+			// The scope's note, else the page's (a preset may have set it),
+			// else the named source's.
+			const scoped = this.activeScopePresentation ? this.activeScopePresentation.footerNote : undefined
+			const footerNote = scoped !== undefined ? scoped : this.footerNote
+			if (footerNote) {
+				return this.cnTranslate(footerNote)
 			}
 			const source = this.isNamedSource ? this.namedSource : null
-			return (source && source.footerNote) || this.footerNote
+			return (source && source.footerNote) || footerNote
 		},
 
 		/**
@@ -6076,7 +6265,7 @@ export default {
 		 * @return {Array<object>|null} The tabs, or null when there are none.
 		 */
 		effectiveQuickFilters() {
-			const own = withPersonalLenses(this.quickFilters || this.generatedQuickFilters, this.personalLenses)
+			const own = withPersonalLenses(this.presented('quickFilters') || this.generatedQuickFilters, this.personalLenses)
 			if (own && own.length > 0) {
 				return own
 			}
@@ -6142,7 +6331,8 @@ export default {
 		 * @return {Array<{key: string, label: string, action: string, variant: string, icon: string, format: string}>}
 		 */
 		resolvedHeaderButtons() {
-			const declared = Array.isArray(this.headerButtons) ? this.headerButtons : []
+			const headerButtons = this.presented('headerButtons')
+			const declared = Array.isArray(headerButtons) ? headerButtons : []
 			return declared
 				.filter((button) => button && typeof button === 'object' && typeof button.action === 'string' && button.action !== '')
 				.map((button, index) => {
@@ -6267,6 +6457,7 @@ export default {
 			for (const [key, raw] of Object.entries(this.effectiveActiveFilters || {})) {
 				const values = (Array.isArray(raw) ? raw : [raw])
 					.filter((value) => value !== null && value !== undefined && value !== '')
+					.filter((value) => !this.isFixedFilter(key, value))
 					.map((value) => this.activeFilterValueLabel(key, value))
 				if (values.length === 0) {
 					continue
@@ -6450,11 +6641,12 @@ export default {
 		 * @return {string}
 		 */
 		headerMetaText() {
-			if (!this.headerMeta) {
+			const headerMeta = this.presented('headerMeta')
+			if (!headerMeta) {
 				return ''
 			}
 			const total = this.effectivePagination?.total
-			return this.cnTranslate(this.headerMeta)
+			return this.cnTranslate(headerMeta)
 				.replace('{shown}', String(this.effectiveObjects.length))
 				.replace('{total}', typeof total === 'number' ? String(total) : '')
 		},
@@ -6468,11 +6660,12 @@ export default {
 				// The default count line is the library's own string, so it
 				// reads "14 van 14" in Dutch; a page's own template goes
 				// through the app's label lookup.
-				if (!this.countText && !this.countSubtitle) {
+				const countText = this.presented('countText')
+				if (!countText && !this.countSubtitle) {
 					return t('nextcloud-vue', '{shown} of {total}', { shown, total })
 				}
-				if (this.countText) {
-					return this.cnTranslate(this.countText)
+				if (countText) {
+					return this.cnTranslate(countText)
 						.replace('{shown}', String(shown))
 						.replace('{total}', String(total))
 				}
@@ -6486,8 +6679,10 @@ export default {
 
 		/** Add button label — derived from schema.title if not explicitly set */
 		resolvedAddLabel() {
-			if (this.addLabel) {
-				return this.cnTranslate(this.addLabel)
+			const scoped = this.activeScopePresentation ? this.activeScopePresentation.addLabel : undefined
+			const addLabel = scoped !== undefined ? scoped : this.addLabel
+			if (addLabel) {
+				return this.cnTranslate(addLabel)
 			}
 			// A named source names its own create action. Without this the button
 			// falls back to a schema-derived noun, and a named source has no
@@ -6712,6 +6907,14 @@ export default {
 			},
 		},
 
+		pageTabCountKey: {
+			immediate: true,
+			/** @spec openspec/changes/index-page-tabs-notice/specs/index-page/spec.md#requirement-an-index-page-can-link-its-sibling-pages-as-tabs */
+			handler() {
+				this.loadPageTabCounts()
+			},
+		},
+
 		filterStripCountKey: {
 			immediate: true,
 			/** @spec openspec/changes/screens-filter-strip/specs/index-filter-strip/spec.md#requirement-an-index-page-can-draw-a-second-filter-strip */
@@ -6916,6 +7119,7 @@ export default {
 		this.maybeOpenCreateFromQuery()
 		if (this.folderSidebar) {
 			this.loadFolderRegister()
+			this.loadFolderGroups()
 			// Reflect a deep-link filter (e.g. ?caseType=<id>) as the active folder.
 			const key = this.folderSidebar.filterField || this.folderSidebar.field
 			const active = key && this.effectiveActiveFilters[key]
@@ -6979,6 +7183,36 @@ export default {
 	},
 
 	methods: {
+		/**
+		 * A presentation value: the active scope's when it declares the key,
+		 * else this page's own prop (which a query preset may have set).
+		 *
+		 * @param {string} key One of the query preset keys.
+		 * @return {unknown} The value.
+		 * @spec openspec/changes/index-scope-presentation/specs/index-page/spec.md#requirement-a-preset-or-a-scope-sets-the-list-s-presentation
+		 */
+		presented(key) {
+			const scoped = this.activeScopePresentation
+			return scoped[key] !== undefined ? scoped[key] : this.ownPresentation[key]
+		},
+
+		/**
+		 * Whether a filter value is one of the query pairs that chose the
+		 * preset, so it shows no removable chip.
+		 *
+		 * @param {string} key The filter key.
+		 * @param {unknown} value One filter value.
+		 * @return {boolean}
+		 * @spec openspec/changes/index-scope-presentation/specs/index-page/spec.md#requirement-the-query-that-chose-a-preset-is-not-a-removable-filter
+		 */
+		isFixedFilter(key, value) {
+			const fixed = this.fixedFilters
+			if (!fixed || !Object.hasOwn(fixed, key)) {
+				return false
+			}
+			return String(fixed[key]) === String(value)
+		},
+
 		/**
 		 * The manifest page that shows one object of a schema, for a linked
 		 * label. Null without a manifest or a matching detail page.
@@ -7092,6 +7326,32 @@ export default {
 			]
 		},
 
+		/**
+		 * Count the lists behind the manifest page tabs (`countFrom`), one list
+		 * request each. A failed count shows no number.
+		 *
+		 * @return {Promise<void>}
+		 * @spec openspec/changes/index-page-tabs-notice/specs/index-page/spec.md#requirement-an-index-page-can-link-its-sibling-pages-as-tabs
+		 */
+		async loadPageTabCounts() {
+			const key = this.pageTabCountKey
+			if (key === '') {
+				this.pageTabCounts = {}
+				return
+			}
+			const ctx = typeof this.selfFetchTokenCtx === 'function' ? this.selfFetchTokenCtx() : {}
+			const counts = {}
+			await Promise.all(this.pageTabs.map(async (tab, index) => {
+				const from = tab && tab.countFrom
+				if (from && from.register && from.schema) {
+					counts[index] = await fetchListTotal(from.register, from.schema, from.filter || {}, ctx).catch(() => null)
+				}
+			}))
+			if (key === this.pageTabCountKey) {
+				this.pageTabCounts = counts
+			}
+		},
+
 		/**
 		 * Read the counts of the `filterStrip` pills in one grouped request,
 		 * narrowed by the page filter and the active quick filter. A failed
@@ -8525,6 +8785,50 @@ export default {
 			this.$emit('quick-edit-save', { id, patch })
 		},
 
+		/**
+		 * The buttons an `actions` column shows on a row: the row actions its
+		 * `widgetProps.actions` names (by id, else by label), in that order,
+		 * that are visible for the row.
+		 *
+		 * @param {object} col The column.
+		 * @param {object} row The row.
+		 * @return {Array<{key: string, label: string, variant: string, disabled: boolean}>}
+		 * @spec openspec/changes/table-actions-column/specs/index-page/spec.md#requirement-a-column-can-show-row-actions-as-buttons
+		 */
+		actionColumnItems(col, row) {
+			const wanted = Array.isArray(col.widgetProps && col.widgetProps.actions) ? col.widgetProps.actions : []
+			const available = this.rowActionsFor(row)
+			return wanted
+				.map((ref) => available.find((action) => action.id === ref) || available.find((action) => action.label === ref))
+				.filter((action) => action && isRowActionVisible(action, row))
+				.map((action, index) => ({
+					key: action.id || action.label,
+					label: this.cnTranslate(action.label),
+					variant: action.variant || (index === 0 ? 'secondary' : 'tertiary'),
+					disabled: typeof action.disabled === 'function' ? !!action.disabled(row) : action.disabled === true,
+				}))
+		},
+
+		/**
+		 * Run one `actions` column button: its handler, then the same `action`
+		 * event a row menu entry emits.
+		 *
+		 * @param {string} key The action's id, else its label.
+		 * @param {object} row The row.
+		 * @return {void}
+		 * @spec openspec/changes/table-actions-column/specs/index-page/spec.md#requirement-a-column-can-show-row-actions-as-buttons
+		 */
+		runColumnAction(key, row) {
+			const action = this.rowActionsFor(row).find((entry) => (entry.id || entry.label) === key)
+			if (!action) {
+				return
+			}
+			if (typeof action.handler === 'function') {
+				action.handler(row)
+			}
+			this.onRowAction(rowActionPayload(action, row))
+		},
+
 		/**
 		 * Take the server's version of a row after a conflict. Nothing of this
 		 * person's edit is written, and the row in the list is refreshed to
@@ -8688,6 +8992,39 @@ export default {
 			}
 		},
 
+		/**
+		 * Load the Nextcloud groups for `folderSidebar.source: 'groups'`, each
+		 * with its member count. `folderSidebar.groups` (`[{ id, parent? }]`)
+		 * picks and orders them and nests a group under its `parent`; without
+		 * it every group shows, by name. A refused request lists none.
+		 *
+		 * @return {Promise<void>}
+		 * @spec openspec/changes/index-groups-users-source/specs/index-page/spec.md#requirement-an-index-page-can-list-nextcloud-groups-and-their-members
+		 */
+		async loadFolderGroups() {
+			const cfg = this.folderSidebar
+			if (!cfg || cfg.source !== 'groups') {
+				return
+			}
+			try {
+				const { default: axios } = await import('@nextcloud/axios')
+				const groups = await fetchGroups(axios, { search: cfg.search || '', limit: cfg.limit || 200 })
+				const declared = Array.isArray(cfg.groups) ? cfg.groups.filter((entry) => entry && entry.id) : null
+				if (!declared) {
+					this.folderGroupList = [...groups].sort((a, b) => a.name.localeCompare(b.name))
+					return
+				}
+				const byId = new Map(groups.map((group) => [group.id, group]))
+				this.folderGroupList = declared
+					.filter((entry) => byId.has(String(entry.id)))
+					.map((entry) => ({ ...byId.get(String(entry.id)), parentId: entry.parent ? String(entry.parent) : null }))
+			} catch (e) {
+				// eslint-disable-next-line no-console
+				console.error('[CnIndexPage] failed to load the Nextcloud groups', e)
+				this.folderGroupList = []
+			}
+		},
+
 		/**
 		 * Load the folder list from an OpenRegister register/schema for a
 		 * `folderSidebar.source === 'register'` config. Maps each object to
@@ -9377,6 +9714,9 @@ export default {
 		 * @return {boolean} True for the current page.
 		 */
 		isActivePageTab(tab) {
+			if (tab.to && typeof tab.to === 'object') {
+				return !!this.$route && tab.to.name !== undefined && this.$route.name === tab.to.name
+			}
 			const path = this.$route && this.$route.path
 			return !!path && String(path).replace(/\/+$/, '') === String(tab.to).replace(/\/+$/, '')
 		},