Skip to content

Commit a3f2eaf

Browse files
moodyjmzclaude
andcommitted
feat(overview): add All / Mine / Shared with me filter chips
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>
1 parent b1684ce commit a3f2eaf

1 file changed

Lines changed: 59 additions & 11 deletions

File tree

src/views/OfficeOverview.vue

Lines changed: 59 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -44,13 +44,6 @@
4444
<NcEmptyContent v-if="error"
4545
:name="error" />
4646

47-
<NcEmptyContent v-else-if="files.length === 0"
48-
:name="t('richdocuments', 'No {category} found', { category: activeCreator.label })">
49-
<template #icon>
50-
<FileDocumentOutline />
51-
</template>
52-
</NcEmptyContent>
53-
5447
<section v-else class="office-overview__files" aria-labelledby="files-section-heading">
5548
<div class="office-overview__files-header">
5649
<h2 id="files-section-heading" class="office-overview__files-title">
@@ -66,7 +59,37 @@
6659
</NcButton>
6760
</div>
6861

69-
<div v-if="viewMode === 'grid'" class="office-overview__grid">
62+
<div class="office-overview__filters"
63+
role="group"
64+
:aria-label="t('richdocuments', 'Filter files')">
65+
<NcButton size="small"
66+
:variant="activeFilter === 'all' ? 'primary' : 'tertiary'"
67+
:aria-pressed="activeFilter === 'all'"
68+
@click="activeFilter = 'all'">
69+
{{ t('richdocuments', 'All') }}
70+
</NcButton>
71+
<NcButton size="small"
72+
:variant="activeFilter === 'mine' ? 'primary' : 'tertiary'"
73+
:aria-pressed="activeFilter === 'mine'"
74+
@click="activeFilter = 'mine'">
75+
{{ t('richdocuments', 'Mine') }}
76+
</NcButton>
77+
<NcButton size="small"
78+
:variant="activeFilter === 'shared' ? 'primary' : 'tertiary'"
79+
:aria-pressed="activeFilter === 'shared'"
80+
@click="activeFilter = 'shared'">
81+
{{ t('richdocuments', 'Shared with me') }}
82+
</NcButton>
83+
</div>
84+
85+
<NcEmptyContent v-if="files.length === 0"
86+
:name="t('richdocuments', 'No {category} found', { category: categoryName(activeCreator) })">
87+
<template #icon>
88+
<FileDocumentOutline />
89+
</template>
90+
</NcEmptyContent>
91+
92+
<div v-else-if="viewMode === 'grid'" class="office-overview__grid">
7093
<FileCard v-for="file in files"
7194
:key="file.id"
7295
@click="openFile(file)">
@@ -135,6 +158,7 @@
135158
</template>
136159

137160
<script>
161+
import { getCurrentUser } from '@nextcloud/auth'
138162
import { sortNodes } from '@nextcloud/files'
139163
import { loadState } from '@nextcloud/initial-state'
140164
import { generateUrl } from '@nextcloud/router'
@@ -181,6 +205,7 @@ export default {
181205
error: null,
182206
previewEnabled: loadState('richdocuments', 'previewEnabled', false),
183207
viewMode: loadState('richdocuments', 'overview_config', {}).overview_grid_view ? 'grid' : 'list',
208+
activeFilter: 'mine',
184209
searchQuery: '',
185210
showCreateDialog: false,
186211
newFileName: '',
@@ -197,9 +222,26 @@ export default {
197222
return []
198223
}
199224
const byCategory = filterByMimes(this.allFiles, this.activeCreator.mimetypes)
200-
const filtered = this.searchQuery
201-
? byCategory.filter(f => f.basename.toLowerCase().includes(this.searchQuery.toLowerCase()))
202-
: byCategory
225+
226+
let filtered = byCategory
227+
if (this.activeFilter === 'mine') {
228+
const uid = getCurrentUser()?.uid
229+
filtered = byCategory.filter(f =>
230+
f.owner === uid
231+
&& !['group', 'shared'].includes(f.attributes?.['nc:mount-type'])
232+
)
233+
} else if (this.activeFilter === 'shared') {
234+
filtered = byCategory.filter(f =>
235+
f.attributes?.['nc:mount-type'] === 'shared'
236+
)
237+
}
238+
239+
if (this.searchQuery) {
240+
filtered = filtered.filter(f =>
241+
f.basename.toLowerCase().includes(this.searchQuery.toLowerCase())
242+
)
243+
}
244+
203245
return sortNodes(filtered, {
204246
sortFavoritesFirst: true,
205247
sortingMode: 'mtime',
@@ -367,6 +409,12 @@ export default {
367409
color: var(--color-text-maxcontrast);
368410
}
369411
412+
.office-overview__filters {
413+
display: flex;
414+
gap: calc(var(--default-grid-baseline) * 1);
415+
padding: 0 calc(var(--default-grid-baseline) * 4) calc(var(--default-grid-baseline) * 2);
416+
}
417+
370418
.office-overview__list {
371419
padding: 0 calc(var(--default-grid-baseline) * 2);
372420
}

0 commit comments

Comments
 (0)