@conduction/nextcloud-vue 2.91.0 → 2.93.0

package/src/components/CnDataTable/CnDataTable.vue

@@ -404,6 +404,7 @@ import CnColumnFilterPopover from './CnColumnFilterPopover.vue'
 import { useClickDragGuard } from '../../composables/useClickDragGuard.js'
 import { normalizeLook } from '../../composables/useLook.js'
 import { clearedColumnFilterParams, columnFilterDef, columnFilterParams, columnFilterState, isColumnFilterActive, isColumnSortable } from '../../utils/columnFilters.js'
+import { fillTemplate, joinTemplateParts } from '../../utils/fillTemplate.js'
 import { lensUnavailableText, readLensReports } from '../../utils/lensAvailability.js'
 import { followLinkClick, openRowTarget, resolveHref } from '../../utils/linkNavigation.js'
 import { nextSortState } from '../../utils/multiColumnSort.js'
@@ -420,40 +421,6 @@ import { CnUnreadMarker } from '../CnUnreadMarker/index.js'
 // consuming app does not pull in the library's global css/index.css.
 import '../../css/table.css'
 
-/**
- * Fill a `secondary` template such as `"{identifier} · {requester}"`.
- *
- * A field without a value takes its separator with it: the text between two
- * fields belongs to the field after it, so an empty requester leaves
- * "2026-0002", not "2026-0002 ·", and an empty first field does not leave a
- * leading separator either. Text before the first field and after the last
- * one is kept as written. A template whose fields all have values fills
- * exactly as before.
- *
- * @spec openspec/changes/zuiddrecht-pixel-gaps-3/specs/zuiddrecht-pixel-gaps-3/spec.md#requirement-an-empty-field-takes-its-separator-with-it
- * @param {string} template The template, with `{field}` placeholders.
- * @param {(key: string) => string} valueOf The text of a field ('' when empty).
- * @return {string} The filled template.
- */
-function fillSecondaryTemplate(template, valueOf) {
-	// split() with a capture group alternates literal, field, literal, …
-	const parts = template.split(/\{([^}]+)\}/)
-	const lead = parts[0]
-	const tail = parts[parts.length - 1]
-	let body = ''
-	for (let i = 1; i < parts.length; i += 2) {
-		const value = valueOf(parts[i].trim())
-		if (value === '') {
-			continue
-		}
-		// The literal before this field: the separator, unless nothing has
-		// been written yet (then there is nothing to separate from).
-		const separator = i === 1 ? '' : parts[i - 1]
-		body += (body === '' ? '' : separator) + value
-	}
-	return lead + body + tail
-}
-
 /**
  * CnDataTable — Generic sortable data table for list views.
  *
@@ -561,8 +528,8 @@ export default {
 		 *
 		 * `secondary` draws a second, muted line under the cell's value: a field
 		 * key (`"number"`), a template with `{field}` placeholders
-		 * (`"{number} · {requester}"`, dotted paths allowed), or a function of
-		 * the row. Empty fields leave their placeholder blank; a line that
+		 * (`"{number} · {requester}"`, dotted paths allowed; `{startAt|weekday}`
+		 * formats through `fillTemplate`), or a function of the row. Empty fields leave their placeholder blank; a line that
 		 * resolves to nothing is not drawn.
 		 *
 		 * @type {Array<{key: string, label: string, description: string, sortable: boolean, width: string, class: string, cellClass: string, secondary: (string|((row: object) => string))}|string>}
@@ -1769,8 +1736,10 @@ export default {
 		/**
 		 * The secondary line of a cell, from `col.secondary`: a function is
 		 * called with the row; a string with `{field}` placeholders is a
-		 * template filled from the row (dotted paths allowed); any other
-		 * string is a field key. Returns '' when there is nothing to draw.
+		 * template filled from the row (dotted paths allowed), where a
+		 * `{field|format}` token is formatted by `fillTemplate` ("{startAt|weekday}"
+		 * reads "wo 7 okt"); any other string is a field key. Returns '' when
+		 * there is nothing to draw.
 		 *
 		 * @spec openspec/changes/zuiddrecht-pixel-gaps/specs/zuiddrecht-pixel-gaps/spec.md#requirement-a-table-column-carries-a-secondary-line
 		 * @param {object} row The row.
@@ -1787,7 +1756,9 @@ export default {
 				return ''
 			}
 			if (spec.includes('{')) {
-				const filled = fillSecondaryTemplate(spec, (key) => this.secondaryFieldText(row, key))
+				const filled = joinTemplateParts(spec, (key) => (key.includes('|')
+					? fillTemplate(`{${key}}`, row)
+					: this.secondaryFieldText(row, key)))
 				// A template whose every field is empty leaves only separators:
 				// nothing worth a line.
 				return /[\p{L}\p{N}]/u.test(filled) ? filled.trim() : ''

package/src/components/CnDetailPage/CnDetailPage.vue

@@ -2631,8 +2631,10 @@ export default {
 		/**
 		 * The meta line on row 2 of the board look's header (manifest
 		 * `config.headerMeta`): a field template such as `"via {channel}"`.
-		 * Every `{path}` is read from the record; a line with an empty value
-		 * is dropped. Only the board look draws it.
+		 * Every `{path}` is read from the record (an enum field as its label);
+		 * `{path|format}` formats it (`weekday`, `longdate`, `time`, `user`,
+		 * `currency:EUR`, ...). An empty token drops itself and its separator;
+		 * a line with no value at all is dropped. Only the board look draws it.
 		 *
 		 * @spec openspec/changes/screens-detail-page-parity/specs/detail-page-board-look/spec.md#requirement-the-detail-header-is-two-rows-on-the-ground
 		 */
