From 60195aefddd09553a5ce56408c7aa1add6ae0399 Mon Sep 17 00:00:00 2001
From: James Manuel <moodyjmz@users.noreply.github.com>
Date: Wed, 20 May 2026 16:47:49 +0200
Subject: [PATCH 1/2] feat(overview): add All / Mine / Shared with me filter
 chips
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Add owner-based filtering to the files section:
- 'Mine' (default): files owned by the current user that are not on a
  shared or group mount (mirrors apps/files PersonalFiles filter)
- 'Shared with me': files where nc:mount-type === 'shared'
- 'All': no filter applied

Both properties (oc:owner-id → node.owner, nc:mount-type) are already
returned by getDavProperties() so no extra API call is needed.

Three NcButton chips (size=small, aria-pressed) in a role=group below
the section title give keyboard-accessible toggle behaviour. The empty
state is moved inside the section so the chips remain visible when a
filter yields no results, allowing the user to switch back.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Signed-off-by: James Manuel <moodyjmz@users.noreply.github.com>
---
 src/views/OfficeOverview.vue | 70 ++++++++++++++++++++++++++++++------
 1 file changed, 59 insertions(+), 11 deletions(-)

diff --git a/src/views/OfficeOverview.vue b/src/views/OfficeOverview.vue
index c41dea6819..9cf5d7a702 100644
--- a/src/views/OfficeOverview.vue
+++ b/src/views/OfficeOverview.vue
@@ -44,13 +44,6 @@
 					<NcEmptyContent v-if="error"
 						:name="error" />
 
-					<NcEmptyContent v-else-if="files.length === 0"
-						:name="t('richdocuments', 'No {category} found', { category: activeCreator.label })">
-						<template #icon>
-							<FileDocumentOutline />
-						</template>
-					</NcEmptyContent>
-
 					<section v-else class="office-overview__files" aria-labelledby="files-section-heading">
 						<div class="office-overview__files-header">
 							<h2 id="files-section-heading" class="office-overview__files-title">
@@ -66,7 +59,37 @@
 							</NcButton>
 						</div>
 
-						<div v-if="viewMode === 'grid'" class="office-overview__grid">
+						<div class="office-overview__filters"
+							role="group"
+							:aria-label="t('richdocuments', 'Filter files')">
+							<NcButton size="small"
+								:variant="activeFilter === 'all' ? 'primary' : 'tertiary'"
+								:aria-pressed="activeFilter === 'all'"
+								@click="activeFilter = 'all'">
+								{{ t('richdocuments', 'All') }}
+							</NcButton>
+							<NcButton size="small"
+								:variant="activeFilter === 'mine' ? 'primary' : 'tertiary'"
+								:aria-pressed="activeFilter === 'mine'"
+								@click="activeFilter = 'mine'">
+								{{ t('richdocuments', 'Mine') }}
+							</NcButton>
+							<NcButton size="small"
+								:variant="activeFilter === 'shared' ? 'primary' : 'tertiary'"
+								:aria-pressed="activeFilter === 'shared'"
+								@click="activeFilter = 'shared'">
+								{{ t('richdocuments', 'Shared with me') }}
+							</NcButton>
+						</div>
+
+						<NcEmptyContent v-if="files.length === 0"
+							:name="t('richdocuments', 'No {category} found', { category: categoryName(activeCreator) })">
+							<template #icon>
+								<FileDocumentOutline />
+							</template>
+						</NcEmptyContent>
+
+						<div v-else-if="viewMode === 'grid'" class="office-overview__grid">
 							<FileCard v-for="file in files"
 								:key="file.id"
 								@click="openFile(file)">
@@ -135,6 +158,7 @@
 </template>
 
 <script>
+import { getCurrentUser } from '@nextcloud/auth'
 import { sortNodes } from '@nextcloud/files'
 import { loadState } from '@nextcloud/initial-state'
 import { generateUrl } from '@nextcloud/router'
@@ -181,6 +205,7 @@ export default {
 			error: null,
 			previewEnabled: loadState('richdocuments', 'previewEnabled', false),
 			viewMode: loadState('richdocuments', 'overview_config', {}).overview_grid_view ? 'grid' : 'list',
+			activeFilter: 'mine',
 			searchQuery: '',
 			showCreateDialog: false,
 			newFileName: '',
@@ -197,9 +222,26 @@ export default {
 				return []
 			}
 			const byCategory = filterByMimes(this.allFiles, this.activeCreator.mimetypes)
-			const filtered = this.searchQuery
-				? byCategory.filter(f => f.basename.toLowerCase().includes(this.searchQuery.toLowerCase()))
-				: byCategory
+
+			let filtered = byCategory
+			if (this.activeFilter === 'mine') {
+				const uid = getCurrentUser()?.uid
+				filtered = byCategory.filter(f =>
+					f.owner === uid
+					&& !['group', 'shared'].includes(f.attributes?.['nc:mount-type'])
+				)
+			} else if (this.activeFilter === 'shared') {
+				filtered = byCategory.filter(f =>
+					f.attributes?.['nc:mount-type'] === 'shared'
+				)
+			}
+
+			if (this.searchQuery) {
+				filtered = filtered.filter(f =>
+					f.basename.toLowerCase().includes(this.searchQuery.toLowerCase())
+				)
+			}
+
 			return sortNodes(filtered, {
 				sortFavoritesFirst: true,
 				sortingMode: 'mtime',
@@ -367,6 +409,12 @@ export default {
 	color: var(--color-text-maxcontrast);
 }
 
+.office-overview__filters {
+	display: flex;
+	gap: calc(var(--default-grid-baseline) * 1);
+	padding: 0 calc(var(--default-grid-baseline) * 4) calc(var(--default-grid-baseline) * 2);
+}
+
 .office-overview__list {
 	padding: 0 calc(var(--default-grid-baseline) * 2);
 }

From 77b90242824addbe43622def90785573c92c1783 Mon Sep 17 00:00:00 2001
From: James Manuel <moodyjmz@users.noreply.github.com>
Date: Wed, 20 May 2026 16:57:18 +0200
Subject: [PATCH 2/2] fix(overview): give filter buttons pill shape via
 --button-radius override

Override --button-radius on the filter NcButton elements so they render
as pill-shaped chips rather than square-cornered small buttons.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Signed-off-by: James Manuel <moodyjmz@users.noreply.github.com>
---
 src/views/OfficeOverview.vue | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/views/OfficeOverview.vue b/src/views/OfficeOverview.vue
index 9cf5d7a702..9b69890732 100644
--- a/src/views/OfficeOverview.vue
+++ b/src/views/OfficeOverview.vue
@@ -413,6 +413,10 @@ export default {
 	display: flex;
 	gap: calc(var(--default-grid-baseline) * 1);
 	padding: 0 calc(var(--default-grid-baseline) * 4) calc(var(--default-grid-baseline) * 2);
+
+	:deep(.button-vue) {
+		--button-radius: var(--border-radius-pill, 100px);
+	}
 }
 
 .office-overview__list {