@conduction/nextcloud-vue 2.102.0 → 2.104.0

package/dist/esm/components/CnIndexPage/CnIndexPage.vue2.js

@@ -55,6 +55,7 @@ import { DEFAULT_ROW_INDICATOR_CAP } from '../../utils/rowIndicators.js';
 import { viewMatchesScope, extractViewState, buildRouteQueryFromViewState, extractViewStateFromRouteQuery, buildViewCreatePayload, savedViewScope, normalizeSharedWith } from '../../utils/savedViewHelpers.js';
 import { fieldsFromSchema, columnsFromSchema } from '../../utils/schema.js';
 import { resolveScopeLayout, resolveScopePresentation } from '../../utils/scopeListLayout.js';
+import { sameSortKeys, orderToSortKeys } from '../../utils/sortOrder.js';
 import { dispatchObjectCreated } from '../../utils/walkthroughSignals.js';
 import __sfc_main$7 from '../CnActionButtons/CnActionButtons.vue.js';
 import __sfc_main$8 from '../CnActionsBar/CnActionsBar.vue.js';
@@ -728,7 +729,10 @@ var script = {
 		 * case" (manifest `config.headerButtons`). Each is `{ label?, action,
 		 * variant?, icon?, format?, id? }`: `action` is `add` (the Add flow;
 		 * its label defaults to the Add label), `export` (the export leaf in
-		 * `format`, `csv` by default, else the export dialog), `import`,
+		 * `format`, `csv` by default, else the export dialog; with `run` the
+		 * `headerActions` entry of that id; on an `entitySource` page without
+		 * `run` and without a `@mass-export` listener it is not drawn),
+		 * `import`,
 		 * `refresh`, `save-view` (the save-current-view dialog: the board's
 		 * "Zoekopdracht opslaan", label "Save view" by default), or the id of a
 		 * `headerActions` entry; `variant` is
@@ -908,6 +912,20 @@ var script = {
 			validator: (v) => ['', 'toolbar'].includes(v),
 		},
 
+		/**
+		 * Where the board look's search field sits (manifest
+		 * `config.searchPlacement`): `''` (the default) opens row 2 with it,
+		 * `'toolbar'` puts it on row 1 before the Filter button and the view
+		 * switch (DqTeamwachtrij).
+		 *
+		 * @type {''|'toolbar'}
+		 */
+		searchPlacement: {
+			type: String,
+			default: '',
+			validator: (v) => ['', 'toolbar'].includes(v),
+		},
+
 		/**
 		 * How the quick filters render: `'chips'` (pill strip, default) or
 		 * `'dropdown'` (a single `NcSelect`). Sourced from the manifest as
@@ -1854,6 +1872,16 @@ var script = {
 			default: false,
 		},
 
+		/**
+		 * `false` draws no inline search in the actions bar, also in the board
+		 * look, which otherwise draws one on every index page. Fed from the
+		 * manifest as `pages[].config.search`.
+		 */
+		search: {
+			type: Boolean,
+			default: true,
+		},
+
 		/**
 		 * Keep the "Showing X of Y" counter visible beside the inline search field,
 		 * after any `#after-search` controls (only relevant with `inlineSearch`,
@@ -1921,12 +1949,28 @@ var script = {
 			default: () => [],
 		},
 
-		/** Selected value of the standalone sort dropdown (controlled). */
+		/**
+		 * Selected value of the standalone sort dropdown. Empty lets a
+		 * self-fetch page show the option matching its current order.
+		 */
 		sortSelectValue: {
 			type: String,
 			default: '',
 		},
 
