@conduction/nextcloud-vue 2.75.0 → 2.76.0

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

@@ -31,6 +31,7 @@ import { openRowTarget } from '../../utils/linkNavigation.js';
 import { resolveClaimedTeams, splitViewsIntoTabs, viewAsTab, resolveClaimTokens, viewIdOf } from '../../utils/listLenses.js';
 import { LIST_SHORTCUTS, listPaletteCommands, shortcutFor } from '../../utils/listShortcuts.js';
 import { multiKeySort } from '../../utils/multiKeySort.js';
+import { OBJECTS_CHANGED_EVENT } from '../../utils/objectSignals.js';
 import { withPersonalLenses } from '../../utils/personalLenses.js';
 import { resolveDeepTokens, resolveFilterValue } from '../../utils/resolveFilterTokens.js';
 import { resolveRowActions } from '../../utils/resolveRowActions.js';
@@ -79,7 +80,7 @@ import { buildDefaultActions } from './defaultActions.js';
 import { dispatchAction } from './manifestActionDispatch.js';
 import { applyManualOrder, manualOrderKey, moveInOrder, visibleIdsOf, dropInOrder } from './manualOrder.js';
 import { reconcilePersonalColumns, orderColumns, personalColumnsKey } from './personalColumns.js';
-import { createSelfModeActions } from './selfModeActions.js';
+import { createSelfModeActions, resolveRowTarget } from './selfModeActions.js';
 import { applyRowPatches, splitLayoutFor, normalisePaneWidth, rowIdOf } from './splitView.js';
 import { useNamedSource } from './useNamedSource.js';
 import { useSelfFetchList } from './useSelfFetchList.js';
@@ -539,6 +540,17 @@ var script = {
 			default: null,
 		},
 
+		/**
+		 * Gives each card in the card view a status accent: a colored start
+		 * border and icon. See CnObjectCard `accent`.
+		 *
+		 * @type {((object: object) => ({variant: string, icon: string, label: string}|null))|null}
+		 */
+		cardAccent: {
+			type: Function,
+			default: null,
+		},
+
 		/**
 		 * Board look: free text after the footer's count ("8 of 48 · click a
 		 * column header to sort"). Manifest key `config.footerNote`.
@@ -710,6 +722,21 @@ var script = {
 			default: () => [],
 		},
 
+		/**
+		 * Self-fetch only: list from this endpoint instead of
+		 * `/api/objects/{register}/{schema}`, e.g. an app endpoint that searches
+		 * several register/schema pairs at once. `register` and `schema` stay the
+		 * page's own pair (columns, create, export, import). Rows of another pair,
+		 * read from their `@self.register` / `@self.schema`, are edited, copied and
+		 * deleted against that pair, with its own form. The endpoint takes
+		 * `_page`, `_limit`, `_search` and `_order[key]=dir` and answers
+		 * `{ results, total, page, pages }`.
+		 */
+		collectionUrl: {
+			type: String,
+			default: '',
+		},
+
 		/**
 		 * Offer an "Also search inside files" switch beside the search box. On,
 		 * a search also matches words inside attached files (OpenRegister
@@ -2217,6 +2244,8 @@ var script = {
 			 */
 			persistedFilterKeys: [...(this.initialQueryFilterKeys || [])],
 			internalSelectedIds: [...this.selectedIds],
+			// Rows seen in a collectionUrl list, so a selection kept across pages still resolves its own pair.
+			collectionRowsById: markRaw(new Map()),
 			// Folder-sidebar state: selected folder id + the register-fetched list.
 			selectedFolderId: null,
 			/**
@@ -2254,6 +2283,9 @@ var script = {
 			// Dialog targets
 			actionTargetItem: null,
 			editItem: null,
+			// The pair and schema of a row edited outside the page's own pair (collectionUrl).
+			rowFormTarget: null,
+			rowFormSchema: null,
 			// Drives the Actions-menu Refresh spinner during a self-fetch
 			// refresh, where the host has no promise to bind `:refreshing` to.
 			internalRefreshing: false,
@@ -3535,6 +3567,16 @@ var script = {
 			return (this.schema && typeof this.schema === 'object') ? this.schema : null
 		},
 
+		/** The form dialog's schema: the edited row's own when it is of another pair. */
+		formSchema() {
+			return this.rowFormTarget ? this.rowFormSchema : this.effectiveSchema
+		},
+
+		/** The form dialog's register, following `formSchema`. */
+		formRegister() {
+			return this.rowFormTarget ? this.rowFormTarget.register : this.register
+		},
+
 		/**
 		 * Schema slug for the export-leaf URL — the `schema` prop directly
 		 * when it's a string (self-fetch mode's precondition), else the
@@ -3921,8 +3963,7 @@ var script = {
 							this.$emit('edit-open', row);
 							return
 						}
-						this.editItem = row;
-						this.showFormDialogVisible = true;
+						this.openFormFor(row);
 					},
 					onCopy: (row) => {
 						this.actionTargetItem = row;
@@ -4431,6 +4472,21 @@ var script = {
 	},
 
 	watch: {
+		effectiveObjects: {
+			immediate: true,
+			handler(rows) {
+				if (!this.collectionUrl || !this.isSelfFetchMode || !Array.isArray(rows)) {
+					return
+				}
+				for (const row of rows) {
+					const id = row?.id ?? row?.['@self']?.id;
+					if (id !== undefined && id !== null) {
+						this.collectionRowsById.set(id, row);
+					}
+				}
+			},
+		},
+
 		// A column or form field bound to a property the schema lacks is told to the host once.
 		effectiveSchema: {
 			immediate: true,
@@ -4623,6 +4679,9 @@ var script = {
 		if (this.splitViewEnabled && typeof window !== 'undefined') {
 			window.addEventListener('resize', this.measureSplitViewport);
 		}
+		if (typeof window !== 'undefined') {
+			window.addEventListener(OBJECTS_CHANGED_EVENT, this.onObjectsChanged);
+		}
 		this.loadManualOrder();
 		this.loadPersonalColumns();
 		this.publishHoistedSidebar();
@@ -4647,6 +4706,8 @@ var script = {
 		this.selfActions = createSelfModeActions({
 			isSelfFetchMode: () => this.isSelfFetchMode,
 			selfObjectStore: () => this.selfObjectStore,
+			rowTarget: (row) => this.rowTypeTarget(row),
+			knownRow: (id) => this.collectionRowsById.get(id),
 			selfObjectType: () => this.selfObjectType,
 			list: () => this.list,
 			selectedIds: () => this.internalSelectedIds,
@@ -4672,13 +4733,14 @@ var script = {
 	},
 
 	/**
-	 * Drop the resize listener and the hoisted sidebar.
+	 * Drop the window listeners and the hoisted sidebar.
 	 *
 	 * @spec openspec/changes/case-page-and-list-as-a-place/specs/index-page/spec.md
 	 */
 	beforeUnmount() {
 		if (typeof window !== 'undefined') {
 			window.removeEventListener('resize', this.measureSplitViewport);
+			window.removeEventListener(OBJECTS_CHANGED_EVENT, this.onObjectsChanged);
 		}
 		// Clear the holder so the hoisted sidebar disappears when
 		// the user navigates away from the index page.
@@ -6140,6 +6202,33 @@ var script = {
 			}
 		},
 
