CnFolderSidebar

Source-agnostic folder navigation sidebar. Renders an "All" reset entry plus a (nested) folder tree, and emits select with the chosen folder id (or null for "All"). Drop it into an index page's sidebar to filter the list by folder.

Folder sources (source prop)

• custom (default) — the parent supplies folders (flat with parentField, or already-nested via childrenField) and handles CRUD via the create / rename / delete events. Fits app-owned folder tables, OpenRegister folder objects, anything.

• field — no folder entity: the tree is built from the distinct values of a groupBy field. Lightweight grouping, no nesting.

  objects is normally one page of a longer list, and folders derived from a page alone are incomplete: they shift as the reader pages, their counts are per-page tallies, and a value whose rows all sit on a later page has no folder at all. Pass facetValues to avoid that. A facet is computed with the pagination parameters removed, so it carries every distinct value with its true total, and it replaces the row grouping entirely. Any property marked facetable: true gets one. Where no facet is available, set partial so the counts are dropped rather than shown as totals.

• files — real Nextcloud folders/collections under filesPath, loaded over WebDAV via fetchWebdavFolderTree (override with the fetcher prop, e.g. for tests).

<!-- App-owned folders -->
<CnFolderSidebar :folders="folderTree" :selected-id="folderId" allow-create
  @select="onFolder" @create="onCreateFolder" />

<!-- Group by any field -->
<CnFolderSidebar source="field" :objects="rows" group-by="status"
  :selected-id="status" @select="onFolder" />

<!-- Real Nextcloud folders -->
<CnFolderSidebar source="files" files-path="/Vault" :selected-id="path" @select="onFolder" />

Props

Prop	Type	Default	Description
source	String	'custom'	Folder source: custom | field | files.
folders	Array	[]	custom source: the folders (flat or nested).
objects	Array	[]	field source: the objects whose values become folders.
groupBy	String	''	field source: the property to group by.
facetValues	Array	[]	field source: facet buckets for groupBy ({ value, count?, label? }). Computed across the whole query, so they replace the row grouping when present.
partial	Boolean	false	field source: whether objects is only part of the result set. Suppresses per-page counts and shows a notice.
partialLabel	String	'Folders cover this page only.'	The notice shown when partial is set and no facet is available.
filesPath	String	'/'	files source: root path to list.
maxDepth	Number	1	files source: recursion depth.
fetcher	Function	null	files source: async loader override.
selectedId	String | Number	null	The selected folder id (null = All).
title	String	''	Optional heading above the tree.
allLabel	String	(i18n)	Label for the "All" reset entry.
allIcon	String	''	MDI name for the "All" entry (empty = built-in).
idField / nameField / parentField / childrenField	String	id / name / parentId / children	Field names for the custom source.
allowCreate	Boolean	false	Show a "New folder" button.
createLabel	String	(i18n)	Label for the New-folder button.

Events

• @select(id \| null) — a folder (or "All") was chosen.
• @create({ parentId }) — the New-folder button was clicked (opt-in).

OpenRegister reliance

none: this component does not touch OpenRegister, directly or through anything it imports. 0 direct references, 0 files reached through imports.

See the reliance overview for the filterable list.

Props

Name	Type	Required	Default	Description
source	string		'custom'	Folder source strategy.
folders	Array<object>		[]	custom source: the folders, flat (with parentField) or nested (with childrenField). Each needs at least idField + nameField.
objects	array		[]	field source: the objects whose groupBy values become folders.
groupBy	string		''	field source: the object property to group by.
facetValues	Array<object>		[]	field source: facet buckets for groupBy, normalised as the object store delivers them ({ value, count?, label? }). A facet is computed across the whole query rather than the loaded page, so when this is supplied it replaces the row grouping entirely.
partial	boolean		false	field source: whether objects is only part of the result set. Set it when the list is paged and no facet is available, so the sidebar can say the folders are incomplete instead of implying they are all there.
filesPath	string		'/'	files source: the folder path to list children of (root of the tree).
maxDepth	number		1	files source: how deep to recurse under filesPath (each level is a WebDAV request per folder — keep small). 1 = immediate children only.
fetcher	(opts: {path: string, depth: number}) => Promise<object[]>		null	files source: async loader override. Signature ({ path, depth }) =&gt; Promise&lt;folders&gt;. Defaults to a built-in WebDAV PROPFIND loader. Inject in tests.
selectedId	string&#124;number		null	The currently selected folder id (or null for "All").
title	string		''	Optional heading above the tree.
allLabel	string		() =&gt; t('nextcloud-vue', 'All')	Label for the "All" reset entry.
partialLabel	string		() =&gt; t('nextcloud-vue', 'Folders cover this page only.')	Notice shown when the folders cover only the loaded page.
allIcon	string		''	MDI icon name for the "All" entry (resolved via CnIcon; empty = the built-in all-inclusive icon).
idField	string		'id'	Property holding each folder's id (custom source).
nameField	string		'name'	Property holding each folder's display name (custom source).
parentField	string		'parentId'	Property holding the parent id for flat custom folders.
childrenField	string		'children'	Property holding pre-nested children (custom source).
allowCreate	boolean		false	Show a "New folder" button (custom source).
createLabel	string		() =&gt; t('nextcloud-vue', 'New folder')	Label for the New-folder button.

Events

Name	Payload	Description
create	—	Emitted when the New-folder button is clicked.
select	—	Emitted when a folder (or "All") is chosen.