@conduction/nextcloud-vue 2.60.0 → 2.61.0

package/src/components/CnLinkCardsPage/CnLinkCardsPage.vue

@@ -0,0 +1,484 @@
+<!--
+  - SPDX-FileCopyrightText: 2026 Conduction B.V.
+  - SPDX-License-Identifier: EUPL-1.2
+-->
+
+<template>
+	<div class="cn-link-cards-page" data-testid="cn-link-cards-page">
+		<div class="cn-link-cards-page__header">
+			<h2 v-if="resolvedTitle" class="cn-link-cards-page__title">
+				{{ resolvedTitle }}
+			</h2>
+			<p v-if="resolvedDescription" class="cn-link-cards-page__description">
+				{{ resolvedDescription }}
+			</p>
+		</div>
+
+		<p
+			v-if="groups.length === 0"
+			class="cn-link-cards-page__empty"
+			data-testid="cn-link-cards-empty">
+			{{ resolvedEmptyLabel }}
+		</p>
+
+		<section
+			v-for="group in groups"
+			:key="group.key"
+			class="cn-link-cards-page__group"
+			:aria-labelledby="group.label ? group.headingId : null"
+			:aria-label="group.label ? null : resolvedTitle || null"
+			data-testid="cn-link-cards-group"
+			:data-group="group.key">
+			<h3
+				v-if="group.label"
+				:id="group.headingId"
+				class="cn-link-cards-page__caption">
+				{{ group.label }}
+			</h3>
+			<ul class="cn-link-cards-page__grid">
+				<li v-for="card in group.cards" :key="card.id" class="cn-link-cards-page__cell">
+					<!-- A real <a href>, so the card can be middle-clicked, copied
+					     and announced as a link. A plain click on an in-app card
+					     is routed, which keeps the page from reloading. -->
+					<a
+						class="cn-link-cards-page__card"
+						data-testid="cn-link-card"
+						:data-card-id="card.id"
+						:href="card.url"
+						:target="card.external ? '_blank' : null"
+						:rel="card.external ? 'noopener noreferrer' : null"
+						:aria-describedby="card.description ? card.descriptionId : null"
+						@click="open(card, $event)">
+						<CnIcon
+							v-if="card.icon"
+							:name="card.icon"
+							:size="24"
+							class="cn-link-cards-page__icon"
+							aria-hidden="true" />
+						<span class="cn-link-cards-page__body">
+							<span class="cn-link-cards-page__label">{{ card.label }}</span>
+							<span
+								v-if="card.description"
+								:id="card.descriptionId"
+								class="cn-link-cards-page__card-description">
+								{{ card.description }}
+							</span>
+						</span>
+					</a>
+				</li>
+			</ul>
+		</section>
+	</div>
+</template>
+
+<script>
+import { translate as t } from '@nextcloud/l10n'
+import { isAppInstalled } from '../../utils/appInstalled.js'
+import { followLinkClick, resolveHref } from '../../utils/linkNavigation.js'
+import { passesContextPredicates } from '../../utils/visibleIfContext.js'
+import { CnIcon } from '../CnIcon/index.js'
+
+let linkCardsPageUid = 0
+
+/**
+ * CnLinkCardsPage: the `type: "links"` page. Link cards, grouped under captions.
+ *
+ * One page that opens every page a short menu leaves out. A card has a
+ * label, a one-line description, an optional icon and a target. Groups come
+ * from `categories`, in the order they are declared; a card names its group
+ * with `category`.
+ *
+ * ```json
+ * { "id": "Modules", "route": "/modules", "type": "links", "title": "Modules and more",
+ *   "config": {
+ *     "description": "Every page that is not in the daily menu.",
+ *     "categories": { "sales": "Sales", "marketing": "Marketing" },
+ *     "cards": [
+ *       { "id": "Leads", "label": "Leads", "description": "Every deal you are working on.",
+ *         "icon": "CashMultiple", "category": "sales", "route": "Leads" }
+ *     ]
+ *   } }
+ * ```
+ *
+ * Every string goes through the app's translate function. A card is hidden
+ * by the same `visibleIf` and `permission` a menu entry takes, and a group
+ * with no visible card is not drawn.
+ */
+export default {
+	name: 'CnLinkCardsPage',
+
+	components: { CnIcon },
+
+	inject: {
+		/** The app's translate function, provided by CnAppRoot. Identity outside one. */
+		cnTranslate: { default: () => (key) => key },
+		/** The effective manifest, for `visibleIf` predicates against `runtime`. */
+		cnManifest: { default: null },
+		/** The permissions the user holds. Empty means the app did not say, and allows. */
+		cnPermissions: { default: () => [] },
+	},
+
+	props: {
+		/** The whole manifest page, for a host that mounts this component itself. CnPageRenderer passes the flattened props below instead. */
+		page: {
+			type: Object,
+			default: () => ({}),
+		},
+
+		/**
+		 * The cards: `{ id, label, description?, icon?, category?, route?, params?, query?, href?, visibleIf?, permission? }`.
+		 * `route` is a route name, or a path when it starts with `/`.
+		 *
+		 * @type {Array<object>|null}
+		 */
+		cards: {
+			type: Array,
+			default: null,
+		},
+
+		/**
+		 * Group key to caption. Sets the order of the groups.
+		 *
+		 * @type {Record<string, string>|null}
+		 */
+		categories: {
+			type: Object,
+			default: null,
+		},
+
+		/** The heading. */
+		title: {
+			type: String,
+			default: null,
+		},
+
+		/** The lead paragraph under the heading. */
+		description: {
+			type: String,
+			default: null,
+		},
+
+		/** Text shown when no card is visible. */
+		emptyLabel: {
+			type: String,
+			default: null,
+		},
+
+		/**
+		 * Translate function. Falls back to the injected `cnTranslate`.
+		 *
+		 * @type {((key: string) => string)|null}
+		 */
+		translate: {
+			type: Function,
+			default: null,
+		},
+	},
+
+	data() {
+		linkCardsPageUid += 1
+		return {
+			uid: linkCardsPageUid,
+		}
+	},
+
+	computed: {
+		/**
+		 * The config, from the flattened props or from `page.config`. Props win.
+		 *
+		 * @return {object} The config.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-a-links-page-renders-grouped-link-cards
+		 */
+		config() {
+			const fromPage = (this.page && this.page.config) || {}
+			const fromProps = {}
+			for (const key of ['cards', 'categories', 'description', 'title', 'emptyLabel']) {
+				if (this[key] !== null && this[key] !== undefined) {
+					fromProps[key] = this[key]
+				}
+			}
+			return { ...fromPage, ...fromProps }
+		},
+
+		/**
+		 * The heading, translated.
+		 *
+		 * @return {string} The title, or '' when the page declares none.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-a-links-page-renders-grouped-link-cards
+		 */
+		resolvedTitle() {
+			return this.tr(this.config.title || (this.page && this.page.title) || '')
+		},
+
+		/**
+		 * The lead paragraph, translated.
+		 *
+		 * @return {string} The description.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-a-links-page-renders-grouped-link-cards
+		 */
+		resolvedDescription() {
+			return this.tr(this.config.description || '')
+		},
+
+		/**
+		 * The empty-state text.
+		 *
+		 * @return {string} The text.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-a-links-page-renders-grouped-link-cards
+		 */
+		resolvedEmptyLabel() {
+			return this.config.emptyLabel ? this.tr(this.config.emptyLabel) : t('nextcloud-vue', 'Nothing to open here.')
+		},
+
+		/**
+		 * The cards a reader may see and can open, with text translated and
+		 * the link resolved. A card that is gated away, or has no target that
+		 * resolves, is left out: a card that does nothing is worse than none.
+		 *
+		 * @return {Array<object>} The cards.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-a-card-is-a-real-link
+		 */
+		visibleCards() {
+			const declared = Array.isArray(this.config.cards) ? this.config.cards : []
+			const runtime = this.cnManifest?.runtime ?? null
+			return declared
+				.filter((card) => card && card.id && card.label)
+				.filter((card) => this.passesPermission(card) && this.passesVisibleIf(card, runtime))
+				.map((card) => {
+					const target = this.targetOf(card)
+					return {
+						id: String(card.id),
+						label: this.tr(card.label),
+						description: this.tr(card.description || ''),
+						descriptionId: `cn-link-card-desc-${this.uid}-${String(card.id).replace(/[^A-Za-z0-9_-]/g, '-')}`,
+						icon: card.icon || '',
+						category: card.category || '',
+						external: target.external,
+						location: target.location,
+						url: target.url,
+					}
+				})
+				.filter((card) => card.url !== '')
+		},
+
+		/**
+		 * The groups to draw: ungrouped cards first under no caption, then
+		 * one group per category in declaration order. A group without a
+		 * visible card is left out.
+		 *
+		 * @return {Array<{key: string, label: string, headingId: string, cards: Array<object>}>} The groups.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-a-links-page-renders-grouped-link-cards
+		 */
+		groups() {
+			const declared = (this.config.categories && typeof this.config.categories === 'object') ? this.config.categories : {}
+			const keys = Object.keys(declared)
+			const loose = this.visibleCards.filter((card) => !keys.includes(card.category))
+			const groups = loose.length > 0 ? [{ key: '', label: '', headingId: '', cards: loose }] : []
+			keys.forEach((key, index) => {
+				const cards = this.visibleCards.filter((card) => card.category === key)
+				if (cards.length > 0) {
+					groups.push({
+						key,
+						label: this.tr(declared[key]),
+						headingId: `cn-link-cards-group-${this.uid}-${index}`,
+						cards,
+					})
+				}
+			})
+			return groups
+		},
+	},
+
+	methods: {
+		/**
+		 * Translate a manifest string through the app's translate function.
+		 *
+		 * @param {string} value The declared string.
+		 * @return {string} The translation, or the input unchanged.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-a-links-page-renders-grouped-link-cards
+		 */
+		tr(value) {
+			if (typeof value !== 'string' || value === '') {
+				return value
+			}
+			return (this.translate ?? this.cnTranslate)(value)
+		},
+
+		/**
+		 * Whether the user holds the card's `permission`. Same rule as the
+		 * menu: no permission declared, or no permissions known, allows.
+		 *
+		 * @param {object} card The card.
+		 * @return {boolean} True when the card may render.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-cards-honour-menu-visibility-conditions
+		 */
+		passesPermission(card) {
+			const held = Array.isArray(this.cnPermissions) ? this.cnPermissions : []
+			if (!card.permission || held.length === 0) {
+				return true
+			}
+			return held.includes(card.permission)
+		},
+
+		/**
+		 * Evaluate a card's `visibleIf` the way CnAppNav evaluates a menu
+		 * entry's: `appInstalled` first, then dot-path predicates against
+		 * the manifest's `runtime`.
+		 *
+		 * @param {object} card The card.
+		 * @param {object|null} runtime `manifest.runtime`, or null.
+		 * @return {boolean} True when the card may render.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-cards-honour-menu-visibility-conditions
+		 */
+		passesVisibleIf(card, runtime) {
+			const condition = card.visibleIf
+			if (!condition || typeof condition !== 'object') {
+				return true
+			}
+			if (condition.appInstalled && !isAppInstalled(condition.appInstalled)) {
+				return false
+			}
+			return passesContextPredicates(condition, runtime)
+		},
+
+		/**
+		 * Where a card goes. An `href` is an external URL. A `route` is a
+		 * route name, or a path when it starts with `/`, resolved by the
+		 * router so the link carries the app's base with or without
+		 * `/index.php`.
+		 *
+		 * @param {object} card The card.
+		 * @return {{external: boolean, location: object|null, url: string}} The target; `url` is '' when it cannot be resolved.
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-a-card-is-a-real-link
+		 */
+		targetOf(card) {
+			if (typeof card.route === 'string' && card.route !== '') {
+				const location = card.route.startsWith('/') ? { path: card.route } : { name: card.route }
+				if (card.params && typeof card.params === 'object') {
+					location.params = card.params
+				}
+				if (card.query && typeof card.query === 'object') {
+					location.query = card.query
+				}
+				return { external: false, location, url: resolveHref(location, this.$router) }
+			}
+			if (typeof card.href === 'string' && card.href !== '') {
+				return { external: true, location: null, url: card.href }
+			}
+			return { external: false, location: null, url: '' }
+		},
+
+		/**
+		 * Route a plain click on an in-app card. A modified or middle click,
+		 * and every click on an external card, is left to the browser.
+		 *
+		 * @param {object} card The resolved card.
+		 * @param {MouseEvent} event The click.
+		 * @return {void}
+		 * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-a-card-is-a-real-link
+		 */
+		open(card, event) {
+			if (card.external || !card.location) {
+				return
+			}
+			followLinkClick(event, card.location, this.$router)
+		},
+	},
+}
+</script>
+
+<style scoped>
+.cn-link-cards-page {
+	display: flex;
+	flex-direction: column;
+	gap: calc(6 * var(--default-grid-baseline));
+	padding: calc(5 * var(--default-grid-baseline));
+}
+
+.cn-link-cards-page__title {
+	margin: 0 0 var(--default-grid-baseline);
+}
+
+.cn-link-cards-page__description,
+.cn-link-cards-page__empty {
+	color: var(--color-text-maxcontrast);
+	margin: 0;
+	max-width: 70ch;
+}
+
+.cn-link-cards-page__group {
+	display: flex;
+	flex-direction: column;
+	gap: calc(3 * var(--default-grid-baseline));
+}
+
+.cn-link-cards-page__caption {
+	color: var(--color-text-maxcontrast);
+	font-size: 0.85em;
+	font-weight: 600;
+	letter-spacing: 0.06em;
+	margin: 0;
+	text-transform: uppercase;
+}
+
+.cn-link-cards-page__grid {
+	display: grid;
+	gap: calc(3 * var(--default-grid-baseline));
+	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
+	list-style: none;
+	margin: 0;
+	padding: 0;
+}
+
+.cn-link-cards-page__cell {
+	display: flex;
+}
+
+.cn-link-cards-page__card {
+	align-items: flex-start;
+	background: var(--color-main-background);
+	border: 1px solid var(--color-border-dark);
+	border-radius: var(--border-radius-large);
+	color: var(--color-main-text);
+	display: flex;
+	flex: 1;
+	gap: calc(3 * var(--default-grid-baseline));
+	min-width: 0;
+	padding: calc(4 * var(--default-grid-baseline));
+	text-decoration: none;
+}
+
+.cn-link-cards-page__card:hover {
+	background: var(--color-background-hover);
+	border-color: var(--color-primary-element);
+}
+
+.cn-link-cards-page__card:focus-visible {
+	border-color: var(--color-primary-element);
+	outline: 2px solid var(--color-primary-element);
+	outline-offset: 2px;
+}
+
+.cn-link-cards-page__icon {
+	color: var(--color-primary-element);
+	flex: none;
+}
+
+.cn-link-cards-page__body {
+	display: flex;
+	flex-direction: column;
+	gap: var(--default-grid-baseline);
+	min-width: 0;
+}
+
+.cn-link-cards-page__label {
+	font-weight: 600;
+	overflow-wrap: anywhere;
+}
+
+.cn-link-cards-page__card-description {
+	color: var(--color-text-maxcontrast);
+	font-size: 0.9em;
+	line-height: 1.4;
+}
+</style>