+		/**
+		 * Refresh the list when `dispatchObjectsChanged` names this page's
+		 * register and schema, by slug or id. A part missing on either side matches.
+		 *
+		 * @param {CustomEvent} event The objects-changed event.
+		 * @return {void}
+		 */
+		onObjectsChanged(event) {
+			// A collection list can hold rows of any pair, so any change may show in it.
+			if (this.isSelfFetchMode && this.collectionUrl) {
+				this.onRefreshEvent();
+				return
+			}
+			const detail = (event && event.detail) || {};
+			const schema = this.effectiveSchema;
+			const schemaIds = [this.schema, schema && schema.id, schema && schema.slug]
+				.filter((v) => v !== undefined && v !== null && v !== '' && typeof v !== 'object')
+				.map(String);
+			if (detail.register && this.register && detail.register !== String(this.register)) {
+				return
+			}
+			if (detail.schema && schemaIds.length > 0 && !schemaIds.includes(detail.schema)) {
+				return
+			}
+			this.onRefreshEvent();
+		},
+
 		/** @return {Promise<void>} */
 		async onRefreshEvent() {
 			this.$emit('refresh');
@@ -7282,6 +7371,8 @@ var script = {
 		closeFormDialog() {
 			this.showFormDialogVisible = false;
 			this.editItem = null;
+			this.rowFormTarget = null;
+			this.rowFormSchema = null;
 		},
 
 		/**
@@ -7342,8 +7433,55 @@ var script = {
 		 * @public
 		 */
 		openFormDialog(item = null) {
-			this.editItem = item;
-			this.showFormDialogVisible = true;
+			return this.openFormFor(item)
+		},
+
+		/**
+		 * Open the form dialog for an item. A row of another pair (collectionUrl)
+		 * opens with its own schema; everything else opens at once, as before.
+		 *
+		 * @param {object|null} item The row to edit, or null to create.
+		 * @return {Promise<void>|void}
+		 */
+		openFormFor(item) {
+			const target = item ? this.rowTypeTarget(item) : null;
+			if (!target) {
+				this.rowFormTarget = null;
+				this.rowFormSchema = null;
+				this.editItem = item;
+				this.showFormDialogVisible = true;
+				return
+			}
+			const store = this.selfObjectStore;
+			return Promise.resolve(store.getSchema?.(target.type) || store.fetchSchema?.(target.type))
+				.catch(() => null)
+				.then((schema) => {
+					if (!schema) {
+						this.toastSavedView('error', translate('nextcloud-vue', 'Could not load the form for this item.'));
+						return
+					}
+					this.rowFormTarget = target;
+					this.rowFormSchema = schema;
+					this.editItem = item;
+					this.showFormDialogVisible = true;
+				})
+		},
+
+		/**
+		 * The row's own pair when it differs from the page's in a collectionUrl list.
+		 *
+		 * @param {object} row The row.
+		 * @return {{register: string, schema: string, type: string}|null} The pair, or null.
+		 */
+		rowTypeTarget(row) {
+			return resolveRowTarget({
+				collectionUrl: this.isSelfFetchMode ? this.collectionUrl : '',
+				register: this.register,
+				schema: this.schema,
+				primarySchema: this.effectiveSchema,
+				primaryRegister: this.selfObjectStore?.getRegister?.(this.selfObjectType) || null,
+				store: this.selfObjectStore,
+			}, row)
 		},
 
 		/**