@conduction/nextcloud-vue 2.56.0-beta.13 → 2.56.0-beta.14

package/dist/nextcloud-vue.cjs.js.map

@@ -1,4 +1,4 @@
 [diffend] Oversized file quarantined before diffing.
 name: package/dist/nextcloud-vue.cjs.js.map
-size: 35355767 bytes
-sha256: e048d3627c1eba03f90228c9f300e9341baf3086530119fe40b4af2106f5b7b2
+size: 35372297 bytes
+sha256: 7065df25e721d338e4612aac2ee75c58c87fb5e17477c811e7bcf66cee41783d

package/dist/nextcloud-vue.css

@@ -1940,6 +1940,23 @@ a.cn-kpi-card--stacked:focus-visible {
 	color: var(--color-text-maxcontrast);
 }
 
+/* Beside the inline search (`showCountWithSearch`): the search field shrinks
+   first and the counter stays on one line. */
+.cn-actions-bar__count--beside-search {
+	flex-shrink: 0;
+	white-space: nowrap;
+}
+
+/* Taken out of the flex row so it adds no gap, but kept in the accessibility
+   tree so the live region exists before a total appears. */
+.cn-actions-bar__count--empty {
+	position: absolute;
+	width: 1px;
+	height: 1px;
+	overflow: hidden;
+	clip-path: inset(50%);
+}
+
 /* Inline search field */
 .cn-actions-bar__search {
 	position: relative;
@@ -2199,8 +2216,9 @@ a.cn-kpi-card--stacked:focus-visible {
 		display: contents;
 	}
 
-	/* #after-search filter buttons + the view toggle ride beside the
-	   search field (DOM order — search first via its own order). */
+	/* #after-search filter buttons, the beside-search counter and the view
+	   toggle ride beside the search field (DOM order — search first via its
+	   own order). */
 	.cn-actions-bar__info > * {
 		order: 1;
 	}

package/l10n/en.json

@@ -1,5 +1,6 @@
 {
   "translations": {
+    "Advanced": "Advanced",
     "The item could not be created.": "The item could not be created.",
     "Start over": "Start over",
     "Continue where you left off": "Continue where you left off",
@@ -1100,7 +1101,9 @@
     "Show the date of today above the heading": "Show the date of today above the heading",
     "Plain header without a coloured background": "Plain header without a coloured background",
     "Loading…": "Loading…",
-    "A register and schema are required": "A register and schema are required"
+    "A register and schema are required": "A register and schema are required",
+    "Change the search or try again.": "Change the search or try again.",
+    "Try again later.": "Try again later."
   },
   "plurals": {
     "%n year": ["%n year", "%n years"],

package/l10n/nl.json

@@ -1,5 +1,6 @@
 {
   "translations": {
+    "Advanced": "Geavanceerd",
     "The item could not be created.": "Het item kon niet worden aangemaakt.",
     "Start over": "Opnieuw beginnen",
     "Continue where you left off": "Ga verder waar je was",
@@ -1144,7 +1145,9 @@
     "Show the date of today above the heading": "Toon de datum van vandaag boven de kop",
     "Plain header without a coloured background": "Eenvoudige kop zonder gekleurde achtergrond",
     "Loading…": "Laden…",
-    "A register and schema are required": "Een register en schema zijn verplicht"
+    "A register and schema are required": "Een register en schema zijn verplicht",
+    "Change the search or try again.": "Pas de zoekopdracht aan of probeer het opnieuw.",
+    "Try again later.": "Probeer het later opnieuw."
   },
   "plurals": {
     "%n year": ["%n jaar", "%n jaar"],

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@conduction/nextcloud-vue",
-  "version": "2.56.0-beta.13",
+  "version": "2.56.0-beta.14",
   "description": "Shared Vue component library for Conduction Nextcloud apps — complements @nextcloud/vue with higher-level components, OpenRegister integration, and NL Design System support",
   "homepage": "https://github.com/ConductionNL/nextcloud-vue#readme",
   "bugs": {

package/src/components/CnActionsBar/CnActionsBar.md

@@ -152,9 +152,10 @@ Controlling the inline action button count — `inlineActionCount` sets how many
 | `showMap` | `Boolean` | `false` | Whether to render the third "Map" view-toggle segment. Off by default so existing two-segment consumers are unchanged |
 | `mapLabel` | `String` | `''` | Label for the map view-toggle option (defaults to "Map"). Only shown when `showMap` |
 | `mapIcon` | `String` | `''` | MDI icon name for the map option (defaults to the built-in map-marker icon). Resolved via `CnIcon` |
-| `showSearch` | `Boolean` | `false` | Whether to show the inline search field on the left of the bar |
+| `showSearch` | `Boolean` | `false` | Whether to show the inline search field on the left of the bar. The field takes the place of the "Showing X of Y" counter unless `showCountWithSearch` is set |
 | `searchValue` | `String` | `''` | Current value of the inline search field (controlled) |
 | `searchPlaceholder` | `String` | `''` | Placeholder / accessible label for the inline search field |
+| `showCountWithSearch` | `Boolean` | `false` | Keep the "Showing X of Y" counter visible beside the inline search field, after the search and any `#after-search` controls. No effect without `showSearch` |
 | `headerActions` | `Array` | `[]` | Manifest-declared page-level actions rendered inside the overflow dropdown between the built-in Refresh and the `#action-items` slot. Each entry is `{ id, label, icon?, disabled? }` — the bar emits `@header-action({ action: id, id })` on click and the parent (e.g. `CnIndexPage`) dispatches the resolved handler. The `icon` field accepts EITHER an MDI Vue component name (e.g. `'History'`) — rendered via `CnIcon` — OR a Nextcloud core CSS icon class (e.g. `'icon-history'`) — rendered as a `<span>` carrying that class. An entry with `href` (URL) or `to` (vue-router location) renders as a real link, `linkTarget` as its `target`; it still emits `@header-action`, so the parent must not navigate for it again. |
 
 ## Manifest header actions example

package/src/components/CnActionsBar/CnActionsBar.vue

@@ -12,11 +12,16 @@
 					:aria-label="searchPlaceholder || t('nextcloud-vue', 'Search')"
 					@input="onSearchInput">
 			</div>
-			<span v-else-if="pagination && pagination.total > 0" class="cn-actions-bar__count">
+			<span v-else-if="hasTotal" class="cn-actions-bar__count">
 				{{ countText }}
 			</span>
 			<!-- @slot after-search Refinement controls rendered beside the search field on the LEFT side of the bar (e.g. a filter menu button). Convention: the left side groups the VISUAL controls — search, filters, view toggle — while the right cluster holds the ACT controls (add, overflow); the standalone sort select is a display control too but keeps its legacy right-side placement. -->
 			<slot name="after-search" />
+			<!-- Counter beside the search (`showCountWithSearch`): after the search and its #after-search controls. The live region stays mounted while there is no total, so results coming back after none are announced too. -->
+			<span v-if="showSearch && showCountWithSearch"
+				class="cn-actions-bar__count cn-actions-bar__count--beside-search"
+				:class="{ 'cn-actions-bar__count--empty': !hasTotal }"
+				aria-live="polite">{{ hasTotal ? countText : '' }}</span>
 
 			<!-- View mode toggle (Cards / Table / List) — segmented control with
 			     a sliding thumb that animates between the N segments. Lives in
@@ -644,6 +649,16 @@ export default {
 			default: '',
 		},
 
+		/**
+		 * Keep the "Showing X of Y" counter visible beside the inline search field,
+		 * after any `#after-search` controls. By default the search field takes the
+		 * counter's place. No effect without `showSearch`.
+		 */
+		showCountWithSearch: {
+			type: Boolean,
+			default: false,
+		},
+
 		/** Whether the refresh action is currently in progress */
 		refreshing: {
 			type: Boolean,
@@ -811,6 +826,15 @@ export default {
 			}))
 		},
 
+		/**
+		 * Whether there is a non-empty total for the "Showing X of Y" counter.
+		 *
+		 * @return {boolean}
+		 */
+		hasTotal() {
+			return Boolean(this.pagination && this.pagination.total > 0)
+		},
+
 		countText() {
 			if (!this.pagination) {
 				return ''

package/src/components/CnAppNav/CnAppNav.vue

@@ -1113,7 +1113,7 @@ export default {
 
 		/**
 		 * Label for the foldout's gear button. Manifest override:
-		 * `nav.settingsLabel`; defaults to "Settings".
+		 * `nav.settingsLabel`; defaults to "Advanced".
 		 *
 		 * @return {string}
 		 */
@@ -1122,7 +1122,7 @@ export default {
 			if (typeof custom === 'string' && custom.length > 0) {
 				return this.effectiveTranslate(custom)
 			}
-			return t('nextcloud-vue', 'Settings')
+			return t('nextcloud-vue', 'Advanced')
 		},
 
 		/**

package/src/components/CnDataTable/CnDataTable.md

@@ -186,7 +186,7 @@ export default {
 | `includeColumns` | Array | `null` | Column keys to include (whitelist) in schema mode |
 | `sortKey` | String | `null` | Currently active sort column key (controlled) |
 | `sortOrder` | String | `'asc'` | Current sort direction: `'asc'` or `'desc'` |
-| `sortKeys` | Array | `[]` | Ordered multi-column ("shift+click") sort key list, `[{ key, order }, …]` (0–3 entries); takes precedence over `sortKey`/`sortOrder` when non-empty. Priority badges show only when two or more rendered, sortable columns are sorted; a key whose column is not rendered or not sortable (such as a `_uuid` tie-break) still sorts, but is not counted or numbered |
+| `sortKeys` | Array | `[]` | Ordered multi-column ("shift+click") sort key list, `[{ key, order }, …]` (0–3 entries); takes precedence over `sortKey`/`sortOrder` when non-empty. Priority badges show only when two or more rendered, sortable columns are sorted; a key whose column is not rendered or not sortable (such as a `_uuid` tie-break) still sorts, but is not counted or numbered, and `aria-sort` goes to the first sort key whose column is rendered and sortable |
 | `selectedIds` | Array | `[]` | Array of selected row IDs (controlled) |
 | `rowClass` | Function | `null` | `(row) => string` — CSS class(es) applied to each `<tr>` |
 | `rowClickToView` | Boolean | `false` | Emit `row-click` on a row-body click even while `selectable` (selection then via the checkbox column only) |

package/src/components/CnDataTable/CnDataTable.vue

@@ -371,7 +371,7 @@ import '../../css/table.css'
  *
  * Sorting: a plain click on a sortable header is single-sort (cycle asc → desc → cleared), unchanged from before.
  * Shift+click (or Shift+Enter on a focused header) appends the column as a secondary/tertiary sort key, capped at 3, with numbered priority badges (1, 2, 3) once two or more rendered, sortable columns are sorted.
- * A sort key whose column is not rendered, or not sortable, still sorts, but is not counted or numbered.
+ * A sort key whose column is not rendered, or not sortable, still sorts, but is not counted or numbered, and `aria-sort` goes to the first sort key whose column is rendered and sortable.
  * Pass `sortKeys: [{key, order}, ...]` for multi-sort (falls back to the legacy `sortKey`/`sortOrder` props when empty).
  * The `sort` event payload is extended, not replaced: `{key, order}` still mirrors the primary key exactly as before; a new `keys` field carries the full ordered list.
  * See `src/utils/multiColumnSort.js` for the state machine.
@@ -1722,8 +1722,8 @@ export default {
 		},
 
 		/**
-		 * `aria-sort` value for a column header: `'ascending'`/`'descending'` for the PRIMARY (index 0) active sort key only, per WCAG guidance that `aria-sort` describes single-column sort state.
-		 * `null` omits the attribute entirely (unsorted, not sortable, or not the primary key).
+		 * `aria-sort` value for a column header: `'ascending'`/`'descending'` for the first rendered sort key only, per WCAG guidance that `aria-sort` describes single-column sort state.
+		 * `null` omits the attribute entirely (unsorted, not sortable, or not the first rendered sort key).
 		 *
 		 * @param {object} col Column definition.
 		 * @return {string|null}
@@ -1732,7 +1732,7 @@ export default {
 			if (!col.sortable) {
 				return null
 			}
-			const primary = this.effectiveSortKeys[0]
+			const primary = this.renderedSortKeys[0]
 			if (!primary || primary.key !== col.key) {
 				return null
 			}

package/src/components/CnIndexPage/CnIndexPage.md

@@ -386,7 +386,8 @@ export default {
 | `fieldOverrides` | Object | `{}` | Per-field config overrides passed to `CnFormDialog` |
 | `customComponents` | Object | `null` | Custom-component / handler registry. When set, takes precedence over the injected `cnCustomComponents` from CnAppRoot. Used to resolve `actions[].handler` registry names declared in the manifest (manifest-actions-dispatch). Named handlers resolve out of the v2 `registry` (a `kind: "handler"` entry) FIRST and fall back to this map. |
 | `showViewToggle` | Boolean | `true` | Whether to show the Cards/Table view toggle |
-| `inlineSearch` | Boolean | `false` | Show an inline search field in the actions bar (in addition to / instead of the sidebar search). Fed from the manifest as `pages[].config.inlineSearch`. |
+| `inlineSearch` | Boolean | `false` | Show an inline search field in the actions bar (in addition to / instead of the sidebar search). Fed from the manifest as `pages[].config.inlineSearch`. The field takes the place of the "Showing X of Y" counter unless `showCountWithSearch` is set. |
+| `showCountWithSearch` | Boolean | `false` | Keep the "Showing X of Y" counter visible beside the inline search field, after the search and any `#after-search` controls (only relevant with `inlineSearch`, which otherwise takes the counter's place). Fed from the manifest as `pages[].config.showCountWithSearch`. |
 | `searchPlaceholder` | String | `''` | Placeholder for the inline search field (manifest `config.searchPlaceholder`). |
 | `cardsLabel` | String | `''` | Label for the cards view-toggle option (manifest `config.cardsLabel`, e.g. "Tiles"). |
 | `tableLabel` | String | `''` | Label for the table view-toggle option (manifest `config.tableLabel`, e.g. "List"). |

package/src/components/CnIndexPage/CnIndexPage.vue

@@ -59,6 +59,7 @@
 			:showSearch="inlineSearch"
 			:searchValue="effectiveSearchValue"
 			:searchPlaceholder="searchPlaceholder"
+			:showCountWithSearch="showCountWithSearch"
 			:refreshing="effectiveRefreshing"
 			:refreshDisabled="refreshDisabled"
 			:addDisabled="addDisabled"
@@ -417,6 +418,21 @@
 					<NcLoadingIcon :size="32" :name="loadingText" />
 				</div>
 
+				<!-- Error state: the latest self-fetch failed (e.g. a search term the server rejects) -->
+				<div v-else-if="selfFetchFailed"
+					class="cn-index-page__empty"
+					role="status"
+					data-testid="cn-index-page-fetch-error">
+					<NcEmptyContent :name="t('nextcloud-vue', 'An error occurred')"
+						:description="effectiveSearchValue
+							? t('nextcloud-vue', 'Change the search or try again.')
+							: t('nextcloud-vue', 'Try again later.')">
+						<template #icon>
+							<AlertCircleOutline :size="64" />
+						</template>
+					</NcEmptyContent>
+				</div>
+
 				<!-- Empty state -->
 				<div v-else-if="effectiveObjects.length === 0" class="cn-index-page__empty">
 					<slot name="empty">
@@ -774,6 +790,7 @@ import { getCurrentUser } from '@nextcloud/auth'
 import { translate as t } from '@nextcloud/l10n'
 import { NcActionButton, NcActionCaption, NcActionCheckbox, NcActions, NcButton, NcEmptyContent, NcLoadingIcon } from '@nextcloud/vue'
 import { getCurrentInstance, inject, markRaw, ref } from 'vue'
+import AlertCircleOutline from 'vue-material-design-icons/AlertCircleOutline.vue'
 import Close from 'vue-material-design-icons/Close.vue'
 import Cog from 'vue-material-design-icons/Cog.vue'
 import DatabaseSearch from 'vue-material-design-icons/DatabaseSearch.vue'
@@ -1054,6 +1071,7 @@ export default {
 		NcActionCaption,
 		NcActionCheckbox,
 		NcButton,
+		AlertCircleOutline,
 		Close,
 		Cog,
 		DatabaseSearch,
@@ -2034,6 +2052,17 @@ export default {
 			default: false,
 		},
 
+		/**
+		 * Keep the "Showing X of Y" counter visible beside the inline search field,
+		 * after any `#after-search` controls (only relevant with `inlineSearch`,
+		 * which otherwise takes the counter's place). Fed from the manifest as
+		 * `pages[].config.showCountWithSearch`.
+		 */
+		showCountWithSearch: {
+			type: Boolean,
+			default: false,
+		},
+
 		/** Placeholder for the inline search field (manifest `config.searchPlaceholder`) */
 		searchPlaceholder: {
 			type: String,
@@ -2934,11 +2963,23 @@ export default {
 			return this.isSelfFetch && !!this.list
 		},
 
+		/**
+		 * Whether the latest self-fetch failed. The store keeps the previous
+		 * rows and pagination on a failed fetch, so while this holds the page
+		 * shows its error state instead of results for an earlier query.
+		 */
+		selfFetchFailed() {
+			return this.isSelfFetchMode && !!this.list.error?.value
+		},
+
 		/** Rows: store collection in self-fetch mode, else the `objects` prop. */
 		effectiveObjects() {
 			if (this.isNamedSource) {
 				return this.namedRows
 			}
+			if (this.selfFetchFailed) {
+				return []
+			}
 			return this.isSelfFetchMode ? (this.list.objects.value || []) : this.objects
 		},
 
@@ -3342,7 +3383,9 @@ export default {
 				s: this.exportSchemaSlug,
 				f: this.filter || null,
 				e: this.countEntries,
-				t: Number(this.effectivePagination?.total ?? 0),
+				// The store's total, not the error override in effectivePagination,
+				// so a failed fetch and its recovery do not refetch the counts.
+				t: Number((this.isSelfFetchMode ? this.list.pagination.value : this.effectivePagination)?.total ?? 0),
 			})
 		},
 
@@ -3748,6 +3791,9 @@ export default {
 
 		/** Pagination: store pagination in self-fetch mode, else the `pagination` prop. */
 		effectivePagination() {
+			if (this.selfFetchFailed) {
+				return { ...this.list.pagination.value, total: 0, page: 1, pages: 1 }
+			}
 			return this.isSelfFetchMode ? this.list.pagination.value : this.pagination
 		},
 

package/src/components/CnSetupWizard/CnSetupWizard.vue

@@ -199,13 +199,12 @@
 
 <script>
 import { getCurrentUser } from '@nextcloud/auth'
-import { loadState } from '@nextcloud/initial-state'
 import { translate as t } from '@nextcloud/l10n'
 import { NcButton, NcCheckboxRadioSwitch, NcLoadingIcon, NcNoteCard, NcSelect, NcTextField } from '@nextcloud/vue'
 import CnChoiceCards from '../CnChoiceCards/CnChoiceCards.vue'
 import CnLeafDependencySettings from '../CnLeafDependencySettings/CnLeafDependencySettings.vue'
 import CnWizardDialog from '../CnWizardDialog/CnWizardDialog.vue'
-import { checkDependencies, isDependencyResolved } from '../../composables/useDependencyCheck.js'
+import { checkDependencies, isDependencyResolved, missingRequiredApps, readServerAppStatuses } from '../../composables/useDependencyCheck.js'
 import { useSetupStatus } from '../../composables/useSetupStatus.js'
 import { fieldsFromSchema } from '../../utils/schema.js'
 
@@ -474,16 +473,15 @@ export default {
 		 *
 		 * @return {Array<{ step: object, missing: Array<string> }>}
 		 * @spec openspec/changes/setup-wizard-card-load-and-dependency-gate/specs/cn-setup-wizard/spec.md#requirement-the-wizard-checks-dependencies-before-any-step
+		 * @spec openspec/changes/optional-step-requires/specs/cn-setup-wizard/spec.md#requirement-a-step-whose-required-apps-are-absent-is-not-applicable
 		 */
 		skippedSteps() {
 			return this.declaredSteps
 				.filter((s) => Array.isArray(s.requires) && s.requires.length > 0)
 				.map((step) => {
 					const known = Object.fromEntries(this.dependencyRows.map((d) => [d.id, d]))
-					const missing = checkDependencies(step.requires, this.serverAppStatuses)
-						.map((row) => known[row.id] || row)
-						.filter((row) => !isDependencyResolved(row))
-						.map((row) => row.name || row.id)
+					const missing = missingRequiredApps(step.requires, this.serverAppStatuses)
+						.map((row) => (known[row.id] || row).name || row.id)
 					return { step, missing }
 				})
 				.filter((entry) => entry.missing.length > 0)
@@ -523,11 +521,7 @@ export default {
 		 * @return {object}
 		 */
 		serverAppStatuses() {
-			try {
-				return loadState(this.appId, 'dependency_statuses', {}) || {}
-			} catch {
-				return {}
-			}
+			return readServerAppStatuses(this.appId)
 		},
 
 		/**

package/src/composables/useDependencyCheck.js

@@ -3,6 +3,7 @@
  * SPDX-License-Identifier: EUPL-1.2
  */
 
+import { loadState } from '@nextcloud/initial-state'
 import { useAppStatus } from './useAppStatus.js'
 
 /**
@@ -59,3 +60,45 @@ export function checkDependencies(entries, serverStatuses = {}) {
 export function isDependencyResolved(row) {
 	return !!row && row.installed === true && row.enabled === true
 }
+
+/**
+ * Read the `dependency_statuses` initial state an app may inject from PHP.
+ *
+ * Keyed by app id: `{ installed, enabled }`. Returns `{}` when the app injects
+ * none or the state cannot be read, so callers fall back to `useAppStatus`.
+ *
+ * @param {string} appId The app whose initial state to read.
+ * @return {object} Server-reported statuses keyed by app id.
+ *
+ * @spec openspec/changes/optional-step-requires/specs/cn-setup-wizard/spec.md#requirement-a-step-whose-required-apps-are-absent-is-not-applicable
+ */
+export function readServerAppStatuses(appId) {
+	try {
+		const statuses = loadState(appId, 'dependency_statuses', {})
+		return (statuses && typeof statuses === 'object') ? statuses : {}
+	} catch {
+		return {}
+	}
+}
+
+/**
+ * The apps in a setup step's `requires` list that are not installed and
+ * enabled.
+ *
+ * This is the one resolution every setup surface uses: `CnSetupWizard` skips a
+ * step when it is non-empty, and `useSetupStatus` then counts that step as not
+ * applicable rather than unmet. Keeping both on one function is what stops the
+ * wizard and the status from disagreeing about the same step.
+ *
+ * @param {Array<string>} requires The step's `requires` app ids.
+ * @param {object} [serverStatuses] Server-reported statuses keyed by app id.
+ * @return {Array<{id: string, name: string, required: boolean, installed: boolean, enabled: boolean}>} The missing apps.
+ *
+ * @spec openspec/changes/optional-step-requires/specs/cn-setup-wizard/spec.md#requirement-a-step-whose-required-apps-are-absent-is-not-applicable
+ */
+export function missingRequiredApps(requires, serverStatuses = {}) {
+	if (!Array.isArray(requires) || requires.length === 0) {
+		return []
+	}
+	return checkDependencies(requires, serverStatuses).filter((row) => !isDependencyResolved(row))
+}

package/src/composables/useListView.js

@@ -94,6 +94,13 @@ export function useListView(objectTypeOrOptions, options) {
 	// field (a folder pane grouping by it, say) reads them here rather than
 	// deriving them from `objects`, which is only the current page.
 	const facets = computed(() => objectStore.facets[objectType] || {})
+	// Outcome of the latest `refresh()`: the store's error for it, or null once
+	// it succeeded or a later fetch stored new rows. The store keeps the previous
+	// rows on a failed fetch, so this is how a consumer tells stale rows from
+	// current ones.
+	const error = ref(null)
+	let refreshSeq = 0
+	let pendingRefreshes = 0
 
 	let searchTimeout = null
 
@@ -178,14 +185,48 @@ export function useListView(objectTypeOrOptions, options) {
 
 	/**
 	 * Fetch the collection using current state params and update sidebar facet data.
+	 * Only the most recently started refresh sets `error`, so an older response
+	 * settling late cannot override a newer one's outcome.
 	 *
 	 * @param {number} [page] Page to fetch
 	 * @return {Promise<void>}
 	 */
 	async function refresh(page = 1) {
-		await objectStore.fetchCollection(objectType, buildParams(page))
+		const seq = ++refreshSeq
+		// This call's own result. `errors[objectType]` is shared by every call
+		// for the type and is not cleared on success, so it cannot say which
+		// request failed; it is only the fallback for a store that ignores
+		// `options.outcome`.
+		const outcome = {}
+		pendingRefreshes++
+		try {
+			await objectStore.fetchCollection(objectType, buildParams(page), { outcome })
+		} catch (e) {
+			if (seq === refreshSeq) {
+				error.value = e
+			}
+			throw e
+		} finally {
+			pendingRefreshes--
+		}
+		if (seq === refreshSeq) {
+			error.value = ('error' in outcome) ? outcome.error : (objectStore.errors?.[objectType] || null)
+		}
 	}
 
+	// A fetch outside `refresh()` (e.g. the live-updates refetch) that stores
+	// new rows recovers the list from an earlier failure. Rows written while
+	// a refresh is pending are left to that refresh, which decides `error`.
+	watch(
+		() => objectStore.collections[objectType],
+		() => {
+			if (pendingRefreshes === 0) {
+				error.value = null
+			}
+		},
+		{ flush: 'sync' },
+	)
+
 	// ── Event handlers ───────────────────────────────────────────────────
 
 	/**
@@ -323,6 +364,7 @@ export function useListView(objectTypeOrOptions, options) {
 		loading,
 		pagination,
 		facets,
+		error,
 		// Local state
 		searchTerm,
 		sortKey,

package/src/composables/useSetupStatus.js

@@ -4,6 +4,7 @@
  */
 
 import { computed, ref } from 'vue'
+import { missingRequiredApps, readServerAppStatuses } from './useDependencyCheck.js'
 
 /**
  * Per-`appId` cache of setup-status results. The Vue refs are stored so all
@@ -27,6 +28,14 @@ const cache = new Map()
  * every non-admin user of an app with a `setup` block met a wizard they had no
  * permission to complete instead of the app itself.
  *
+ * A step that declares `requires: [appId, ...]` is **not applicable** while any
+ * of those apps is not installed and enabled: it is neither met nor unmet, so
+ * it never lands in `requiredUnmet` or `optionalUnmet`. `CnSetupWizard` skips
+ * such a step, and counting it as unmet kept the wizard reopening (optional
+ * step) or gating the app (required step) for a step it would never show. App
+ * status is resolved exactly as the wizard does it: the `dependency_statuses`
+ * initial state first, then `useAppStatus`.
+ *
  * @param {string} appId Nextcloud app id (e.g. `"procest"`).
  * @param {object} manifest The app manifest (reads `manifest.setup`).
  * @return {{
@@ -35,6 +44,7 @@ const cache = new Map()
  *   requiredUnmet: import('vue').ComputedRef<Array<object>>,
  *   optionalUnmet: import('vue').ComputedRef<Array<object>>,
  *   optionalUnmetReported: import('vue').ComputedRef<Array<object>>,
+ *   notApplicable: import('vue').ComputedRef<Array<object>>,
  *   completed: import('vue').ComputedRef<boolean>,
  *   enabled: boolean,
  *   loading: import('vue').Ref<boolean>,
@@ -45,6 +55,7 @@ const cache = new Map()
  *
  * @example
  * const { requiredUnmet, completed, loading } = useSetupStatus('procest', manifest)
+ * @spec openspec/changes/optional-step-requires/specs/cn-setup-wizard/spec.md#requirement-a-step-whose-required-apps-are-absent-is-not-applicable
  */
 export function useSetupStatus(appId, manifest) {
 	const setup = (manifest && manifest.setup) || {}
@@ -68,6 +79,9 @@ export function useSetupStatus(appId, manifest) {
 		cache.set(appId, entry)
 	}
 	const { status, loading, error, forbidden } = entry
+	// Same source the wizard's dependency gate reads. Initial state is fixed
+	// for the page lifetime, so one read per call is enough.
+	const serverAppStatuses = readServerAppStatuses(appId)
 
 	const steps = computed(() => stepDefs.map((s) => {
 		const bag = status.value.steps || {}
@@ -81,7 +95,12 @@ export function useSetupStatus(appId, manifest) {
 		// that act on an unmet step — CnAppRoot auto-opening the non-gating
 		// wizard — must act only on steps the server actually reported, or an
 		// unknowable step parks the wizard over the app for ever.
-		return { ...s, done: st.done === true, reported, detail: st.detail }
+		//
+		// `applicable` is false when the step `requires` an app that is not
+		// installed and enabled. The wizard skips such a step, so it can never
+		// be done here; it is not applicable rather than unmet.
+		const missingApps = missingRequiredApps(s.requires, serverAppStatuses).map((row) => row.id)
+		return { ...s, done: st.done === true, reported, detail: st.detail, applicable: missingApps.length === 0, missingApps }
 	}))
 	// Presentational step types carry no work, so the server never reports a
 	// `done` flag for them. Counting them as "unmet" made `optionalUnmet`
@@ -89,7 +108,9 @@ export function useSetupStatus(appId, manifest) {
 	// which kept CnAppRoot's non-gating setup wizard auto-opening over the
 	// app on every fresh browser profile no matter how complete setup was.
 	// Only actionable steps can be unmet.
-	const isActionable = (s) => s.type !== 'info' && s.type !== 'summary'
+	// A step whose required apps are absent is skipped by the wizard, so it
+	// is neither met nor unmet (see `applicable` above).
+	const isActionable = (s) => s.type !== 'info' && s.type !== 'summary' && s.applicable !== false
 	// `forbidden` empties BOTH lists, and that is what actually suppresses the
 	// wizard: CnAppRoot gates on `requiredUnmet.length > 0` (blocking) and on
 	// `requiredUnmet.length === 0 && optionalUnmet.length > 0` (auto-open) —
@@ -110,6 +131,8 @@ export function useSetupStatus(appId, manifest) {
 	// suppressing it is what left dossiq's `seed` step (and with it the app's
 	// only demo-data affordance) permanently unreachable.
 	const optionalUnmetReported = computed(() => optionalUnmet.value.filter((s) => s.reported === true))
+	// Steps the wizard skips because an app in their `requires` is absent.
+	const notApplicable = computed(() => steps.value.filter((s) => s.applicable === false))
 	const completed = computed(() => {
 		if (!enabled) {
 			return true
@@ -170,7 +193,7 @@ export function useSetupStatus(appId, manifest) {
 		refresh()
 	}
 
-	return { steps, status, requiredUnmet, optionalUnmet, optionalUnmetReported, completed, enabled, loading, error, forbidden, refresh }
+	return { steps, status, requiredUnmet, optionalUnmet, optionalUnmetReported, notApplicable, completed, enabled, loading, error, forbidden, refresh }
 }
 
 /**

package/src/css/actions-bar.css

@@ -35,6 +35,23 @@
 	color: var(--color-text-maxcontrast);
 }
 
+/* Beside the inline search (`showCountWithSearch`): the search field shrinks
+   first and the counter stays on one line. */
+.cn-actions-bar__count--beside-search {
+	flex-shrink: 0;
+	white-space: nowrap;
+}
+
+/* Taken out of the flex row so it adds no gap, but kept in the accessibility
+   tree so the live region exists before a total appears. */
+.cn-actions-bar__count--empty {
+	position: absolute;
+	width: 1px;
+	height: 1px;
+	overflow: hidden;
+	clip-path: inset(50%);
+}
+
 /* Inline search field */
 .cn-actions-bar__search {
 	position: relative;
@@ -294,8 +311,9 @@
 		display: contents;
 	}
 
-	/* #after-search filter buttons + the view toggle ride beside the
-	   search field (DOM order — search first via its own order). */
+	/* #after-search filter buttons, the beside-search counter and the view
+	   toggle ride beside the search field (DOM order — search first via its
+	   own order). */
 	.cn-actions-bar__info > * {
 		order: 1;
 	}