@@ -2991,7 +2993,7 @@ export default {
 		 * @spec openspec/changes/screens-detail-page-parity/specs/detail-page-board-look/spec.md#requirement-the-detail-header-is-two-rows-on-the-ground
 		 */
 		headerMetaText() {
-			return resolveHeaderMeta(this.headerMeta ? this.effectiveTranslate(this.headerMeta) : '', this.resolvedObject)
+			return resolveHeaderMeta(this.headerMeta ? this.effectiveTranslate(this.headerMeta) : '', this.resolvedObject, { schema: this.currentSchema, translate: this.effectiveTranslate })
 		},
 
 		/**

package/src/components/CnFactsWidget/CnFactsWidget.vue

@@ -257,7 +257,7 @@ export default {
 		/**
 		 * The widget configuration.
 		 *
-		 * - `fields` — the entries, in order. Each is `{ path, label?, as?, format?, map?, itemPath?, parts?, separator?, route?, variant?, variantMap?, colorMap?, icon?, copy?, reveal?, text?, title?, subtitle?, initialsPath?, tone? }`.
+		 * - `fields` — the entries, in order. Each is `{ path, label?, as?, from?, format?, map?, itemPath?, parts?, separator?, route?, variant?, variantMap?, colorMap?, icon?, copy?, reveal?, text?, title?, subtitle?, initialsPath?, tone? }`.
 		 *   `as` is `row` (default when `label` or `icon` is set), `title`, `line`, `text` (a line in the normal ink), `lead` (an icon tile or initials beside `title` and `subtitle`) or `pill`.
 		 *   A row's `format` may also be `email`, `phone` or `url` (a link) or `masked` (the last four characters; `reveal: true` adds Show). `copy: true` adds a copy button; `icon` replaces the label.
 		 *   A part may be `{ text }`, a constant; a `line` or `text` entry without `path` or `parts` shows its `text`.
@@ -265,7 +265,7 @@ export default {
 		 * - `action` — an action drawn as a button under the facts; `headerAction` — one drawn in the card header (reported through the `header` event).
 		 *   `format` is `text` (default), `date` (board short date), `date-long` (always with the year), `list` (an array joined by ", ", each item read at `itemPath`) or `currency` (a money amount in the reader's language, "€ 1.234,50": the code in `currency`, else the record's `currencyField`, else the app's reporting currency, else EUR; `decimals` defaults to 2).
 		 *   `map` turns a raw value into a label (translated). `parts` (on a `line`) lists paths, or `{ path, label?, format? }`, joined by `separator` (default " · "); empty parts are dropped.
-		 * - `source` — `{ register, schema, id }` or `{ url }`; omitted = the current object.
+		 * - `source` — `{ register, schema, id }` or `{ url }`; omitted = the current object. An entry with `from: "object"` reads the current object even then (a client card that also shows the ticket's channel).
 		 * - `link` — `{ label, route? | href? }` at the foot.
 		 * - `hideEmpty` — drop an entry whose value is empty (default true).
 		 * - `emptyText` — shown when no entry has a value.
@@ -370,8 +370,8 @@ export default {
 		 * @return {Array<object>}
 		 */
 		blocks() {
-			const record = this.record
-			if (!record) {
+			const sourceRecord = this.record
+			if (!sourceRecord) {
 				return []
 			}
 			const fields = Array.isArray(this.content?.fields) ? this.content.fields : []
@@ -381,6 +381,8 @@ export default {
 				if (!field || typeof field !== 'object') {
 					return
 				}
+				// `from: "object"` reads the page's own object while the card shows a `source`.
+				const record = field.from === 'object' && this.objectData ? this.objectData : sourceRecord
 				const kind = this.kindOf(field)
 				const key = String(field.key || field.path || `${kind}-${index}`).replace(/[^\w-]/g, '-')
 				const value = this.entryValue(record, field, kind)

package/src/components/CnFeaturesAndRoadmapPage/CnFeaturesAndRoadmapPage.vue

@@ -29,7 +29,11 @@
 		:llmSkillsUrl="resolvedLlmSkillsUrl"
 		:suggestUrl="resolvedSuggestUrl"
 		:documentationUrl="resolvedDocumentationUrl"
-		:capabilityComparison="resolvedCapabilityComparison" />
+		:capabilityComparison="resolvedCapabilityComparison"
+		:categories="categories || {}"
+		:board="board || {}"
+		:title="title"
+		:appVersion="resolvedAppVersion" />
 </template>
 
 <script>
@@ -188,6 +192,47 @@ export default {
 			default: null,
 		},
 
+		/**
+		 * Feature category key to caption, for the board look's groups.
+		 * Manifest `config.categories`.
+		 *
+		 * @type {object|null}
+		 */
+		categories: {
+			type: Object,
+			default: null,
+		},
+
+		/**
+		 * Board look options (`layout`, `tabs`, `filter`, `statusLabels`,
+		 * `next`, `issueLabels`, `subtitle`, `notice`, `documentationButton`,
+		 * `suggestButton`). Manifest `config.board`; see CnFeaturesBoard.
+		 *
+		 * @type {object|null}
+		 */
+		board: {
+			type: Object,
+			default: null,
+		},
+
+		/**
+		 * Page title, lifted from the manifest page's `title`. Shown in the
+		 * board look.
+		 */
+		title: {
+			type: String,
+			default: '',
+		},
+
+		/**
+		 * The app version for the board look's subtitle. Manifest config >
+		 * initialState (`features_roadmap_app_version`) > ''.
+		 */
+		appVersion: {
+			type: String,
+			default: '',
+		},
+
 		/**
 		 * Override for the appId used to namespace loadState lookups.
 		 * Tests pass an explicit value; production reads it from the
@@ -283,6 +328,11 @@ export default {
 				|| readInitialState(this.effectiveAppId, 'features_roadmap_suggest_url', '')
 		},
 
+		resolvedAppVersion() {
+			return this.appVersion
+				|| readInitialState(this.effectiveAppId, 'features_roadmap_app_version', '')
+		},
+
 		resolvedDocumentationUrl() {
 			return this.documentationUrl
 				|| readInitialState(this.effectiveAppId, 'features_roadmap_documentation_url', '')

package/src/components/CnFeaturesAndRoadmapView/CnFeaturesAndRoadmapView.vue

@@ -7,6 +7,19 @@
 				</template>
 			</NcEmptyContent>
 		</div>
+		<CnFeaturesBoard
+			v-else-if="isBoardLook"
+			:features="features"
+			:categories="categories"
+			:repo="repo"
+			:title="title"
+			:appVersion="appVersion"
+			:documentationUrl="resolvedDocumentationUrl"
+			:suggestUrl="resolvedSuggestUrl"
+			:openbuiltUrl="resolvedOpenbuiltUrl"
+			:llmSkillsUrl="resolvedLlmSkillsUrl"
+			v-bind="boardOptions"
+			@support="openSupportDialog" />
 		<template v-else>
 			<header class="cn-features-and-roadmap-view__header">
 				<h2 class="cn-features-and-roadmap-view__title">
@@ -57,19 +70,18 @@
 					:comparison="capabilityComparison" />
 				<CnRoadmapTab v-else :repo="repo" />
 			</main>
-
-			<CnSupportDialog
-				v-if="showSupportDialog"
-				:appName="resolvedAppName"
-				:appSlug="resolvedAppSlug"
-				:appStoreUrl="resolvedAppStoreUrl"
-				:featureRequestUrl="resolvedFeatureRequestUrl"
-				:donateUrl="donateUrl"
-				:supportUrl="supportUrl"
-				:founderName="founderName"
-				:founderTitle="founderTitle"
-				@close="showSupportDialog = false" />
 		</template>
+		<CnSupportDialog
+			v-if="showSupportDialog && !disabled"
+			:appName="resolvedAppName"
+			:appSlug="resolvedAppSlug"
+			:appStoreUrl="resolvedAppStoreUrl"
+			:featureRequestUrl="resolvedFeatureRequestUrl"
+			:donateUrl="donateUrl"
+			:supportUrl="supportUrl"
+			:founderName="founderName"
+			:founderTitle="founderTitle"
+			@close="showSupportDialog = false" />
 	</div>
 </template>
 
@@ -111,9 +123,11 @@ import RoadVariant from 'vue-material-design-icons/RoadVariant.vue'
 import TableSearch from 'vue-material-design-icons/TableSearch.vue'
 import CnCapabilityTable from '../CnCapabilityTable/CnCapabilityTable.vue'
 import CnFeaturesAndRoadmapSidebar from '../CnFeaturesAndRoadmapSidebar/CnFeaturesAndRoadmapSidebar.vue'
+import CnFeaturesBoard from '../CnFeaturesBoard/CnFeaturesBoard.vue'
 import CnFeaturesTab from '../CnFeaturesTab/CnFeaturesTab.vue'
 import CnRoadmapTab from '../CnRoadmapTab/CnRoadmapTab.vue'
 import CnSupportDialog from '../CnSupportDialog/CnSupportDialog.vue'
+import { normalizeLook } from '../../composables/useLook.js'
 import { warnCapabilityComparisonDeprecated } from '../../utils/capabilityComparison.js'
 import { buildFeatureRequestUrl, DEFAULT_FORGE } from '../../utils/forge.js'
 
@@ -137,6 +151,7 @@ export default {
 		RoadVariant,
 		TableSearch,
 		CnCapabilityTable,
+		CnFeaturesBoard,
 		CnFeaturesTab,
 		CnRoadmapTab,
 		CnSupportDialog,
@@ -158,6 +173,8 @@ export default {
 		 * unmount. Same holder CnIndexPage uses.
 		 */
 		cnIndexSidebarConfig: { default: () => ({ value: null }) },
+		/** The app's look, provided by CnAppRoot (`nextcloud` or `board`). */
+		cnLook: { default: 'nextcloud' },
 	},
 
 	props: {
@@ -192,6 +209,46 @@ export default {
 			default: () => [],
 		},
 
+		/**
+		 * Feature category key to caption, in the order the board look shows
+		 * the groups. A feature names its group with `category`.
+		 *
+		 * @type {object}
+		 */
+		categories: {
+			type: Object,
+			default: () => ({}),
+		},
+
+		/**
+		 * Board look options, passed to CnFeaturesBoard: `layout` (`cards` or
+		 * `rows`), `tabs`, `filter` (`chips` or `segmented`), `statusLabels`,
+		 * `next`, `issueLabels`, `subtitle`, `notice`, `documentationButton`
+		 * and `suggestButton`. Ignored in the default look.
+		 *
+		 * @type {object}
+		 */
+		board: {
+			type: Object,
+			default: () => ({}),
+		},
+
+		/**
+		 * Page title in the board look. Empty reads "Features and roadmap".
+		 */
+		title: {
+			type: String,
+			default: '',
+		},
+
+		/**
+		 * The app version, for `{appVersion}` in the board look's subtitle.
+		 */
+		appVersion: {
+			type: String,
+			default: '',
+		},
+
 		/**
 		 * Admin opt-out flag — when true the entire view collapses to a
 		 * single "disabled by admin" empty state.
@@ -387,6 +444,32 @@ export default {
 	},
 
 	computed: {
+		/**
+		 * Whether the page is drawn in the board look.
+		 *
+		 * @return {boolean}
+		 */
+		isBoardLook() {
+			return normalizeLook(this.cnLook) === 'board'
+		},
+
+		/**
+		 * The board options CnFeaturesBoard declares, so an unknown key in the
+		 * manifest never lands on its root element as an attribute.
+		 *
+		 * @return {object}
+		 */
+		boardOptions() {
+			const keys = ['layout', 'tabs', 'filter', 'statusLabels', 'next', 'issueLabels', 'subtitle', 'notice', 'documentationButton', 'suggestButton']
+			const options = {}
+			for (const key of keys) {
+				if (this.board && this.board[key] !== undefined && this.board[key] !== null) {
+					options[key] = this.board[key]
+				}
+			}
+			return options
+		},
+
 		/**
 		 * The stops the header toggle cycles through. Without a capability
 		 * comparison this is the two-stop list every consumer has today, and
@@ -580,7 +663,9 @@ export default {
 			if (!this.cnHostsIndexSidebar || !this.cnIndexSidebarConfig) {
 				return
 			}
-			if (this.disabled) {
+			// The board look has no right-hand column: its links sit in the
+			// board's Actions menu.
+			if (this.disabled || this.isBoardLook) {
 				this.cnIndexSidebarConfig.value = null
 				return
 			}