feat(overview): add a Starred filter to the file list

src/utils/fileFilters.spec.ts

@@ -37,6 +37,25 @@ describe('filterFiles > shared', () => {
 	})
 })
 
+describe('filterFiles > starred', () => {
+	it('includes only favourited files, regardless of owner', () => {
+		const mineStarred = makeNode({ owner: 'alice', favorite: true })
+		const sharedStarred = makeNode({ owner: 'bob', mountType: 'shared', favorite: true })
+		const mineUnstarred = makeNode({ owner: 'alice' })
+
+		expect(filterFiles([mineStarred, sharedStarred, mineUnstarred], { ...baseOptions, activeFilter: 'starred' }))
+			.toEqual(expect.arrayContaining([mineStarred, sharedStarred]))
+		expect(filterFiles([mineStarred, sharedStarred, mineUnstarred], { ...baseOptions, activeFilter: 'starred' }))
+			.toHaveLength(2)
+	})
+
+	it('excludes unfavourited files', () => {
+		const unstarred = makeNode({ owner: 'alice' })
+
+		expect(filterFiles([unstarred], { ...baseOptions, activeFilter: 'starred' })).toEqual([])
+	})
+})
+
 describe('filterFiles > all', () => {
 	it('applies no owner/mount-type filtering', () => {
 		const mine = makeNode({ owner: 'alice' })

src/utils/fileFilters.ts

@@ -2,7 +2,7 @@ import { sortNodes } from '@nextcloud/files'
 import type { Node } from '@nextcloud/files'
 import { filterByMimes } from '../services/officeFiles.ts'
 
-export type Filter = 'all' | 'mine' | 'shared'
+export type Filter = 'all' | 'mine' | 'shared' | 'starred'
 
 interface FilterFilesOptions {
 	activeFilter: Filter
@@ -28,6 +28,10 @@ export function filterFiles(files: Node[], { activeFilter, currentUid, searchQue
 		)
 	} else if (activeFilter === 'shared') {
 		filtered = byCategory.filter(f => f.attributes?.['nc:mount-type'] === 'shared')
+	} else if (activeFilter === 'starred') {
+		// Favourites, regardless of ownership — the same `oc:favorite` flag the
+		// overview shows a star for. sortNodes below keeps them newest-first.
+		filtered = byCategory.filter(f => f.attributes?.favorite === 1)
 	}
 
 	if (searchQuery) {

src/views/OfficeOverview.vue

@@ -100,6 +100,14 @@ const activeCategoryName = computed(() =>
 	activeCreator.value ? categoryName(activeCreator.value) : '',
 )
 
+// The "Starred" filter reframes the list as a section of its own, rather than
+// the default "Recent" view of the category.
+const filesHeading = computed(() =>
+	activeFilter.value === 'starred'
+		? t('office', 'Starred {category}', { category: activeCategoryName.value })
+		: t('office', 'Recent {category}', { category: activeCategoryName.value }),
+)
+
 function setCreator(creator: TemplateCreator) {
 	activeCreator.value = creator
 }
@@ -257,7 +265,7 @@ fetchAll()
 
 						<div class="office-overview__files-header">
 							<h2 id="files-section-heading" class="office-overview__files-title">
-								{{ t('office', 'Recent {category}', { category: activeCategoryName }) }}
+								{{ filesHeading }}
 							</h2>
 						</div>
 
@@ -283,6 +291,15 @@ fetchAll()
 									@click="activeFilter = 'shared'">
 									{{ t('office', 'Shared with me') }}
 								</NcButton>
+								<NcButton size="small"
+									:variant="activeFilter === 'starred' ? 'primary' : 'secondary'"
+									:aria-pressed="activeFilter === 'starred'"
+									@click="activeFilter = 'starred'">
+									<template #icon>
+										<NcIconSvgWrapper :path="mdiStar" :size="16" />
+									</template>
+									{{ t('office', 'Starred') }}
+								</NcButton>
 							</div>
 
 							<NcButton :aria-label="viewMode === 'list' ? t('office', 'Switch to grid view') : t('office', 'Switch to list view')"