package/src/components/CnLinkCardsPage/index.js

@@ -0,0 +1,4 @@
+import CnLinkCardsPage from './CnLinkCardsPage.vue'
+
+export default CnLinkCardsPage
+export { CnLinkCardsPage }

package/src/components/CnPageRenderer/pageTypes.js

@@ -57,6 +57,7 @@ export const defaultPageTypes = {
 	map: defineAsyncComponent(() => import('../CnMapPage/CnMapPage.vue').then((m) => m.default)),
 	roadmap: defineAsyncComponent(() => import('../CnFeaturesAndRoadmapPage/CnFeaturesAndRoadmapPage.vue').then((m) => m.default)),
 	reports: defineAsyncComponent(() => import('../CnReportsPage/CnReportsPage.vue').then((m) => m.default)),
+	links: defineAsyncComponent(() => import('../CnLinkCardsPage/CnLinkCardsPage.vue').then((m) => m.default)),
 	store: defineAsyncComponent(() => import('../CnStorePage/CnStorePage.vue').then((m) => m.default)),
 	search: defineAsyncComponent(() => import('../CnSearchPage/CnSearchPage.vue').then((m) => m.default)),
 	wiki: defineAsyncComponent(() => import('../CnWikiPage/CnWikiPage.vue').then((m) => m.default)),

package/src/components/index.js

@@ -221,6 +221,7 @@ export { CnFlowEditorPage, CnFlowsPage } from './CnFlowsPage/index.js'
 export { default as CnWidgetRefItem } from './CnWidgetRefItem/index.js'
 export { CnReportsPage } from './CnReportsPage/index.js'
 export { CnStorePage } from './CnStorePage/index.js'
+export { CnLinkCardsPage } from './CnLinkCardsPage/index.js'
 export { CnPageRenderer, defaultPageTypes } from './CnPageRenderer/index.js'
 export { CnAppNav } from './CnAppNav/index.js'
 export { CnAppLoading } from './CnAppLoading/index.js'

package/src/css/detail-page.css

@@ -73,9 +73,17 @@
 	font-weight: 700;
 	line-height: 1.3;
 	color: var(--color-main-text);
-	white-space: nowrap;
+	/* Two lines, then an ellipsis. One line cut a long case title short on a
+	   page with room to spare, and the title is the one thing that says which
+	   record this is. The element carries the full text as its `title`, so a
+	   title cut after two lines is still reachable. `overflow-wrap` breaks a
+	   word longer than the line, which nowrap used to hide. */
+	display: -webkit-box;
+	-webkit-box-orient: vertical;
+	-webkit-line-clamp: 2;
+	line-clamp: 2;
 	overflow: hidden;
-	text-overflow: ellipsis;
+	overflow-wrap: anywhere;
 }
 
 .cn-detail-page__subtitle {

package/src/index.js

@@ -311,6 +311,13 @@ export { CnOpenBuildEditButton } from './components/index.js'
 // control, and the brand stripe.
 export { CnBrandStripe, CnSegmentedControl, CnStackedBarWidget, CnStackedBarWidgetForm, CnWeekStripWidget, CnWeekStripWidgetForm } from './components/index.js'
 
+// Page components the page renderer mounts by `pages[].type` that were missing
+// from this entry. A component reachable from a manifest but not importable
+// here resolves to `undefined` in a host that mounts it by hand, and renders
+// nothing without an error. tests/packaging/page-types-are-exported.spec.js
+// keeps the two lists together.
+export { CnFormPage, CnLinkCardsPage, CnMapPage, CnReportsPage, CnStorePage, CnWikiPage } from './components/index.js'
+
 // AI Chat Companion component family
 export {
 	CnAiAgentPicker,

package/src/schemas/app-manifest-v2.schema.json

@@ -1328,6 +1328,29 @@
 				}
 			}
 		},
