From 5deebbe2fb1c7a394bf6ca4475b85c865bcb9193 Mon Sep 17 00:00:00 2001 From: Victor Bianchi Date: Thu, 31 Oct 2024 18:42:23 -0300 Subject: [PATCH] feat: integrate files filtering and pagination, fix IntersectionObserver Signed-off-by: Victor Bianchi --- lib/Helper/Pagination.php | 2 +- package-lock.json | 19 ++++++++++++--- package.json | 1 + src/store/files.js | 20 ++++++++++------ src/views/FilesList/FilesList.vue | 7 +----- src/views/FilesList/VirtualList.vue | 36 +++++++++++++++++++---------- 6 files changed, 56 insertions(+), 29 deletions(-) diff --git a/lib/Helper/Pagination.php b/lib/Helper/Pagination.php index 96d17ffe8a..1999e82ba3 100644 --- a/lib/Helper/Pagination.php +++ b/lib/Helper/Pagination.php @@ -59,7 +59,7 @@ public function getPagination(?int $page, ?int $length, array $filter = []): arr } private function linkToRoute(int $page, int $length, array $filter): string { - return $this->urlGenerator->linkToRoute( + return $this->urlGenerator->linkToRouteAbsolute( $this->routeName, array_merge(['page' => $page, 'length' => $length, 'apiVersion' => 'v1'], $filter) ); diff --git a/package-lock.json b/package-lock.json index 75d2e0b283..bf71c1dd19 100644 --- a/package-lock.json +++ b/package-lock.json @@ -30,6 +30,7 @@ "blueimp-md5": "^2.19.0", "copy-webpack-plugin": "^12.0.2", "crypto-js": "^4.2.0", + "debounce": "^2.2.0", "js-confetti": "^0.12.0", "lodash-es": "^4.17.21", "pinia": "^2.2.5", @@ -3325,6 +3326,18 @@ "url": "https://github.com/sponsors/antfu" } }, + "node_modules/@nextcloud/vue/node_modules/debounce": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/debounce/-/debounce-2.1.1.tgz", + "integrity": "sha512-+xRWxgel9LgTC4PwKlm7TJUK6B6qsEK77NaiNvXmeQ7Y3e6OVVsBC4a9BSptS/mAYceyAz37Oa8JTTuPRft7uQ==", + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/@nextcloud/webpack-vue-config": { "version": "6.2.0", "resolved": "https://registry.npmjs.org/@nextcloud/webpack-vue-config/-/webpack-vue-config-6.2.0.tgz", @@ -7060,9 +7073,9 @@ "license": "MIT" }, "node_modules/debounce": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/debounce/-/debounce-2.1.1.tgz", - "integrity": "sha512-+xRWxgel9LgTC4PwKlm7TJUK6B6qsEK77NaiNvXmeQ7Y3e6OVVsBC4a9BSptS/mAYceyAz37Oa8JTTuPRft7uQ==", + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/debounce/-/debounce-2.2.0.tgz", + "integrity": "sha512-Xks6RUDLZFdz8LIdR6q0MTH44k7FikOmnh5xkSjMig6ch45afc8sjTjRQf3P6ax8dMgcQrYO/AR2RGWURrruqw==", "license": "MIT", "engines": { "node": ">=18" diff --git a/package.json b/package.json index 9c43bc78b5..e5b2bb1a0e 100644 --- a/package.json +++ b/package.json @@ -41,6 +41,7 @@ "blueimp-md5": "^2.19.0", "copy-webpack-plugin": "^12.0.2", "crypto-js": "^4.2.0", + "debounce": "^2.2.0", "js-confetti": "^0.12.0", "lodash-es": "^4.17.21", "pinia": "^2.2.5", diff --git a/src/store/files.js b/src/store/files.js index b15d6a7ee3..82d05b32af 100644 --- a/src/store/files.js +++ b/src/store/files.js @@ -8,7 +8,7 @@ import { del, set } from 'vue' import { getCurrentUser } from '@nextcloud/auth' import axios from '@nextcloud/axios' -import { subscribe } from '@nextcloud/event-bus' +import { emit, subscribe } from '@nextcloud/event-bus' import { loadState } from '@nextcloud/initial-state' import Moment from '@nextcloud/moment' import { generateOcsUrl } from '@nextcloud/router' @@ -242,8 +242,10 @@ export const useFilesStore = function(...args) { } } const { chips } = useFiltersStore() - if (chips?.status?.length) { - params.set('status', chips.status.map(c => c.id)) + if (chips?.status) { + chips.status.forEach(status => { + params.append('status[]', status.id) + }) } if (chips?.modified?.length) { const { start, end } = chips.modified[0] @@ -261,18 +263,22 @@ export const useFilesStore = function(...args) { urlObj.search = params.toString() const response = await axios.get(urlObj.toString()) + + if (!this.paginationNextUrl) { + this.files = {} + this.ordered = [] + } this.paginationNextUrl = response.data.ocs.data.pagination.next this.loadedAll = !this.paginationNextUrl - this.files = {} - this.ordered = [] - response.data.ocs.data.data.forEach(file => { + response.data.ocs.data.data.forEach((file) => { this.addFile(file) }) this.loading = false + emit('libresign:files:updated') return this.files }, async updateAllFiles() { - this.paginationNext = null + this.paginationNextUrl = null this.loadedAll = false return this.getAllFiles() }, diff --git a/src/views/FilesList/FilesList.vue b/src/views/FilesList/FilesList.vue index 9fa200a825..09b4c92737 100644 --- a/src/views/FilesList/FilesList.vue +++ b/src/views/FilesList/FilesList.vue @@ -285,16 +285,11 @@ export default { }, methods: { refresh() { - console.log('Need to implement refresh') + this.filesStore.updateAllFiles() }, toggleGridView() { this.userConfigStore.update('grid_view', !this.userConfigStore.grid_view) }, - filterDirContent() { - const nodes = this.filesStore.files - console.log('Implement filter here') - this.dirContentsFiltered = nodes - }, closeSidebar() { this.filesStore.selectFile() }, diff --git a/src/views/FilesList/VirtualList.vue b/src/views/FilesList/VirtualList.vue index e42b5ac773..c9dd46320e 100644 --- a/src/views/FilesList/VirtualList.vue +++ b/src/views/FilesList/VirtualList.vue @@ -23,11 +23,16 @@ :source="item" :loading="loading" /> +