From 77cffcb04933795b41b73ccb3850c77c5905dbb7 Mon Sep 17 00:00:00 2001 From: Ferdinand Thiessen Date: Mon, 29 Jul 2024 18:52:09 +0200 Subject: fix(files_sharing): Make account file filter consistent have design Signed-off-by: Ferdinand Thiessen --- .../src/components/FileListFilterAccount.vue | 101 ++++++++++++++++++--- apps/files_sharing/src/filters/AccountFilter.ts | 18 +++- 2 files changed, 101 insertions(+), 18 deletions(-) (limited to 'apps/files_sharing/src') diff --git a/apps/files_sharing/src/components/FileListFilterAccount.vue b/apps/files_sharing/src/components/FileListFilterAccount.vue index 7a91de6464e..68383735532 100644 --- a/apps/files_sharing/src/components/FileListFilterAccount.vue +++ b/apps/files_sharing/src/components/FileListFilterAccount.vue @@ -3,25 +3,53 @@ - SPDX-License-Identifier: AGPL-3.0-or-later --> diff --git a/apps/files_sharing/src/filters/AccountFilter.ts b/apps/files_sharing/src/filters/AccountFilter.ts index 408e455e17f..29e8088dc23 100644 --- a/apps/files_sharing/src/filters/AccountFilter.ts +++ b/apps/files_sharing/src/filters/AccountFilter.ts @@ -2,7 +2,7 @@ * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors * SPDX-License-Identifier: AGPL-3.0-or-later */ -import type { INode } from '@nextcloud/files' +import type { IFileListFilterChip, INode } from '@nextcloud/files' import { FileListFilter, registerFileListFilter } from '@nextcloud/files' import Vue from 'vue' @@ -13,12 +13,14 @@ export interface IAccountData { displayName: string } +type CurrentInstance = Vue & { resetFilter: () => void, toggleAccount: (account: string) => void } + /** * File list filter to filter by owner / sharee */ class AccountFilter extends FileListFilter { - private currentInstance?: Vue + private currentInstance?: CurrentInstance private filterAccounts?: IAccountData[] constructor() { @@ -35,7 +37,7 @@ class AccountFilter extends FileListFilter { el, }) .$on('update:accounts', this.setAccounts.bind(this)) - .$mount() + .$mount() as CurrentInstance } public filter(nodes: INode[]): INode[] { @@ -66,6 +68,16 @@ class AccountFilter extends FileListFilter { public setAccounts(accounts?: IAccountData[]) { this.filterAccounts = accounts + let chips: IFileListFilterChip[] = [] + if (this.filterAccounts && this.filterAccounts.length > 0) { + chips = this.filterAccounts.map(({ displayName, uid }) => ({ + text: displayName, + user: uid, + onclick: () => this.currentInstance?.toggleAccount(uid), + })) + } + + this.updateChips(chips) this.filterUpdated() } -- cgit v1.2.3