+		/**
+		 * The order a self-fetch page opens on when neither the address nor
+		 * `sortKeys`/`sortKey` gives one (manifest `config.defaultOrder`):
+		 * `"-createdAt"`, `"priority:desc,title"`, an `_order` map or a
+		 * `[{ key, order }]` list.
+		 *
+		 * @type {string|object|Array}
+		 */
+		defaultOrder: {
+			type: [String, Object, Array],
+			default: '',
+		},
+
 		/** MDI icon name for the list view-toggle option (manifest `config.listIcon`) */
 		listIcon: {
 			type: String,
@@ -1960,6 +2004,9 @@ var script = {
 		 *   defaults to `field`).
 		 * - `folders` — explicit folder list for `source:'custom'`.
 		 * - `allLabel` / `title` / `allowCreate` — passed to CnFolderSidebar.
+		 * - `pane` — `false` draws no pane: the scope still comes from the
+		 *   deep-link filter (`?caseType=<id>`) and still applies its look, as
+		 *   a list narrowed to one case type does without a folder column.
 		 *
 		 * A folder entry is also a SCOPE: it may carry `columns`, `defaultSort`
 		 * and `searchFields`, and while it is selected the list is shown that
@@ -3593,6 +3640,17 @@ var script = {
 			return { shown, total: Math.max(shown, Number(this.effectivePagination?.total || 0)) }
 		},
 
+		/**
+		 * Whether the folder pane is drawn: a `folderSidebar` without
+		 * `pane: false`.
+		 *
+		 * @spec openspec/changes/folder-sidebar-pane-off/specs/index-page/spec.md#requirement-a-folder-scope-without-a-pane
+		 * @return {boolean}
+		 */
+		showsFolderPane() {
+			return Boolean(this.folderSidebar) && this.folderSidebar.pane !== false
+		},
+
 		/**
 		 * The CnFolderSidebar source. A `register` source is fetched by this
 		 * component and handed to CnFolderSidebar as a `custom` folder list.
@@ -3641,6 +3699,60 @@ var script = {
 			return match || null
 		},
 
+		/**
+		 * The heading above the list for the selected folder: on a `groups`
+		 * pane (or with `folderSidebar.heading: true`), its name and, under
+		 * it, its parent folder and its count. The count reads
+		 * `folderSidebar.countText` (`{count}`, through the app's translate),
+		 * else "{count} members" on a groups pane.
+		 *
+		 * @return {{name: string, subtitle: string}|null} The heading, or null on All.
+		 */
+		scopeHeading() {
+			const cfg = this.folderSidebar;
+			const scope = this.activeScope;
+			if (!cfg || !scope || !(cfg.source === 'groups' || cfg.heading === true)) {
+				return null
+			}
+			const idField = this.folderPassthroughIdField;
+			const name = String(this.getByPath(scope, this.folderPassthroughNameField) ?? this.selectedFolderId);
+			const parentId = scope.parentId ?? scope.parent ?? null;
+			const parent = parentId === null || parentId === undefined
+				? null
+				: this.folderSidebarFolders.find((f) => f && String(this.getByPath(f, idField)) === String(parentId));
+			const parts = [];
+			if (parent) {
+				parts.push(String(this.getByPath(parent, this.folderPassthroughNameField) ?? parentId));
+			}
+			if (typeof scope.count === 'number') {
+				if (cfg.countText) {
+					parts.push(this.cnTranslate(cfg.countText).replace('{count}', String(scope.count)));
+				} else if (cfg.source === 'groups') {
+					parts.push(translatePlural('nextcloud-vue', '{count} member', '{count} members', scope.count, { count: scope.count }));
+				}
+			}
+			return { name, subtitle: parts.join(' · ') }
+		},
+
+		/**
+		 * The sort select's shown value: `sortSelectValue` when the host
+		 * controls it, else on a self-fetch page the option whose order is the
+		 * list's current order (a header click that matches one shows it).
+		 *
+		 * @return {string} The option value, or '' when none matches.
+		 */
+		effectiveSortSelectValue() {
+			if (this.sortSelectValue) {
+				return this.sortSelectValue
+			}
+			if (!this.isSelfFetchMode || !this.list || !this.list.sortKeys) {
+				return ''
+			}
+			const current = this.list.sortKeys.value || [];
+			const match = (this.sortSelectOptions || []).find((o) => o && sameSortKeys(this.sortSelectKeys(o), current));
+			return match ? match.value : ''
+		},
+
 		/**
 		 * The `x-index` block the active scope's own schema row carries, for a
 		 * folder list derived from a register. Empty for every other source:
@@ -5414,6 +5526,7 @@ var script = {
 						variant: button.variant === 'primary' ? 'primary' : 'secondary',
 						icon,
 						format: button.format === 'excel' ? 'excel' : 'csv',
+						run: typeof button.run === 'string' ? button.run : '',
 						items: Array.isArray(button.items)
 							? button.items.filter((item) => (typeof item === 'string' && item !== '')
 								|| (item && typeof item === 'object' && typeof item.heading === 'string' && item.heading !== ''))
@@ -5421,6 +5534,10 @@ var script = {
 					}
 				})
 				.filter((button) => button.label !== '')
+				// An Export with nothing to export through is not drawn: a
+				// named or endpoint source with no `run` and no `@mass-export`
+				// listener.
+				.filter((button) => button.action !== 'export' || this.headerExportAvailable(button))
 				// The Actions menu lists the page's header actions (or the
 				// entries its `items` name), so a menu with nothing to list
 				// is not drawn.
@@ -7209,7 +7326,9 @@ var script = {
 			if (button.action === 'add') {
 				this.onAddClick();
 			} else if (button.action === 'export') {
-				if (this.register && this.exportSchemaSlug) {
+				if (button.run) {
+					this.onHeaderAction({ action: button.run, id: button.run });
+				} else if (this.register && this.exportSchemaSlug) {
 					this.onExportClick(button.format);
 				} else {
 					this.showExportDialog = true;
@@ -7225,6 +7344,25 @@ var script = {
 			}
 		},
 
+		/**
+		 * Whether a header Export has something to export through. Any page
+		 * listing OpenRegister objects (self-fetch or the consumer's
+		 * `objects`) keeps it; a named or endpoint source (`entitySource`)
+		 * needs a `run` naming one of the page's header actions, or a
+		 * `@mass-export` listener.
+		 *
+		 * @spec openspec/changes/index-header-export-source/specs/index-page/spec.md#requirement-a-header-export-is-drawn-only-when-it-can-export
+		 * @param {{run?: string}} button The resolved header button.
+		 * @return {boolean}
+		 */
+		headerExportAvailable(button) {
+			if (!this.isNamedSource || (button && button.run)) {
+				return true
+			}
+			const props = this.$ && this.$.vnode && this.$.vnode.props;
+			return Boolean(props && typeof props.onMassExport === 'function')
+		},
+
 		/**
 		 * Click dispatch from CnActionsBar's `@header-action`. Looks
 		 * up the resolved entry by id, invokes its handler if any,
@@ -7345,6 +7483,38 @@ var script = {
 			this.$emit('quick-filter-change', this.selectedQuickFilterIndices);
 		},
 
+		/**
+		 * The sort keys a sort-select option stands for: its `order` (any
+		 * `orderToSortKeys` form), else its `value` read as an order.
+		 *
+		 * @param {object} option A `sortSelectOptions` entry.
+		 * @return {Array<{key: string, order: string}>} The sort keys.
+		 */
+		sortSelectKeys(option) {
+			if (!option) {
+				return []
+			}
+			return orderToSortKeys(option.order !== undefined ? option.order : option.value)
+		},
+
+		/**
+		 * A choice in the sort select. On a self-fetch page it orders the list
+		 * as a header click does (`_order`, kept in the address); every page
+		 * also emits `sort-change` with the value.
+		 *
+		 * @param {string} value The chosen option's value.
+		 * @return {void}
+		 */
+		onSortSelectChange(value) {
+			const option = (this.sortSelectOptions || []).find((o) => o && o.value === value);
+			const keys = this.sortSelectKeys(option);
+			if (option && keys.length > 0 && this.isSelfFetchMode && typeof this.list.onSort === 'function') {
+				this.list.onSort({ key: keys[0].key, order: keys[0].order, keys });
+				this.persistViewStateToRoute(this.currentViewState());
+			}
+			this.$emit('sort-change', value);
+		},
+
 		/**
 		 * @param {{key: string, order: string, keys?: Array<{key: string, order: string}>}} payload Sort change from CnDataTable.
 		 * @return {void}