+		"linkCard": {
+			"type": "object",
+			"required": ["id", "label"],
+			"additionalProperties": false,
+			"description": "One card on a type='links' page: a link to another page of the app, or to a URL. Same vocabulary as menuItem and navCardEntry.",
+			"properties": {
+				"id": { "type": "string", "minLength": 1, "description": "Unique within the page's cards." },
+				"label": { "type": "string", "minLength": 1, "description": "i18n key / text of the card's title." },
+				"description": { "type": "string", "description": "i18n key / one line under the title." },
+				"icon": { "type": "string", "description": "MDI icon name (e.g. 'CashMultiple')." },
+				"category": { "type": "string", "description": "Key in config.categories naming the group this card sits in. A card without one, or with an unknown one, renders first under no caption." },
+				"route": { "type": "string", "minLength": 1, "description": "Route name (a pages[].id), or a router path when it starts with '/'. Resolved through the router, so it works with and without /index.php. Mutually exclusive with href." },
+				"params": { "type": "object", "description": "Route params passed along with `route`.", "additionalProperties": { "type": ["string", "number"] } },
+				"query": { "type": "object", "description": "Query passed along with `route`.", "additionalProperties": { "type": ["string", "number", "boolean"] } },
+				"href": { "type": "string", "minLength": 1, "description": "External URL, opened in a new tab. Mutually exclusive with route." },
+				"permission": { "type": "string", "description": "Permission the user must hold for the card to render. Same rule as menuItem.permission." },
+				"visibleIf": { "$ref": "#/$defs/visibleIfCondition", "description": "Display condition, evaluated the way a menu entry's is." }
+			},
+			"allOf": [
+				{ "not": { "required": ["route", "href"] } },
+				{ "anyOf": [{ "required": ["route"] }, { "required": ["href"] }] }
+			]
+		},
 		"navCardEntry": {
 			"type": "object",
 			"required": ["id", "label"],
@@ -2858,8 +2881,8 @@
 				"type": {
 					"type": "string",
 					"enum": ["index", "detail", "dashboard", "logs", "settings", "chat", "files", "form", "map", "roadmap", "reports",
-						"store", "search", "wiki", "flow", "flows", "flow-detail", "custom"],
-					"description": "Page type. Closed enum of 17 supported types. 'flow' opens ONE flow in the editor; the flow LIST is an ordinary 'index' with config.entitySource='flows'. 'flows' and 'flow-detail' are DEPRECATED aliases kept for migration — 'flows' predates named index sources and 'flow-detail' is the old name for 'flow'. 'roadmap' mounts CnFeaturesAndRoadmapPage (features + GitHub-issue-backed roadmap). 'search' mounts CnSearchPage (cross-schema query + facet sidebar + results list; consumers wire the actual search via @search). 'wiki' mounts CnWikiPage (manifest-declared markdown article + optional sidebar tree; MUST declare config.register + config.schema). 'flow' and the deprecated 'flow-detail' both mount CnFlowEditorPage (the shared node/edge canvas) and take config.app to scope to the owning app. A flow lives in OpenRegister's native flow store rather than a register/schema pair, so a single flow cannot be a 'detail' page — but the LIST is a plain 'index' once a named entitySource supplies it, which is why 'flows' is deprecated (ADR-110 Decision 4). 'custom' requires a _note field explaining why a standard type was not feasible."
+						"links", "store", "search", "wiki", "flow", "flows", "flow-detail", "custom"],
+					"description": "Page type. Closed enum of 18 supported types. 'links' mounts CnLinkCardsPage: a page of link cards grouped under captions, declared with config.categories + config.cards ($defs/linkCard). Use it for the pages a short menu leaves out; unlike 'reports' an app may have several. 'flow' opens ONE flow in the editor; the flow LIST is an ordinary 'index' with config.entitySource='flows'. 'flows' and 'flow-detail' are DEPRECATED aliases kept for migration — 'flows' predates named index sources and 'flow-detail' is the old name for 'flow'. 'roadmap' mounts CnFeaturesAndRoadmapPage (features + GitHub-issue-backed roadmap). 'search' mounts CnSearchPage (cross-schema query + facet sidebar + results list; consumers wire the actual search via @search). 'wiki' mounts CnWikiPage (manifest-declared markdown article + optional sidebar tree; MUST declare config.register + config.schema). 'flow' and the deprecated 'flow-detail' both mount CnFlowEditorPage (the shared node/edge canvas) and take config.app to scope to the owning app. A flow lives in OpenRegister's native flow store rather than a register/schema pair, so a single flow cannot be a 'detail' page — but the LIST is a plain 'index' once a named entitySource supplies it, which is why 'flows' is deprecated (ADR-110 Decision 4). 'custom' requires a _note field explaining why a standard type was not feasible."
 				},
 				"title": {
 					"type": "string",
@@ -3652,6 +3675,25 @@
 						"required": ["config"]
 					}
 				},
