@conduction/nextcloud-vue 2.115.0 → 2.116.0

package/src/components/CnGroupedCardsWidget/CnGroupedCardsWidget.vue

@@ -43,6 +43,13 @@
 				<p v-else class="cn-grouped-cards__group-empty">
 					{{ groupEmptyLabel }}
 				</p>
+				<!-- `groupAction`: one action per group ("Add a task" on a phase),
+				     its `@group.<path>` tokens filled from the group. -->
+				<CnActionButtons
+					v-if="group.action"
+					class="cn-grouped-cards__group-action"
+					:actions="[group.action]"
+					data-testid="cn-grouped-cards-group-action" />
 			</section>
 			<section
 				v-if="extra"
@@ -71,6 +78,7 @@ import { fillTemplate } from '../../utils/fillTemplate.js'
 import { unwrapAppConfig } from '../../utils/formatMetric.js'
 import { languageMapText } from '../../utils/languageMapText.js'
 import { readPath } from '../../utils/readPath.js'
+import { CnActionButtons } from '../CnActionButtons/index.js'
 
 let uid = 0
 
@@ -121,7 +129,7 @@ function readable(row) {
 export default {
 	name: 'CnGroupedCardsWidget',
 
-	components: { NcLoadingIcon },
+	components: { CnActionButtons, NcLoadingIcon },
 
 	inject: {
 		/** The host app's translate function. */
@@ -147,6 +155,11 @@ export default {
 		 * - `extraGroup` (`{ title, path, itemText, join? }`) closes the grid with a
 		 *   dashed box whose entries, read at `path` of the payload, are one line.
 		 * - `columns` (default 2) is the number of groups side by side.
+		 * - `groupAction` is an action drawn at the foot of every group (as
+		 *   CnActionButtons draws it), with `@group.<path>` in its strings read
+		 *   from that group: `{ type: "open-form", endpoint: { url:
+		 *   "/apps/x/api/phases/@group.id/steps", method: "POST" }, ... }`
+		 *   adds a card to the group.
 		 *
 		 * A language map (`{ nl, en }`) reads in the user's language, and a list
 		 * of plain values reads joined with ", ". Texts go through the app's
@@ -231,6 +244,7 @@ export default {
 					title: this.fill(c.groupTitle || '{name}', group),
 					count: this.countOf(items.length),
 					items,
+					action: this.groupActionFor(raw, index),
 				}
 			})
 		},
@@ -285,6 +299,46 @@ export default {
 	},
 
 	methods: {
+		/**
+		 * The `groupAction` for one group, with every `@group.<path>` token in
+		 * its strings read from that group, and its id made unique per group.
+		 * Null without a `groupAction`, or for a group missing a value a token
+		 * names (the action would address no group).
+		 *
+		 * @param {object} raw The group as read.
+		 * @param {number} index The group's position.
+		 * @return {object|null} The action.
+		 * @spec openspec/changes/grouped-cards-group-action/specs/grouped-cards-group-action/spec.md#requirement-every-group-can-carry-an-action
+		 */
+		groupActionFor(raw, index) {
+			const action = this.content?.groupAction
+			if (!action || typeof action !== 'object') {
+				return null
+			}
+			let missing = false
+			const fill = (value) => {
+				if (typeof value === 'string') {
+					return value.replace(/@group\.([\w.]+)/g, (token, path) => {
+						const found = readPath(raw, path)
+						if (found === undefined || found === null || found === '') {
+							missing = true
+							return ''
+						}
+						return encodeURIComponent(String(found))
+					})
+				}
+				if (Array.isArray(value)) {
+					return value.map(fill)
+				}
+				if (value && typeof value === 'object') {
+					return Object.fromEntries(Object.entries(value).map(([key, inner]) => [key, fill(inner)]))
+				}
+				return value
+			}
+			const filled = fill(action)
+			return missing ? null : { ...filled, id: `${action.id || 'group-action'}-${index}` }
+		},
+
 		/**
 		 * Translate a text through the host app's catalogue.
 		 *
@@ -382,6 +436,10 @@ export default {
 	color: var(--color-main-text);
 }
 
+.cn-grouped-cards__group-action {
+	margin-top: 8px;
+}
+
 .cn-grouped-cards__count {
 	padding: 2px 8px;
 	border-radius: var(--border-radius-pill, 12px);

package/src/components/CnMacrosWidget/CnMacrosWidget.vue

@@ -33,8 +33,8 @@
 				class="cn-macros-widget__row"
 				:data-testid="`cn-macros-widget-row-${macro.key}`">
 				<div class="cn-macros-widget__text">
-					<span class="cn-macros-widget__name">{{ macro.name }}</span>
-					<span v-if="macro.description" class="cn-macros-widget__hint">{{ macro.description }}</span>
+					<span class="cn-macros-widget__name">{{ tr(macro.name) }}</span>
+					<span v-if="macro.description" class="cn-macros-widget__hint">{{ tr(macro.description) }}</span>
 				</div>
 				<NcButton
 					:disabled="running !== ''"
@@ -54,7 +54,9 @@
 			v-else-if="lastRun"
 			type="success"
 			data-testid="cn-macros-widget-last-run">
-			{{ t('nextcloud-vue', 'Last run: {name}, {date}', { name: lastRun.name, date: lastRun.date }) }}
+			{{ t('nextcloud-vue', 'Last run: {name}, {date}', { name: lastRun.name, date: lastRun.date }) }}<template v-if="lastRun.changes.length">
+				{{ n('nextcloud-vue', '{count} change: {list}', '{count} changes: {list}', lastRun.changes.length, { count: lastRun.changes.length, list: lastRun.changes.join(', ') }) }}
+			</template>
 		</NcNoteCard>
 	</div>
 </template>
@@ -62,7 +64,7 @@
 <script>
 import axios from '@nextcloud/axios'
 import { emit } from '@nextcloud/event-bus'
-import { translate as t } from '@nextcloud/l10n'
+import { translatePlural as n, translate as t } from '@nextcloud/l10n'
 import { generateUrl } from '@nextcloud/router'
 import { NcButton, NcNoteCard } from '@nextcloud/vue'
 import { declaredMacros } from '../../utils/declaredMacros.js'
@@ -135,6 +137,7 @@ export default {
 
 	methods: {
 		t,
+		n,
 
 		/**
 		 * Translate an app-supplied text through the host app when it offers it.
@@ -188,8 +191,11 @@ export default {
 				const entry = (res?.data?.results || [])[0]
 				const key = entry?.changed?.declaredAction
 				const macro = this.macros.find((candidate) => candidate.key === key)
+				const changes = Array.isArray(entry?.changed?.changes)
+					? entry.changed.changes.map((change) => (change && typeof change.step === 'string' ? change.step : '')).filter(Boolean)
+					: []
 				this.lastRun = macro && entry.created
-					? { name: macro.name, date: new Date(entry.created).toLocaleString() }
+					? { name: this.tr(macro.name), date: new Date(entry.created).toLocaleString(), changes }
 					: null
 			} catch {
 				this.lastRun = null
@@ -208,8 +214,12 @@ export default {
 			this.error = ''
 			try {
 				await axios.post(generateUrl('/apps/openregister/api/objects/{register}/{schema}/{id}/actions/{action}', { register, schema, id, action: macro.key }))
-				this.lastRun = { name: macro.name, date: new Date().toLocaleString() }
+				this.lastRun = { name: this.tr(macro.name), date: new Date().toLocaleString(), changes: [] }
 				emit('cn:page:refresh', { source: 'cn-macros-widget' })
+				// The audit entry of this run says what it changed.
+				const local = this.lastRun
+				await this.loadLastRun()
+				this.lastRun = this.lastRun || local
 			} catch (e) {
 				this.error = t('nextcloud-vue', 'The macro did not run: {error}', { error: e?.response?.data?.error || e?.message || '' })
 			} finally {

package/src/components/CnObjectListWidget/CnObjectListWidget.vue

@@ -315,6 +315,7 @@ import CnPagination from '../CnPagination/CnPagination.vue'
 import CnWidgetEmptyState from '../CnWidgetEmptyState/CnWidgetEmptyState.vue'
 import { useWriteFeedback } from '../../composables/useWriteFeedback.js'
 import { actionLink, dispatchAction, hasActionTargetTokens } from '../../utils/actionsDispatcher.js'
+import { buildExportUrl } from '../../utils/indexExportHelpers.js'
 import { followLinkClick, openRowTarget, resolveHref } from '../../utils/linkNavigation.js'
 import { objectDisplayName, objectFieldValue } from '../../utils/objectName.js'
 import { moveIndex, renumberRows, rowIdOf } from '../../utils/reorderRows.js'
@@ -322,6 +323,7 @@ import { dropOptionalUnresolved, hasUnresolvedTokens, resolveFilterTokens } from
 import { markNewTabHandled } from '../../utils/rowAuxClick.js'
 import { changedKeys } from '../../utils/saveEdited.js'
 import { dispatchObjectCreated } from '../../utils/walkthroughSignals.js'
+import { getCurrentUserGroups } from '../../utils/widgetVisibility.js'
 import { CnRowActions } from '../CnRowActions/index.js'
 
 /**
@@ -450,8 +452,11 @@ export default {
 		 *
 		 * `footnote` is a line under the table, through the host translate.
 		 *
+		 * `export` (`{ label?, format?, group? }`) offers the filtered list as a
+		 * download in the card's header; `group` shows it to one group only.
+		 *
 		 * @spec openspec/changes/zuiddrecht-pixel-gaps/specs/zuiddrecht-pixel-gaps/spec.md#requirement-small-opt-ins-from-the-decidiq-and-learniq-lanes
-		 * @type {{register?: string, schema?: string, filter?: object, sort?: {field?: string, dir?: string}, limit?: number, extend?: Array<string>, columns?: Array, rowActions?: Array<object>, dropZone?: object, upload?: boolean, groupBy?: string, groupLabel?: string, groupLabelResolve?: {register: string, schema: string, labelField?: string}, selectable?: boolean, bulkActions?: Array<object>, sortable?: boolean, facet?: {field: string, label?: string}, rowRoute?: string, prompt?: string, emptyText?: string, footnote?: string, viewAllRoute?: string, viewAllQuery?: object, hideHeader?: boolean}}
+		 * @type {{register?: string, schema?: string, filter?: object, sort?: {field?: string, dir?: string}, limit?: number, extend?: Array<string>, columns?: Array, rowActions?: Array<object>, dropZone?: object, upload?: boolean, groupBy?: string, groupLabel?: string, groupLabelResolve?: {register: string, schema: string, labelField?: string}, selectable?: boolean, bulkActions?: Array<object>, sortable?: boolean, facet?: {field: string, label?: string}, rowRoute?: string, prompt?: string, emptyText?: string, footnote?: string, viewAllRoute?: string, viewAllQuery?: object, hideHeader?: boolean, export?: {label?: string, format?: ('csv'|'excel'), group?: string}}}
 		 */
 		content: {
 			type: Object,
@@ -459,7 +464,7 @@ export default {
 		},
 	},
 
-	emits: ['created', 'updated', 'row-click', 'row-aux-click', 'view-all', 'files-dropped'],
+	emits: ['created', 'updated', 'row-click', 'row-aux-click', 'view-all', 'files-dropped', 'header'],
 
 	data() {
 		return {
@@ -1268,6 +1273,7 @@ export default {
 	mounted() {
 		this.fetchRows()
 		this.loadHeadingsIfNeeded()
+		this.offerExport()
 		// A table wider than the widget fits its columns to the width instead of
 		// scrolling sideways (no inner scrollbars).
 		if (typeof ResizeObserver !== 'undefined') {
@@ -1318,6 +1324,53 @@ export default {
 	},
 
 	methods: {
+		/**
+		 * Offer `content.export` as a button in the card's header: the list as
+		 * it is filtered here, through OpenRegister's export (which applies its
+		 * own read rights to every row). `group` keeps the button to the members
+		 * of one Nextcloud group, a role such as AI oversight; it hides the
+		 * button, and the export endpoint still decides what anyone may read.
+		 *
+		 * @return {Promise<void>}
+		 * @spec openspec/changes/widget-subtitle-and-list-export/specs/object-list-widget/spec.md#requirement-a-list-can-offer-its-rows-as-an-export
+		 */
+		/**
+		 * The export URL for this list as it is filtered here.
+		 *
+		 * @param {'csv'|'excel'} format The export format.
+		 * @return {string} The URL.
+		 */
+		exportUrl(format) {
+			return buildExportUrl(this.content.register, this.content.schema, this.resolvedFilter, format)
+		},
+
+		async offerExport() {
+			const config = this.content && this.content.export
+			if (!config || typeof config !== 'object' || !this.content.register || !this.content.schema) {
+				return
+			}
+			if (typeof config.group === 'string' && config.group !== '') {
+				const groups = await getCurrentUserGroups().catch(() => [])
+				if (!groups.includes(config.group)) {
+					return
+				}
+			}
+			const format = config.format === 'excel' ? 'excel' : 'csv'
+			const label = typeof config.label === 'string' && config.label !== '' ? (typeof this.cnTranslate === 'function' ? this.cnTranslate(config.label) : config.label) : t('nextcloud-vue', 'Download')
+			/**
+			 * @event header The card header's Download action for the list as
+			 * filtered here (`content.export`), handed to the host card.
+			 * @type {{action: {label: string, icon: string, run: Function}}}
+			 */
+			this.$emit('header', {
+				action: {
+					label,
+					icon: 'Download',
+					run: () => window.location.assign(this.exportUrl(format)),
+				},
+			})
+		},
+
 		/**
 		 * Move a row one place up or down (the row actions).
 		 *

package/src/components/CnRecordListWidget/CnRecordListWidget.vue

@@ -58,6 +58,14 @@
 				</tr>
 			</tbody>
 		</table>
+		<!-- notes: a field per row for what happened, recorded on the row's
+		     own notes endpoint (DqDagAfsluiten "Nog open van vandaag"). -->
+		<CnRecordNoteRows
+			v-else-if="presentation === 'notes' && noteAction"
+			:items="items"
+			:action="noteAction"
+			:recordAll="noteRecordAll"
+			:leaf="content.rowLeaf || null" />
 		<ul v-else class="cn-record-list__list">
 			<li
 				v-for="item in items"
@@ -277,6 +285,7 @@ import { inject, ref } from 'vue'
 import ChevronRight from 'vue-material-design-icons/ChevronRight.vue'
 import CnIcon from '../CnIcon/CnIcon.vue'
 import CnStatusBadge from '../CnStatusBadge/CnStatusBadge.vue'
+import CnRecordNoteRows from './CnRecordNoteRows.vue'
 import { useEndpointSource } from '../../composables/useEndpointSource.js'
 import { actionLink, dispatchAction, interpolateActionTarget } from '../../utils/actionsDispatcher.js'
 import { isBadgeVariant } from '../../utils/badgeVariants.js'
@@ -295,7 +304,7 @@ const PAGE_REFRESH_CHANNEL = 'cn:page:refresh'
 
 /** Gives each list's footer reason its own element id. */
 let footerSeq = 0
-const PRESENTATIONS = ['rows', 'feed', 'inline', 'cards', 'notice', 'table']
+const PRESENTATIONS = ['rows', 'feed', 'inline', 'cards', 'notice', 'table', 'notes']
 
 /** The tones a `notice` list takes. */
 const NOTICE_VARIANTS = ['info', 'warning', 'error']
@@ -348,7 +357,7 @@ function unwrap(value) {
 export default {
 	name: 'CnRecordListWidget',
 
-	components: { ChevronRight, CnIcon, CnStatusBadge, NcButton, NcLoadingIcon },
+	components: { ChevronRight, CnIcon, CnRecordNoteRows, CnStatusBadge, NcButton, NcLoadingIcon },
 
 	inject: {
 		/** Detail-page object context (`{ objectId, object, register, schema }`). */
@@ -446,6 +455,8 @@ export default {
 			/** Whether `footerAction.disabledWhen` holds. */
 			footerDisabled: false,
 			footerReasonId: `cn-record-list-footer-reason-${++footerSeq}`,
+			/** The first `emptyTexts` entry whose condition holds, translated; '' for none. */
+			conditionalEmptyText: '',
 		}
 	},
 
@@ -731,10 +742,58 @@ export default {
 		},
 
 		/** @return {string} The empty line. */
+		/**
+		 * `noteAction` with its labels through the host translate, or null
+		 * (`presentation: "notes"`).
+		 *
+		 * @spec openspec/changes/record-list-notes/specs/record-list-notes/spec.md#requirement-a-record-list-can-collect-and-record-a-note-per-row
+		 * @return {object|null}
+		 */
+		noteAction() {
+			const action = this.content?.noteAction
+			if (!action || typeof action !== 'object' || (!action.urlField && !action.url)) {
+				return null
+			}
+			const tr = (text) => (typeof text === 'string' && text !== '' ? this.translate(text) : '')
+			return {
+				...action,
+				label: tr(action.label),
+				fieldLabel: tr(action.fieldLabel),
+				placeholder: tr(action.placeholder),
+				readyLabel: tr(action.readyLabel),
+				errorText: tr(action.errorText),
+			}
+		},
+
+		/**
+		 * `noteAction.recordAll` translated, its cancel link as a route, or null.
+		 *
+		 * @return {object|null}
+		 */
+		noteRecordAll() {
+			const all = this.content?.noteAction?.recordAll
+			if (!all || typeof all !== 'object' || !all.label) {
+				return null
+			}
+			const cancel = all.cancel && all.cancel.label && all.cancel.route
+				? { label: this.translate(all.cancel.label), to: typeof all.cancel.route === 'string' ? { name: all.cancel.route } : all.cancel.route }
+				: null
+			return {
+				label: this.translate(all.label),
+				title: all.title ? this.translate(all.title) : '',
+				text: all.text ? this.translate(all.text) : '',
+				icon: all.icon || '',
+				cancel,
+			}
+		},
+
 		emptyLabel() {
 			if (this.lensReasonText !== '') {
 				return this.lensReasonText
 			}
+			if (this.conditionalEmptyText !== '') {
+				return this.conditionalEmptyText
+			}
 			return this.content?.emptyText ? this.translate(this.content.emptyText) : t('nextcloud-vue', 'Nothing here yet')
 		},
 
@@ -754,6 +813,10 @@ export default {
 			this.fetchRows()
 		},
 
+		rows() {
+			this.evaluateEmptyTexts()
+		},
+
 		footerDisabledKey: {
 			immediate: true,
 			handler() {
@@ -839,6 +902,38 @@ export default {
 		 * @spec openspec/changes/record-list-footer-action/specs/record-list/spec.md#requirement-a-record-list-can-end-with-an-action-that-says-why-it-is-disabled
 		 * @return {Promise<void>}
 		 */
+		/**
+		 * Pick the empty text (`emptyTexts`: `[{ when, text }]`, the first whose
+		 * visibleWhen condition holds), for a list that is empty for more than
+		 * one reason ("Everything you opened today has a note" or "You have not
+		 * opened anything today"). `emptyText` stays the fallback.
+		 *
+		 * @spec openspec/changes/record-list-notes/specs/record-list-notes/spec.md#requirement-a-record-list-can-say-why-it-is-empty
+		 * @return {Promise<void>}
+		 */
+		async evaluateEmptyTexts() {
+			const options = Array.isArray(this.content?.emptyTexts) ? this.content.emptyTexts : []
+			if (options.length === 0 || this.rows.length > 0) {
+				this.conditionalEmptyText = ''
+				return
+			}
+			const run = this.emptyRun = (this.emptyRun || 0) + 1
+			for (const option of options) {
+				if (!option || typeof option.text !== 'string' || !option.when) {
+					continue
+				}
+				const holds = await evaluateVisibleWhen(option.when, this.tokenCtx)
+				if (run !== this.emptyRun) {
+					return
+				}
+				if (holds) {
+					this.conditionalEmptyText = this.translate(option.text)
+					return
+				}
+			}
+			this.conditionalEmptyText = ''
+		},
+
 		async evaluateFooterDisabled() {
 			const cond = this.content?.footerAction?.disabledWhen
 			if (!cond) {
@@ -1103,7 +1198,10 @@ export default {
 		},
 
 		rowLink(row) {
-			const route = this.content?.rowRoute
+			// `rowRouteField`: the route name read from the row, for a list
+			// whose rows open different pages (a case and a task).
+			const byField = this.content?.rowRouteField ? readPath(row, this.content.rowRouteField) : null
+			const route = (typeof byField === 'string' && byField !== '') ? byField : this.content?.rowRoute
 			if (!route || !this.$router || !row) {
 				return null
 			}