+				{
+					"description": "type='links' (CnLinkCardsPage) renders config.cards as link cards grouped by config.categories. It MUST declare a non-empty cards list, and every card is a $defs/linkCard, so a card that can go nowhere is refused here and not dropped in silence at render time (link-cards-page).",
+					"if": { "properties": { "type": { "const": "links" } }, "required": ["type"] },
+					"then": {
+						"properties": {
+							"config": {
+								"type": "object",
+								"required": ["cards"],
+								"properties": {
+									"description": { "type": "string" },
+									"emptyLabel": { "type": "string" },
+									"categories": { "type": "object", "additionalProperties": { "type": "string", "minLength": 1 } },
+									"cards": { "type": "array", "minItems": 1, "items": { "$ref": "#/$defs/linkCard" } }
+								}
+							}
+						},
+						"required": ["config"]
+					}
+				},
 				{
 					"description": "type='custom' requires _note documenting why decomposition into a standard page type was not feasible. Relaxed by ConductionNL/nextcloud-vue#315: when `component` matches the lib `Cn[A-Z]\\w+` pattern, the component name already documents the choice and _note is optional. When `component` is absent or non-Cn (host-app SFC), _note remains required.",
 					"if": {

package/src/types/manifest.d.ts

@@ -27,7 +27,7 @@
  */
 export type TPageType =
 	| 'index' | 'detail' | 'dashboard' | 'logs' | 'settings' | 'chat'
-	| 'files' | 'form' | 'map' | 'roadmap' | 'reports' | 'store' | 'search' | 'wiki'
+	| 'files' | 'form' | 'map' | 'roadmap' | 'reports' | 'links' | 'store' | 'search' | 'wiki'
 	| 'flow'
 	/** @deprecated `flows` predates named index sources — use `index` with `config.source: 'flows'`. */
 	| 'flows'

package/src/utils/headers.js

@@ -130,10 +130,15 @@ export function capitalize(str) {
  *
  * Array values are serialized with PHP bracket notation (`key[]=a&key[]=b`)
  * so the Nextcloud/OpenRegister backend parses them as an array — a plain
- * repeated `key=a&key=b` collapses to the last value in PHP. Also handles
- * _order serialization (JSON.stringify for objects) and skips
+ * repeated `key=a&key=b` collapses to the last value in PHP. A plain object
+ * under a filter key is a set of operators and goes out in bracket form
+ * (`{ deadline: { lt: 'x' } }` becomes `deadline[lt]=x`); a key already
+ * written that way (`'deadline[lt]'`) passes through unchanged. Reserved keys
+ * that start with `_` keep their JSON form (`_order`). Skips
  * null/undefined/empty values.
  *
+ * @spec openspec/changes/link-cards-page/specs/link-cards-page/spec.md#requirement-a-filter-operator-is-serialised-in-bracket-form
+ *
  * @param {object} params Key-value pairs for query parameters
  * @return {string} Query string including leading '?' or empty string
  */
@@ -159,6 +164,27 @@ export function buildQueryString(params = {}) {
 					queryParams.append(arrayKey, String(item))
 				}
 			}
+		} else if (typeof value === 'object' && !key.startsWith('_')) {
+			// A filter operator: `{ deadline: { lt: '2026-10-06' } }` goes out
+			// as `deadline[lt]=2026-10-06`, the form OpenRegister reads. As
+			// JSON it reached the database as the literal value and a date
+			// column answered 500. Reserved `_` keys (`_order`) keep JSON.
+			for (const [op, operand] of Object.entries(value)) {
+				if (operand === undefined || operand === null || operand === '') {
+					continue
+				}
+				if (Array.isArray(operand)) {
+					for (const item of operand) {
+						if (item !== undefined && item !== null && item !== '') {
+							queryParams.append(`${key}[${op}][]`, String(item))
+						}
+					}
+				} else if (typeof operand === 'object') {
+					queryParams.set(`${key}[${op}]`, JSON.stringify(operand))
+				} else {
+					queryParams.set(`${key}[${op}]`, String(operand))
+				}
+			}
 		} else if (typeof value === 'object') {
 			queryParams.set(key, JSON.stringify(value))
 		} else {