From 70d463d7153add41c02fa2e99f470e80b1a1e120 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Fri, 20 Sep 2024 18:41:00 -0300
Subject: [PATCH 01/48] feat: rewrite file list

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 package-lock.json                             |   8 +
 package.json                                  |   2 +
 src/helpers/logger.js                         |  11 +
 src/router/router.js                          |   5 +
 src/store/filters.js                          |  27 ++
 .../FileListFilter/FileListFilter.vue         |  58 +++++
 .../FileListFilter/FileListFilterModified.vue | 128 ++++++++++
 .../FileListFilter/FileListFilterStatus.vue   | 136 ++++++++++
 src/views/FilesList/FileListFilters.vue       |  74 ++++++
 src/views/FilesList/FilesList.vue             | 232 ++++++++++++++++++
 src/views/FilesList/FilesListVirtual.vue      |  57 +++++
 src/views/FilesList/VirtualList.vue           |  13 +
 tsconfig.json                                 |   2 +-
 13 files changed, 752 insertions(+), 1 deletion(-)
 create mode 100644 src/helpers/logger.js
 create mode 100644 src/store/filters.js
 create mode 100644 src/views/FilesList/FileListFilter/FileListFilter.vue
 create mode 100644 src/views/FilesList/FileListFilter/FileListFilterModified.vue
 create mode 100644 src/views/FilesList/FileListFilter/FileListFilterStatus.vue
 create mode 100644 src/views/FilesList/FileListFilters.vue
 create mode 100644 src/views/FilesList/FilesList.vue
 create mode 100644 src/views/FilesList/FilesListVirtual.vue
 create mode 100644 src/views/FilesList/VirtualList.vue

diff --git a/package-lock.json b/package-lock.json
index c518a2a1ef..a88882e417 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,8 @@
         "@fontsource/dancing-script": "^5.1.0",
         "@libresign/vue-pdf-editor": "^1.3.7",
         "@marionebl/option": "^1.0.8",
+        "@mdi/js": "^7.4.47",
+        "@mdi/svg": "^7.4.47",
         "@nextcloud/auth": "^2.4.0",
         "@nextcloud/axios": "^2.5.1",
         "@nextcloud/dialogs": "^6.0.1",
@@ -2783,6 +2785,12 @@
       "integrity": "sha512-KPnNOtm5i2pMabqZxpUz7iQf+mfrYZyKCZ8QNz85czgEt7cuHcGorWfdzUMWYA0SD+a6Hn4FmJ+YhzzzjkTZrQ==",
       "license": "Apache-2.0"
     },
+    "node_modules/@mdi/svg": {
+      "version": "7.4.47",
+      "resolved": "https://registry.npmjs.org/@mdi/svg/-/svg-7.4.47.tgz",
+      "integrity": "sha512-WQ2gDll12T9WD34fdRFgQVgO8bag3gavrAgJ0frN4phlwdJARpE6gO1YvLEMJR0KKgoc+/Ea/A0Pp11I00xBvw==",
+      "license": "Apache-2.0"
+    },
     "node_modules/@nextcloud/auth": {
       "version": "2.4.0",
       "resolved": "https://registry.npmjs.org/@nextcloud/auth/-/auth-2.4.0.tgz",
diff --git a/package.json b/package.json
index e61294dd30..a437d6112b 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,8 @@
     "@fontsource/dancing-script": "^5.1.0",
     "@libresign/vue-pdf-editor": "^1.3.7",
     "@marionebl/option": "^1.0.8",
+    "@mdi/js": "^7.4.47",
+    "@mdi/svg": "^7.4.47",
     "@nextcloud/auth": "^2.4.0",
     "@nextcloud/axios": "^2.5.1",
     "@nextcloud/dialogs": "^6.0.1",
diff --git a/src/helpers/logger.js b/src/helpers/logger.js
new file mode 100644
index 0000000000..c9565f4ba2
--- /dev/null
+++ b/src/helpers/logger.js
@@ -0,0 +1,11 @@
+/**
+ * SPDX-FileCopyrightText: 2020-2024 LibreCode coop and contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { getLoggerBuilder } from '@nextcloud/logger'
+
+export default getLoggerBuilder()
+	.setApp('libresign')
+	.detectUser()
+	.build()
diff --git a/src/router/router.js b/src/router/router.js
index 2784e180a5..bec603b178 100644
--- a/src/router/router.js
+++ b/src/router/router.js
@@ -141,6 +141,11 @@ const router = new Router({
 			name: 'timeline',
 			component: () => import('../views/Timeline/Timeline.vue'),
 		},
+		{
+			path: '/f/filelist/sign',
+			name: 'fileslist',
+			component: () => import('../views/FilesList/FilesList.vue'),
+		},
 		{
 			path: '/f/request',
 			name: 'requestFiles',
diff --git a/src/store/filters.js b/src/store/filters.js
new file mode 100644
index 0000000000..c081bc0efd
--- /dev/null
+++ b/src/store/filters.js
@@ -0,0 +1,27 @@
+/**
+ * SPDX-FileCopyrightText: 2020-2024 LibreCode coop and contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { defineStore } from 'pinia'
+import logger from '../helpers/logger.js'
+
+export const useFiltersStore = defineStore('filter', {
+	state: () => ({
+		chips: {},
+	}),
+
+	getters: {
+		activeChips(state) {
+			return Object.values(state.chips).flat()
+		},
+	},
+
+	actions: {
+		onFilterUpdateChips(event) {
+			this.chips = { ...this.chips, [event.id]: [...event.detail] }
+
+			logger.debug('File list filter chips updated', { chips: event.detail })
+		},
+	},
+})
diff --git a/src/views/FilesList/FileListFilter/FileListFilter.vue b/src/views/FilesList/FileListFilter/FileListFilter.vue
new file mode 100644
index 0000000000..776461d3e3
--- /dev/null
+++ b/src/views/FilesList/FileListFilter/FileListFilter.vue
@@ -0,0 +1,58 @@
+<template>
+	<NcActions force-menu
+		:type="isActive ? 'secondary' : 'tertiary'"
+		:menu-name="filterName">
+		<template #icon>
+			<slot name="icon" />
+		</template>
+		<slot />
+
+		<template v-if="isActive">
+			<NcActionSeparator />
+			<NcActionButton class="files-list-filter__clear-button"
+				close-after-click
+				@click="$emit('reset-filter')">
+				{{ t('files', 'Clear filter') }}
+			</NcActionButton>
+		</template>
+	</NcActions>
+</template>
+
+<script>
+import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcActionSeparator from '@nextcloud/vue/dist/Components/NcActionSeparator.js'
+
+export default {
+	name: 'FileListFilter',
+	components: {
+		NcActions,
+		NcActionButton,
+		NcActionSeparator,
+	},
+	props: {
+		isActive: {
+			type: Boolean,
+			required: true,
+		},
+		filterName: {
+			type: String,
+			required: true,
+		},
+	},
+}
+</script>
+
+<style scoped lang="scss">
+.files-list-filter__clear-button :deep(.action-button__text) {
+	color: var(--color-error-text);
+}
+
+:deep(.button-vue) {
+	font-weight: normal !important;
+
+	* {
+		font-weight: normal !important;
+	}
+}
+</style>
diff --git a/src/views/FilesList/FileListFilter/FileListFilterModified.vue b/src/views/FilesList/FileListFilter/FileListFilterModified.vue
new file mode 100644
index 0000000000..7e355d864b
--- /dev/null
+++ b/src/views/FilesList/FileListFilter/FileListFilterModified.vue
@@ -0,0 +1,128 @@
+<template>
+	<FileListFilter :is-active="isActive"
+		:filter-name="t('libresign', 'Modified')"
+		@reset-filter="resetFilter">
+		<template #icon>
+			<NcIconSvgWrapper :path="mdiCalendarRange" />
+		</template>
+		<NcActionButton v-for="preset of timePresets"
+			:key="preset.id"
+			type="radio"
+			close-after-click
+			:model-value.sync="selectedOption"
+			:value="preset.id">
+			{{ preset.label }}
+		</NcActionButton>
+	</FileListFilter>
+</template>
+
+<script>
+import { mdiCalendarRange } from '@mdi/js'
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
+import calendarSvg from '@mdi/svg/svg/calendar.svg?raw'
+import FileListFilter from './FileListFilter.vue'
+import { useFiltersStore } from '../../../store/filters.js'
+
+const startOfToday = () => (new Date()).setHours(0, 0, 0, 0)
+
+export default {
+	name: 'FileListFilterModified',
+	components: {
+		FileListFilter,
+		NcActionButton,
+		NcIconSvgWrapper,
+	},
+	setup() {
+		const filtersStore = useFiltersStore()
+		return {
+			// icons used in template
+			mdiCalendarRange,
+			filtersStore,
+		}
+	},
+	data() {
+		return {
+			selectedOption: null,
+			timeRangeEnd: null,
+			timeRangeStart: null,
+			timePresets: [
+				{
+					id: 'today',
+					label: t('libresign', 'Today'),
+					filter: (time) => time > startOfToday(),
+				},
+				{
+					id: 'last-7',
+					label: t('libresign', 'Last 7 days'),
+					filter: (time) => time > (startOfToday() - (7 * 24 * 60 * 60 * 1000)),
+				},
+				{
+					id: 'last-30',
+					label: t('libresign', 'Last 30 days'),
+					filter: (time) => time > (startOfToday() - (30 * 24 * 60 * 60 * 1000)),
+				},
+				{
+					id: 'this-year',
+					label: t('libresign', 'This year ({year})', { year: (new Date()).getFullYear() }),
+					filter: (time) => time > (new Date(startOfToday())).setMonth(0, 1),
+				},
+				{
+					id: 'last-year',
+					label: t('libresign', 'Last year ({year})', { year: (new Date()).getFullYear() - 1 }),
+					filter: (time) => (time > (new Date(startOfToday())).setFullYear((new Date()).getFullYear() - 1, 0, 1)) && (time < (new Date(startOfToday())).setMonth(0, 1)),
+				},
+			],
+		}
+	},
+	computed: {
+		isActive() {
+			return this.selectedOption !== null
+		},
+		currentPreset() {
+			return this.timePresets.find(({ id }) => id === this.selectedOption) ?? null
+		},
+	},
+	watch: {
+		selectedOption() {
+			if (this.selectedOption === null) {
+				this.selectedOption = null
+				this.setPreset()
+			} else {
+				this.setPreset(this.currentPreset)
+
+			}
+		},
+	},
+	methods: {
+		setPreset(preset) {
+			const chips = []
+			if (preset) {
+				chips.push({
+					icon: calendarSvg,
+					text: preset.label,
+					onclick: () => this.setPreset(),
+				})
+			} else {
+				this.resetFilter()
+			}
+			this.filtersStore.onFilterUpdateChips({ detail: chips, id: 'modified' })
+		},
+		resetFilter() {
+			if (this.selectedOption !== null) {
+				this.selectedOption = null
+				this.timeRangeEnd = null
+				this.timeRangeStart = null
+			}
+		},
+	},
+}
+</script>
+
+<style scoped lang="scss">
+.files-list-filter-time {
+	&__clear-button :deep(.action-button__text) {
+		color: var(--color-error-text);
+	}
+}
+</style>
diff --git a/src/views/FilesList/FileListFilter/FileListFilterStatus.vue b/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
new file mode 100644
index 0000000000..5387855747
--- /dev/null
+++ b/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
@@ -0,0 +1,136 @@
+<template>
+	<FileListFilter class="file-list-filter-status"
+		:is-active="isActive"
+		:filter-name="t('libresign', 'Status')"
+		@reset-filter="resetFilter">
+		<template #icon>
+			<NcIconSvgWrapper :path="mdiListStatus" />
+		</template>
+		<NcActionButton v-for="status of statusPresets"
+			:key="status.id"
+			type="checkbox"
+			:model-value="selectedOptions.includes(status)"
+			@click="toggleOption(status)">
+			<template #icon>
+				<NcIconSvgWrapper :svg="status.icon" />
+			</template>
+			{{ status.label }}
+		</NcActionButton>
+	</FileListFilter>
+</template>
+
+<script>
+import { mdiListStatus } from '@mdi/js'
+
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
+import svgFile from '@mdi/svg/svg/file.svg?raw'
+import svgSignature from '@mdi/svg/svg/signature.svg?raw'
+import svgFractionOneHalf from '@mdi/svg/svg/fraction-one-half.svg?raw'
+import svgSignatureFreehand from '@mdi/svg/svg/signature-freehand.svg?raw'
+import svgDelete from '@mdi/svg/svg/delete.svg?raw'
+import FileListFilter from './FileListFilter.vue'
+import { useFiltersStore } from '../../../store/filters.js'
+
+const colorize = (svg, color) => {
+	return svg.replace('<path ', `<path fill="${color}" `)
+}
+
+export default {
+	name: 'FileListFilterStatus',
+	components: {
+		FileListFilter,
+		NcActionButton,
+		NcIconSvgWrapper,
+	},
+	setup() {
+		const filtersStore = useFiltersStore()
+		return {
+			mdiListStatus,
+			filtersStore,
+		}
+	},
+	data() {
+		return {
+			selectedOptions: [],
+			statusPresets: [
+				{
+					id: 0,
+					icon: colorize(svgFile, '#E0E0E0'),
+					label: t('libresign', 'draft'),
+				},
+				{
+					id: 1,
+					icon: colorize(svgSignature, '#B2E0B2'),
+					label: t('libresign', 'available for signature'),
+				},
+				{
+					id: 2,
+					icon: colorize(svgFractionOneHalf, '#F0E68C'),
+					label: t('libresign', 'partially signed'),
+				},
+				{
+					id: 3,
+					icon: colorize(svgSignatureFreehand, '#A0C4FF'),
+					label: t('libresign', 'signed'),
+				},
+				{
+					id: 4,
+					icon: colorize(svgDelete, '#FFB2B2'),
+					label: t('libresign', 'deleted'),
+				},
+			],
+		}
+	},
+	computed: {
+		isActive() {
+			return this.selectedOptions.length > 0
+		},
+	},
+	watch: {
+		selectedOptions(newValue, oldValue) {
+			if (newValue.length === 0) {
+				this.setPreset()
+			} else {
+				this.setPreset(newValue)
+			}
+		},
+	},
+	methods: {
+		setPreset(presets) {
+			const chips = []
+			if (presets && presets.length > 0) {
+				for (const preset of presets) {
+					chips.push({
+						icon: preset.icon,
+						text: preset.label,
+						onclick: () => this.setPreset(presets.filter(({ id }) => id !== preset.id)),
+					})
+				}
+			} else {
+				this.resetFilter()
+			}
+			this.filtersStore.onFilterUpdateChips({ detail: chips, id: 'status' })
+		},
+		resetFilter() {
+			if (this.selectedOptions.length > 0) {
+				this.selectedOptions = []
+			}
+		},
+		toggleOption(option) {
+			const idx = this.selectedOptions.indexOf(option)
+			if (idx !== -1) {
+				this.selectedOptions.splice(idx, 1)
+			} else {
+				this.selectedOptions.push(option)
+			}
+		},
+	},
+}
+</script>
+
+<style>
+.file-list-filter-status {
+	max-width: 220px;
+}
+</style>
diff --git a/src/views/FilesList/FileListFilters.vue b/src/views/FilesList/FileListFilters.vue
new file mode 100644
index 0000000000..48d174122f
--- /dev/null
+++ b/src/views/FilesList/FileListFilters.vue
@@ -0,0 +1,74 @@
+<template>
+	<div class="file-list-filters">
+		<div class="file-list-filters__filter">
+			<div class="file-list-filters__filter">
+				<FileListFilterModified />
+				<FileListFilterStatus />
+			</div>
+		</div>
+		<ul v-if="filtersStore.activeChips.length > 0" class="file-list-filters__active" :aria-label="t('libresign', 'Active filters')">
+			<li v-for="(chip, index) of filtersStore.activeChips" :key="index">
+				<NcChip :aria-label-close="t('libresign', 'Remove filter')"
+					:icon-svg="chip.icon"
+					:text="chip.text"
+					@close="chip.onclick">
+					<template v-if="chip.user" #icon>
+						<NcAvatar disable-menu
+							:show-user-status="false"
+							:size="24"
+							:user="chip.user" />
+					</template>
+				</NcChip>
+			</li>
+		</ul>
+	</div>
+</template>
+
+<script>
+import NcChip from '@nextcloud/vue/dist/Components/NcChip.js'
+import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar.js'
+import FileListFilterModified from './FileListFilter/FileListFilterModified.vue'
+import FileListFilterStatus from './FileListFilter/FileListFilterStatus.vue'
+import { useFiltersStore } from '../../store/filters.js'
+
+export default {
+	name: 'FileListFilters',
+	components: {
+		NcChip,
+		NcAvatar,
+		FileListFilterModified,
+		FileListFilterStatus,
+	},
+	setup() {
+		const filtersStore = useFiltersStore()
+		return { filtersStore }
+	},
+}
+</script>
+
+<style scoped lang="scss">
+.file-list-filters {
+	display: flex;
+	flex-direction: column;
+	gap: var(--default-grid-baseline);
+	height: 100%;
+	width: 100%;
+
+	&__filter {
+		display: flex;
+		align-items: start;
+		justify-content: start;
+		gap: calc(var(--default-grid-baseline, 4px) * 2);
+
+		> * {
+			flex: 0 1 fit-content;
+		}
+	}
+
+	&__active {
+		display: flex;
+		flex-direction: row;
+		gap: calc(var(--default-grid-baseline, 4px) * 2);
+	}
+}
+</style>
diff --git a/src/views/FilesList/FilesList.vue b/src/views/FilesList/FilesList.vue
new file mode 100644
index 0000000000..b654ef6a2c
--- /dev/null
+++ b/src/views/FilesList/FilesList.vue
@@ -0,0 +1,232 @@
+<template>
+	<NcAppContent :page-heading="t('libresign', 'Files')">
+		<div class="files-list__header">
+			<NcBreadcrumbs class="files-list__breadcrumbs">
+				<NcBreadcrumb :name="t('libresign', 'Files')"
+					:title="t('libresign', 'Files')"
+					:exact="true"
+					:force-icon-text="true"
+					:to="{ name: 'fileslist' }"
+					:aria-description="t('libresign', 'Files')"
+					:disable-drop="true"
+					@click.native="refresh()">
+					<template #icon>
+						<NcIconSvgWrapper :size="20"
+							:svg="viewIcon" />
+					</template>
+				</NcBreadcrumb>
+				<template #actions>
+					<NcActions :menu-name="t('libresign', 'Request')">
+						<template #icon>
+							<PlusIcon :size="20" />
+						</template>
+						<NcActionButton>
+							<template #icon>
+								<LinkIcon :size="20" />
+							</template>
+							{{ t('libresign', 'Upload from URL') }}
+						</NcActionButton>
+						<NcActionButton>
+							<template #icon>
+								<FolderIcon :size="20" />
+							</template>
+							{{ t('libresign', 'Choose from Files') }}
+						</NcActionButton>
+						<NcActionButton>
+							<template #icon>
+								<NcLoadingIcon v-if="isUploading" :size="20" />
+								<UploadIcon v-else :size="20" />
+							</template>
+							{{ t('libresign', 'Upload') }}
+						</NcActionButton>
+					</NcActions>
+				</template>
+			</NcBreadcrumbs>
+
+			<NcLoadingIcon v-if="isRefreshing" class="files-list__refresh-icon" />
+
+			<NcButton :aria-label="gridViewButtonLabel"
+				:title="gridViewButtonLabel"
+				class="files-list__header-grid-button"
+				type="tertiary"
+				@click="toggleGridView">
+				<template #icon>
+					<ListViewIcon v-if="userConfig.grid_view" />
+					<ViewGridIcon v-else />
+				</template>
+			</NcButton>
+		</div>
+		<NcLoadingIcon v-if="loading && !isRefreshing"
+			class="files-list__loading-icon"
+			:size="38"
+			:name="t('libresign', 'Loading …')" />
+		<NcEmptyContent v-else-if="!loading && isEmptyDir"
+			:name="t('libresign', 'There are no documents')"
+			:description="t('libresign', 'Choose the file to request signatures.')">
+			<template #icon>
+				<FolderIcon />
+			</template>
+		</NcEmptyContent>
+		<FilesListVirtual v-else
+			:nodes="dirContentsSorted" />
+	</NcAppContent>
+</template>
+
+<script>
+import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent.js'
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
+import PlusIcon from 'vue-material-design-icons/Plus.vue'
+
+import HomeSvg from '@mdi/svg/svg/home.svg?raw'
+import ListViewIcon from 'vue-material-design-icons/FormatListBulletedSquare.vue'
+import ViewGridIcon from 'vue-material-design-icons/ViewGrid.vue'
+import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
+import FolderIcon from 'vue-material-design-icons/Folder.vue'
+import UploadIcon from 'vue-material-design-icons/Upload.vue'
+import LinkIcon from 'vue-material-design-icons/Link.vue'
+import NcBreadcrumb from '@nextcloud/vue/dist/Components/NcBreadcrumb.js'
+import NcBreadcrumbs from '@nextcloud/vue/dist/Components/NcBreadcrumbs.js'
+import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
+import FilesListVirtual from './FilesListVirtual.vue'
+import NcEmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent.js'
+import { useFilesStore } from '../../store/files.js'
+
+export default {
+	name: 'FilesList',
+	components: {
+		NcAppContent,
+		NcButton,
+		PlusIcon,
+		ListViewIcon,
+		ViewGridIcon,
+		NcLoadingIcon,
+		FolderIcon,
+		UploadIcon,
+		LinkIcon,
+		NcBreadcrumb,
+		NcBreadcrumbs,
+		NcActions,
+		NcActionButton,
+		NcIconSvgWrapper,
+		FilesListVirtual,
+		NcEmptyContent,
+	},
+	setup() {
+		const filesStore = useFilesStore()
+		return { filesStore }
+	},
+	data() {
+		return {
+			isUploading: false,
+			loading: false,
+			userConfig: {
+				grid_view: false,
+			},
+			dirContentsFiltered: [],
+		}
+	},
+	computed: {
+		viewIcon() {
+			return HomeSvg
+		},
+		gridViewButtonLabel() {
+			return this.userConfig.grid_view
+				? t('libresign', 'Switch to list view')
+				: t('libresign', 'Switch to grid view')
+		},
+		dirContentsSorted() {
+			if (!this.isEmptyDir) {
+				return []
+			}
+			return this.dirContentsFiltered
+		},
+		isEmptyDir() {
+			return this.filesStore.files.length === 0
+		},
+		isRefreshing() {
+			return !this.isEmptyDir
+				&& this.loading
+		},
+	},
+	async created() {
+		await this.filesStore.getAllFiles()
+	},
+	methods: {
+		refresh() {
+			console.log('Need to implement refresh')
+		},
+		toggleGridView() {
+			this.userConfig.grid_view = !this.userConfig.grid_view
+			console.log('Need to implement toggle')
+			// this.userConfigStore.update('grid_view', !this.userConfig.grid_view)
+		},
+		filterDirContent() {
+			const nodes = this.filesStore.files
+			console.log('Implement filter here')
+			this.dirContentsFiltered = nodes
+		},
+	},
+}
+</script>
+
+<style scoped lang="scss">
+.app-content {
+	// Virtual list needs to be full height and is scrollable
+	display: flex;
+	overflow: hidden;
+	flex-direction: column;
+	max-height: 100%;
+	position: relative !important;
+}
+
+.files-list__breadcrumbs {
+	// Take as much space as possible
+	flex: 1 1 100% !important;
+	width: 100%;
+	height: 100%;
+	margin-block: 0;
+	margin-inline: 10px;
+	min-width: 0;
+
+	:deep() {
+		a {
+			cursor: pointer !important;
+		}
+	}
+
+	&--with-progress {
+		flex-direction: column !important;
+		align-items: flex-start !important;
+	}
+}
+
+.files-list {
+	&__header {
+		display: flex;
+		align-items: center;
+		// Do not grow or shrink (vertically)
+		flex: 0 0;
+		max-width: 100%;
+		// Align with the navigation toggle icon
+		margin-block: var(--app-navigation-padding, 4px);
+		margin-inline: calc(var(--default-clickable-area, 44px) + 2 * var(--app-navigation-padding, 4px)) var(--app-navigation-padding, 4px);
+
+		>* {
+			// Do not grow or shrink (horizontally)
+			flex: 0 0;
+		}
+	}
+
+	&__refresh-icon {
+		flex: 0 0 var(--default-clickable-area);
+		width: var(--default-clickable-area);
+		height: var(--default-clickable-area);
+	}
+
+	&__loading-icon {
+		margin: auto;
+	}
+}
+</style>
diff --git a/src/views/FilesList/FilesListVirtual.vue b/src/views/FilesList/FilesListVirtual.vue
new file mode 100644
index 0000000000..2a0e385d6f
--- /dev/null
+++ b/src/views/FilesList/FilesListVirtual.vue
@@ -0,0 +1,57 @@
+<template>
+	<VirtualList>
+		<template #filters>
+			<FileListFilters />
+		</template>
+	</VirtualList>
+</template>
+
+<script>
+import VirtualList from './VirtualList.vue'
+import FileListFilters from './FileListFilters.vue'
+export default {
+	name: 'FilesListVirtual',
+	components: {
+		VirtualList,
+		FileListFilters,
+	},
+	props: {
+		nodes: {
+			type: Array,
+			required: true,
+		},
+	},
+}
+</script>
+
+<style scoped lang="scss">
+.files-list {
+	--row-height: 55px;
+	--cell-margin: 14px;
+
+	--checkbox-padding: calc((var(--row-height) - var(--checkbox-size)) / 2);
+	--checkbox-size: 24px;
+	--clickable-area: var(--default-clickable-area);
+	--icon-preview-size: 32px;
+
+	--fixed-block-start-position: var(--default-clickable-area);
+
+	overflow: auto;
+	height: 100%;
+	will-change: scroll-position;
+	& :deep() {
+		.files-list__filters {
+			// Pinned on top when scrolling above table header
+			position: sticky;
+			top: 0;
+			// ensure there is a background to hide the file list on scroll
+			background-color: var(--color-main-background);
+			z-index: 10;
+			// fixed the size
+			padding-inline: var(--row-height) var(--default-grid-baseline, 4px);
+			height: var(--fixed-block-start-position);
+			width: 100%;
+		}
+	}
+}
+</style>
diff --git a/src/views/FilesList/VirtualList.vue b/src/views/FilesList/VirtualList.vue
new file mode 100644
index 0000000000..941ddf47b3
--- /dev/null
+++ b/src/views/FilesList/VirtualList.vue
@@ -0,0 +1,13 @@
+<template>
+	<div class="files-list">
+		<div class="files-list__filters">
+			<slot name="filters" />
+		</div>
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'VirtualList',
+}
+</script>
diff --git a/tsconfig.json b/tsconfig.json
index 4176c09e07..3d0d2e6764 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -12,4 +12,4 @@
 	"vueCompilerOptions": {
 		"target": 2.7,
 	}
-}
\ No newline at end of file
+}

From 9197f49cd7b5776483156c61b886aff9796cb4ad Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Mon, 23 Sep 2024 19:11:23 -0300
Subject: [PATCH 02/48] chore: start to implement FileEntry component

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/Components/LeftSidebar/LeftSidebar.vue    |   8 +
 src/helpers/logger.js                         |   2 +-
 src/store/filters.js                          |   3 +-
 src/store/userconfig.js                       |  18 +
 src/views/FilesList/FileEntry/FileEntry.vue   |  15 +
 .../FilesList/FileEntry/FileEntryGrid.vue     |  28 ++
 .../FilesList/FileEntry/FileEntryPreview.vue  |  86 ++++
 .../FileListFilter/FileListFilter.vue         |   2 +-
 .../FileListFilter/FileListFilterModified.vue |   5 +-
 .../FileListFilter/FileListFilterStatus.vue   |  12 +-
 src/views/FilesList/FileListFilters.vue       |   4 +-
 src/views/FilesList/FilesList.vue             |  42 +-
 src/views/FilesList/FilesListTableHeader.vue  | 105 +++++
 .../FilesList/FilesListTableHeaderButton.vue  |  74 ++++
 src/views/FilesList/FilesListVirtual.vue      | 392 +++++++++++++++++-
 src/views/FilesList/VirtualList.vue           |  33 ++
 16 files changed, 798 insertions(+), 31 deletions(-)
 create mode 100644 src/store/userconfig.js
 create mode 100644 src/views/FilesList/FileEntry/FileEntry.vue
 create mode 100644 src/views/FilesList/FileEntry/FileEntryGrid.vue
 create mode 100644 src/views/FilesList/FileEntry/FileEntryPreview.vue
 create mode 100644 src/views/FilesList/FilesListTableHeader.vue
 create mode 100644 src/views/FilesList/FilesListTableHeaderButton.vue

diff --git a/src/Components/LeftSidebar/LeftSidebar.vue b/src/Components/LeftSidebar/LeftSidebar.vue
index 8880abfd0a..9b24041108 100644
--- a/src/Components/LeftSidebar/LeftSidebar.vue
+++ b/src/Components/LeftSidebar/LeftSidebar.vue
@@ -23,6 +23,14 @@
 					<FolderIcon :size="20" />
 				</template>
 			</NcAppNavigationItem>
+			<NcAppNavigationItem id="fileslist"
+				:to="{ name: 'fileslist' }"
+				:name="t('libresign', 'New files')"
+				@click="unselectFile">
+				<template #icon>
+					<FolderIcon :size="20" />
+				</template>
+			</NcAppNavigationItem>
 			<NcAppNavigationItem id="validation"
 				:to="{name: 'validation'}"
 				:name="t('libresign', 'Validate')"
diff --git a/src/helpers/logger.js b/src/helpers/logger.js
index c9565f4ba2..14d74a5d63 100644
--- a/src/helpers/logger.js
+++ b/src/helpers/logger.js
@@ -1,5 +1,5 @@
 /**
- * SPDX-FileCopyrightText: 2020-2024 LibreCode coop and contributors
+ * SPDX-FileCopyrightText: 2024 LibreCode coop and contributors
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
diff --git a/src/store/filters.js b/src/store/filters.js
index c081bc0efd..cb8c13e1a9 100644
--- a/src/store/filters.js
+++ b/src/store/filters.js
@@ -1,9 +1,10 @@
 /**
- * SPDX-FileCopyrightText: 2020-2024 LibreCode coop and contributors
+ * SPDX-FileCopyrightText: 2024 LibreCode coop and contributors
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
 import { defineStore } from 'pinia'
+
 import logger from '../helpers/logger.js'
 
 export const useFiltersStore = defineStore('filter', {
diff --git a/src/store/userconfig.js b/src/store/userconfig.js
new file mode 100644
index 0000000000..2b371cbe86
--- /dev/null
+++ b/src/store/userconfig.js
@@ -0,0 +1,18 @@
+/**
+ * SPDX-FileCopyrightText: 2024 LibreCode coop and contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { defineStore } from 'pinia'
+import Vue from 'vue'
+
+export const useUserConfigStore = defineStore('userconfig', {
+	state: () => ({
+		grid_view: true,
+	}),
+	actions: {
+		async update(key, value) {
+			Vue.set(this, key, value)
+		},
+	},
+})
diff --git a/src/views/FilesList/FileEntry/FileEntry.vue b/src/views/FilesList/FileEntry/FileEntry.vue
new file mode 100644
index 0000000000..dc93584abf
--- /dev/null
+++ b/src/views/FilesList/FileEntry/FileEntry.vue
@@ -0,0 +1,15 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
+<template>
+	<tr />
+</template>
+
+<script>
+
+export default {
+	name: 'FileEntry',
+}
+</script>
diff --git a/src/views/FilesList/FileEntry/FileEntryGrid.vue b/src/views/FilesList/FileEntry/FileEntryGrid.vue
new file mode 100644
index 0000000000..e578746397
--- /dev/null
+++ b/src/views/FilesList/FileEntry/FileEntryGrid.vue
@@ -0,0 +1,28 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
+<template>
+	<tr>
+		<td class="files-list__row-name">
+			<FileEntryPreview :source="source" />
+		</td>
+	</tr>
+</template>
+
+<script>
+import FileEntryPreview from './FileEntryPreview.vue'
+export default {
+	name: 'FileEntryGrid',
+	components: {
+		FileEntryPreview,
+	},
+	props: {
+		source: {
+			type: Object,
+			required: true,
+		},
+	},
+}
+</script>
diff --git a/src/views/FilesList/FileEntry/FileEntryPreview.vue b/src/views/FilesList/FileEntry/FileEntryPreview.vue
new file mode 100644
index 0000000000..5ea56f7725
--- /dev/null
+++ b/src/views/FilesList/FileEntry/FileEntryPreview.vue
@@ -0,0 +1,86 @@
+<template>
+	<span class="files-list__row-icon">
+		<!-- Decorative images, should not be aria documented -->
+		<span v-if="previewUrl" class="files-list__row-icon-preview-container">
+			<img v-if="backgroundFailed !== true"
+				ref="previewImg"
+				alt=""
+				class="files-list__row-icon-preview"
+				:class="{'files-list__row-icon-preview--loaded': backgroundFailed === false}"
+				loading="lazy"
+				:src="previewUrl"
+				@error="backgroundFailed = true"
+				@load="backgroundFailed = false">
+		</span>
+
+		<FileIcon v-else v-once />
+
+		<!-- Favorite icon -->
+		<span v-if="isFavorite" class="files-list__row-icon-favorite">
+			<FavoriteIcon v-once />
+		</span>
+	</span>
+</template>
+
+<script>
+import FileIcon from 'vue-material-design-icons/File.vue'
+
+import { generateUrl, generateOcsUrl } from '@nextcloud/router'
+
+import { useUserConfigStore } from '../../../store/userconfig.js'
+
+export default {
+	name: 'FileEntryPreview',
+
+	components: {
+		FileIcon,
+	},
+	props: {
+		source: {
+			type: Object,
+			required: true,
+		},
+	},
+	setup() {
+		const userConfigStore = useUserConfigStore()
+		return { userConfigStore }
+	},
+	data() {
+		return {
+			backgroundFailed: false,
+		}
+	},
+	computed: {
+		isFavorite() {
+			return this.source?.attributes?.favorite === 1
+		},
+		previewUrl() {
+			if (this.backgroundFailed === true) {
+				return null
+			}
+
+			let previewUrl = ''
+			if (this.source?.uuid?.length > 0) {
+				previewUrl = generateOcsUrl('/apps/libresign/api/v1/file/thumbnail/{nodeId}', {
+					nodeId: this.source.nodeId,
+				})
+			} else {
+				previewUrl = window.location.origin + generateUrl('/core/preview?fileId={fileid}', {
+					fileid: this.source.nodeId,
+				})
+			}
+
+			const url = new URL(previewUrl)
+
+			// Request tiny previews
+			url.searchParams.set('x', this.userConfigStore.grid_view ? '128' : '32')
+			url.searchParams.set('y', this.userConfigStore.grid_view ? '128' : '32')
+			url.searchParams.set('mimeFallback', 'true')
+
+			// Handle cropping
+			url.searchParams.set('a', this.cropPreviews === true ? '0' : '1')
+			return url
+		},
+	},
+}
+</script>
diff --git a/src/views/FilesList/FileListFilter/FileListFilter.vue b/src/views/FilesList/FileListFilter/FileListFilter.vue
index 776461d3e3..d235074b5e 100644
--- a/src/views/FilesList/FileListFilter/FileListFilter.vue
+++ b/src/views/FilesList/FileListFilter/FileListFilter.vue
@@ -19,8 +19,8 @@
 </template>
 
 <script>
-import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcActionSeparator from '@nextcloud/vue/dist/Components/NcActionSeparator.js'
 
 export default {
diff --git a/src/views/FilesList/FileListFilter/FileListFilterModified.vue b/src/views/FilesList/FileListFilter/FileListFilterModified.vue
index 7e355d864b..8634199086 100644
--- a/src/views/FilesList/FileListFilter/FileListFilterModified.vue
+++ b/src/views/FilesList/FileListFilter/FileListFilterModified.vue
@@ -18,10 +18,13 @@
 
 <script>
 import { mdiCalendarRange } from '@mdi/js'
+import calendarSvg from '@mdi/svg/svg/calendar.svg?raw'
+
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
-import calendarSvg from '@mdi/svg/svg/calendar.svg?raw'
+
 import FileListFilter from './FileListFilter.vue'
+
 import { useFiltersStore } from '../../../store/filters.js'
 
 const startOfToday = () => (new Date()).setHours(0, 0, 0, 0)
diff --git a/src/views/FilesList/FileListFilter/FileListFilterStatus.vue b/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
index 5387855747..d68fa5fda7 100644
--- a/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
+++ b/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
@@ -21,15 +21,17 @@
 
 <script>
 import { mdiListStatus } from '@mdi/js'
-
-import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
-import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
+import svgDelete from '@mdi/svg/svg/delete.svg?raw'
 import svgFile from '@mdi/svg/svg/file.svg?raw'
-import svgSignature from '@mdi/svg/svg/signature.svg?raw'
 import svgFractionOneHalf from '@mdi/svg/svg/fraction-one-half.svg?raw'
 import svgSignatureFreehand from '@mdi/svg/svg/signature-freehand.svg?raw'
-import svgDelete from '@mdi/svg/svg/delete.svg?raw'
+import svgSignature from '@mdi/svg/svg/signature.svg?raw'
+
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
+
 import FileListFilter from './FileListFilter.vue'
+
 import { useFiltersStore } from '../../../store/filters.js'
 
 const colorize = (svg, color) => {
diff --git a/src/views/FilesList/FileListFilters.vue b/src/views/FilesList/FileListFilters.vue
index 48d174122f..1f24a1420f 100644
--- a/src/views/FilesList/FileListFilters.vue
+++ b/src/views/FilesList/FileListFilters.vue
@@ -25,10 +25,12 @@
 </template>
 
 <script>
-import NcChip from '@nextcloud/vue/dist/Components/NcChip.js'
 import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar.js'
+import NcChip from '@nextcloud/vue/dist/Components/NcChip.js'
+
 import FileListFilterModified from './FileListFilter/FileListFilterModified.vue'
 import FileListFilterStatus from './FileListFilter/FileListFilterStatus.vue'
+
 import { useFiltersStore } from '../../store/filters.js'
 
 export default {
diff --git a/src/views/FilesList/FilesList.vue b/src/views/FilesList/FilesList.vue
index b654ef6a2c..9dc04f48f8 100644
--- a/src/views/FilesList/FilesList.vue
+++ b/src/views/FilesList/FilesList.vue
@@ -51,7 +51,7 @@
 				type="tertiary"
 				@click="toggleGridView">
 				<template #icon>
-					<ListViewIcon v-if="userConfig.grid_view" />
+					<ListViewIcon v-if="userConfigStore.grid_view" />
 					<ViewGridIcon v-else />
 				</template>
 			</NcButton>
@@ -73,25 +73,30 @@
 </template>
 
 <script>
-import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent.js'
-import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
-import PlusIcon from 'vue-material-design-icons/Plus.vue'
 
 import HomeSvg from '@mdi/svg/svg/home.svg?raw'
-import ListViewIcon from 'vue-material-design-icons/FormatListBulletedSquare.vue'
-import ViewGridIcon from 'vue-material-design-icons/ViewGrid.vue'
-import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
+
 import FolderIcon from 'vue-material-design-icons/Folder.vue'
-import UploadIcon from 'vue-material-design-icons/Upload.vue'
+import ListViewIcon from 'vue-material-design-icons/FormatListBulletedSquare.vue'
 import LinkIcon from 'vue-material-design-icons/Link.vue'
+import PlusIcon from 'vue-material-design-icons/Plus.vue'
+import UploadIcon from 'vue-material-design-icons/Upload.vue'
+import ViewGridIcon from 'vue-material-design-icons/ViewGrid.vue'
+
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
+import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent.js'
 import NcBreadcrumb from '@nextcloud/vue/dist/Components/NcBreadcrumb.js'
 import NcBreadcrumbs from '@nextcloud/vue/dist/Components/NcBreadcrumbs.js'
-import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
-import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
+import NcEmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent.js'
 import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
+import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
+
 import FilesListVirtual from './FilesListVirtual.vue'
-import NcEmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent.js'
+
 import { useFilesStore } from '../../store/files.js'
+import { useUserConfigStore } from '../../store/userconfig.js'
 
 export default {
 	name: 'FilesList',
@@ -115,15 +120,16 @@ export default {
 	},
 	setup() {
 		const filesStore = useFilesStore()
-		return { filesStore }
+		const userConfigStore = useUserConfigStore()
+		return {
+			filesStore,
+			userConfigStore,
+		}
 	},
 	data() {
 		return {
 			isUploading: false,
 			loading: false,
-			userConfig: {
-				grid_view: false,
-			},
 			dirContentsFiltered: [],
 		}
 	},
@@ -132,7 +138,7 @@ export default {
 			return HomeSvg
 		},
 		gridViewButtonLabel() {
-			return this.userConfig.grid_view
+			return this.userConfigStore.grid_view
 				? t('libresign', 'Switch to list view')
 				: t('libresign', 'Switch to grid view')
 		},
@@ -158,9 +164,7 @@ export default {
 			console.log('Need to implement refresh')
 		},
 		toggleGridView() {
-			this.userConfig.grid_view = !this.userConfig.grid_view
-			console.log('Need to implement toggle')
-			// this.userConfigStore.update('grid_view', !this.userConfig.grid_view)
+			this.userConfigStore.update('grid_view', !this.userConfigStore.grid_view)
 		},
 		filterDirContent() {
 			const nodes = this.filesStore.files
diff --git a/src/views/FilesList/FilesListTableHeader.vue b/src/views/FilesList/FilesListTableHeader.vue
new file mode 100644
index 0000000000..e1d109bf64
--- /dev/null
+++ b/src/views/FilesList/FilesListTableHeader.vue
@@ -0,0 +1,105 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+<template>
+	<tr class="files-list__row-head">
+		<th class="files-list__column files-list__row-checkbox">
+			<NcCheckboxRadioSwitch />
+		</th>
+
+		<!-- Columns display -->
+
+		<!-- Link to file -->
+		<th class="files-list__column files-list__row-name files-list__column--sortable">
+			<!-- Icon or preview -->
+			<span class="files-list__row-icon" />
+
+			<!-- Name -->
+			<FilesListTableHeaderButton :name="t('files', 'Name')" mode="basename" />
+		</th>
+
+		<!-- Actions -->
+		<th class="files-list__row-actions" />
+
+		<!-- Custom views columns -->
+		<th v-for="column in columns"
+			:key="column.id"
+			:class="classForColumn(column)"
+			:aria-sort="ariaSortForMode(column.id)">
+			<FilesListTableHeaderButton v-if="!!column.sort" :name="column.title" :mode="column.id" />
+			<span v-else>
+				{{ column.title }}
+			</span>
+		</th>
+	</tr>
+</template>
+
+<script>
+import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
+
+import FilesListTableHeaderButton from './FilesListTableHeaderButton.vue'
+
+export default {
+	name: 'FilesListTableHeader',
+
+	components: {
+		FilesListTableHeaderButton,
+		NcCheckboxRadioSwitch,
+	},
+
+	props: {
+		nodes: {
+			type: Array,
+			required: true,
+		},
+	},
+	data() {
+		return {
+			isAscSorting: false,
+			sortingMode: 'name',
+			columns: [
+				{
+					title: t('libresign', 'Status'),
+					id: 'status',
+					sort: true,
+				},
+				{
+					title: t('libresign', 'Modified'),
+					id: 'modified',
+					sort: true,
+				},
+			],
+		}
+	},
+	methods: {
+		ariaSortForMode(mode) {
+			if (this.sortingMode === mode) {
+				return this.isAscSorting ? 'ascending' : 'descending'
+			}
+			return null
+		},
+		classForColumn(column) {
+			return {
+				'files-list__column': true,
+				'files-list__column--sortable': !!column.sort,
+				'files-list__row-column-custom': true,
+				[`files-list__row-${column.id}`]: true,
+			}
+		},
+	},
+}
+</script>
+
+<style scoped lang="scss">
+.files-list__column {
+	user-select: none;
+	// Make sure the cell colors don't apply to column headers
+	color: var(--color-text-maxcontrast) !important;
+
+	&--sortable {
+		cursor: pointer;
+	}
+}
+
+</style>
diff --git a/src/views/FilesList/FilesListTableHeaderButton.vue b/src/views/FilesList/FilesListTableHeaderButton.vue
new file mode 100644
index 0000000000..982d41617d
--- /dev/null
+++ b/src/views/FilesList/FilesListTableHeaderButton.vue
@@ -0,0 +1,74 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+<template>
+	<NcButton :alignment="mode === 'size' ? 'end' : 'start-reverse'"
+		type="tertiary">
+		<template #icon>
+			<MenuUp v-if="true" class="files-list__column-sort-button-icon" />
+			<MenuDown v-else class="files-list__column-sort-button-icon" />
+		</template>
+		<span class="files-list__column-sort-button-text">{{ name }}</span>
+	</NcButton>
+</template>
+
+<script>
+
+import MenuDown from 'vue-material-design-icons/MenuDown.vue'
+import MenuUp from 'vue-material-design-icons/MenuUp.vue'
+
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
+
+export default {
+	name: 'FilesListTableHeaderButton',
+
+	components: {
+		MenuDown,
+		MenuUp,
+		NcButton,
+	},
+
+	props: {
+		name: {
+			type: String,
+			required: true,
+		},
+		mode: {
+			type: String,
+			required: true,
+		},
+	},
+}
+</script>
+
+<style scoped lang="scss">
+.files-list__column-sort-button {
+	// Compensate for cells margin
+	margin: 0 calc(var(--button-padding, var(--cell-margin)) * -1);
+	min-width: calc(100% - 3 * var(--cell-margin))!important;
+
+	&-text {
+		color: var(--color-text-maxcontrast);
+		font-weight: normal;
+	}
+
+	&-icon {
+		color: var(--color-text-maxcontrast);
+		opacity: 0;
+		transition: opacity var(--animation-quick);
+		inset-inline-start: -10px;
+	}
+
+	&--size &-icon {
+		inset-inline-start: 10px;
+	}
+
+	&--active &-icon,
+	&:hover &-icon,
+	&:focus &-icon,
+	&:active &-icon {
+		opacity: 1;
+	}
+}
+</style>
diff --git a/src/views/FilesList/FilesListVirtual.vue b/src/views/FilesList/FilesListVirtual.vue
index 2a0e385d6f..735ce7d983 100644
--- a/src/views/FilesList/FilesListVirtual.vue
+++ b/src/views/FilesList/FilesListVirtual.vue
@@ -1,19 +1,34 @@
 <template>
-	<VirtualList>
+	<VirtualList :data-component="userConfigStore.grid_view ? FileEntryGrid : FileEntry">
 		<template #filters>
 			<FileListFilters />
 		</template>
+		<template #header>
+			<!-- Table header and sort buttons -->
+			<FilesListTableHeader ref="thead"
+				:nodes="nodes" />
+		</template>
 	</VirtualList>
 </template>
 
 <script>
-import VirtualList from './VirtualList.vue'
+import FileEntry from './FileEntry/FileEntry.vue'
+import FileEntryGrid from './FileEntry/FileEntryGrid.vue'
 import FileListFilters from './FileListFilters.vue'
+import FilesListTableHeader from './FilesListTableHeader.vue'
+import VirtualList from './VirtualList.vue'
+
+import { useFilesStore } from '../../store/files.js'
+import { useUserConfigStore } from '../../store/userconfig.js'
+
 export default {
 	name: 'FilesListVirtual',
 	components: {
 		VirtualList,
 		FileListFilters,
+		FilesListTableHeader,
+		FileEntry,
+		FileEntryGrid,
 	},
 	props: {
 		nodes: {
@@ -21,6 +36,20 @@ export default {
 			required: true,
 		},
 	},
+	setup() {
+		const filesStore = useFilesStore()
+		const userConfigStore = useUserConfigStore()
+		return {
+			filesStore,
+			userConfigStore,
+		}
+	},
+	data() {
+		return {
+			FileEntry,
+			FileEntryGrid,
+		}
+	},
 }
 </script>
 
@@ -39,7 +68,41 @@ export default {
 	overflow: auto;
 	height: 100%;
 	will-change: scroll-position;
+
+	&:has(.file-list-filters__active) {
+		--fixed-block-start-position: calc(var(--default-clickable-area) + var(--default-grid-baseline) + var(--clickable-area-small));
+	}
+
 	& :deep() {
+		// Table head, body and footer
+		tbody {
+			will-change: padding;
+			contain: layout paint style;
+			display: flex;
+			flex-direction: column;
+			width: 100%;
+			// Necessary for virtual scrolling absolute
+			position: relative;
+
+			/* Hover effect on tbody lines only */
+			tr {
+				contain: strict;
+				&:hover,
+				&:focus {
+					background-color: var(--color-background-dark);
+				}
+			}
+		}
+
+		.files-list__table {
+			display: block;
+
+			&.files-list__table--with-thead-overlay {
+				// Hide the table header below the overlay
+				margin-block-start: calc(-1 * var(--row-height));
+			}
+		}
+
 		.files-list__filters {
 			// Pinned on top when scrolling above table header
 			position: sticky;
@@ -52,6 +115,331 @@ export default {
 			height: var(--fixed-block-start-position);
 			width: 100%;
 		}
+
+		.files-list__thead,
+		.files-list__tfoot {
+			display: flex;
+			flex-direction: column;
+			width: 100%;
+			background-color: var(--color-main-background);
+
+		}
+
+		// Table header
+		.files-list__thead {
+			// Pinned on top when scrolling
+			position: sticky;
+			z-index: 10;
+			top: var(--fixed-block-start-position);
+		}
+
+		tr {
+			position: relative;
+			display: flex;
+			align-items: center;
+			width: 100%;
+			user-select: none;
+			border-block-end: 1px solid var(--color-border);
+			box-sizing: border-box;
+			user-select: none;
+			height: var(--row-height);
+		}
+
+		td, th {
+			display: flex;
+			align-items: center;
+			flex: 0 0 auto;
+			justify-content: start;
+			width: var(--row-height);
+			height: var(--row-height);
+			margin: 0;
+			padding: 0;
+			color: var(--color-text-maxcontrast);
+			border: none;
+
+			// Columns should try to add any text
+			// node wrapped in a span. That should help
+			// with the ellipsis on overflow.
+			span {
+				overflow: hidden;
+				white-space: nowrap;
+				text-overflow: ellipsis;
+			}
+		}
+
+		.files-list__row-checkbox {
+			justify-content: center;
+
+			.checkbox-radio-switch {
+				display: flex;
+				justify-content: center;
+
+				--icon-size: var(--checkbox-size);
+
+				label.checkbox-radio-switch__label {
+					width: var(--clickable-area);
+					height: var(--clickable-area);
+					margin: 0;
+					padding: calc((var(--clickable-area) - var(--checkbox-size)) / 2);
+				}
+
+				.checkbox-radio-switch__icon {
+					margin: 0 !important;
+				}
+			}
+		}
+
+		.files-list__row {
+			&:hover, &:focus, &:active, &--active, &--dragover {
+				// WCAG AA compliant
+				background-color: var(--color-background-hover);
+				// text-maxcontrast have been designed to pass WCAG AA over
+				// a white background, we need to adjust then.
+				--color-text-maxcontrast: var(--color-main-text);
+				> * {
+					--color-border: var(--color-border-dark);
+				}
+
+				// Hover state of the row should also change the favorite markers background
+				.favorite-marker-icon svg path {
+					stroke: var(--color-background-hover);
+				}
+			}
+
+			&--dragover * {
+				// Prevent dropping on row children
+				pointer-events: none;
+			}
+		}
+
+		// Entry preview or mime icon
+		.files-list__row-icon {
+			position: relative;
+			display: flex;
+			overflow: visible;
+			align-items: center;
+			// No shrinking or growing allowed
+			flex: 0 0 var(--icon-preview-size);
+			justify-content: center;
+			width: var(--icon-preview-size);
+			height: 100%;
+			// Show same padding as the checkbox right padding for visual balance
+			margin-inline-end: var(--checkbox-padding);
+			color: var(--color-primary-element);
+
+			// Icon is also clickable
+			* {
+				cursor: pointer;
+			}
+
+			& > span {
+				justify-content: flex-start;
+
+				&:not(.files-list__row-icon-favorite) svg {
+					width: var(--icon-preview-size);
+					height: var(--icon-preview-size);
+				}
+
+				// Slightly increase the size of the folder icon
+				&.folder-icon,
+				&.folder-open-icon {
+					margin: -3px;
+					svg {
+						width: calc(var(--icon-preview-size) + 6px);
+						height: calc(var(--icon-preview-size) + 6px);
+					}
+				}
+			}
+
+			&-preview-container {
+				position: relative; // Needed for the blurshash to be positioned correctly
+				overflow: hidden;
+				width: var(--icon-preview-size);
+				height: var(--icon-preview-size);
+				border-radius: var(--border-radius);
+			}
+
+			&-blurhash {
+				position: absolute;
+				inset-block-start: 0;
+				inset-inline-start: 0;
+				height: 100%;
+				width: 100%;
+				object-fit: cover;
+			}
+
+			&-preview {
+				// Center and contain the preview
+				object-fit: contain;
+				object-position: center;
+
+				height: 100%;
+				width: 100%;
+
+				/* Preview not loaded animation effect */
+				&:not(.files-list__row-icon-preview--loaded) {
+					background: var(--color-loading-dark);
+					// animation: preview-gradient-fade 1.2s ease-in-out infinite;
+				}
+			}
+
+			&-favorite {
+				position: absolute;
+				top: 0px;
+				inset-inline-end: -10px;
+			}
+
+			// File and folder overlay
+			&-overlay {
+				position: absolute;
+				max-height: calc(var(--icon-preview-size) * 0.5);
+				max-width: calc(var(--icon-preview-size) * 0.5);
+				color: var(--color-primary-element-text);
+				// better alignment with the folder icon
+				margin-block-start: 2px;
+
+				// Improve icon contrast with a background for files
+				&--file {
+					color: var(--color-main-text);
+					background: var(--color-main-background);
+					border-radius: 100%;
+				}
+			}
+		}
+
+		// Entry link
+		.files-list__row-name {
+			// Prevent link from overflowing
+			overflow: hidden;
+			// Take as much space as possible
+			flex: 1 1 auto;
+		}
+
+		.files-list__row-actions {
+			// take as much space as necessary
+			width: auto;
+
+			// Add margin to all cells after the actions
+			& ~ td,
+			& ~ th {
+				margin: 0 var(--cell-margin);
+			}
+
+			button {
+				.button-vue__text {
+					// Remove bold from default button styling
+					font-weight: normal;
+				}
+			}
+		}
+
+		.files-list__row-column-custom {
+			width: calc(var(--row-height) * 2);
+		}
+	}
+
+}
+</style>
+
+<style lang="scss">
+// Grid mode
+tbody.files-list__tbody.files-list__tbody--grid {
+	--half-clickable-area: calc(var(--clickable-area) / 2);
+	--item-padding: 16px;
+	--icon-preview-size: 166px;
+	--name-height: 32px;
+	--mtime-height: 16px;
+	--row-width: calc(var(--icon-preview-size) + var(--item-padding) * 2);
+	--row-height: calc(var(--icon-preview-size) + var(--name-height) + var(--mtime-height) + var(--item-padding) * 2);
+	--checkbox-padding: 0px;
+
+	display: grid;
+	grid-template-columns: repeat(auto-fill, var(--row-width));
+
+	align-content: center;
+	align-items: center;
+	justify-content: space-around;
+	justify-items: center;
+
+	tr {
+		display: flex;
+		flex-direction: column;
+		width: var(--row-width);
+		height: var(--row-height);
+		border: none;
+		border-radius: var(--border-radius-large);
+		padding: var(--item-padding);
+	}
+
+	// Checkbox in the top left
+	.files-list__row-checkbox {
+		position: absolute;
+		z-index: 9;
+		top: calc(var(--item-padding)/2);
+		inset-inline-start: calc(var(--item-padding)/2);
+		overflow: hidden;
+		--checkbox-container-size: 44px;
+		width: var(--checkbox-container-size);
+		height: var(--checkbox-container-size);
+
+		// Add a background to the checkbox so we do not see the image through it.
+		.checkbox-radio-switch__content::after {
+			content: '';
+			width: 16px;
+			height: 16px;
+			position: absolute;
+			inset-inline-start: 50%;
+			margin-inline-start: -8px;
+			z-index: -1;
+			background: var(--color-main-background);
+		}
+	}
+
+	// Star icon in the top right
+	.files-list__row-icon-favorite {
+		position: absolute;
+		top: 0;
+		inset-inline-end: 0;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: var(--clickable-area);
+		height: var(--clickable-area);
+	}
+
+	.files-list__row-name {
+		display: flex;
+		flex-direction: column;
+		width: var(--icon-preview-size);
+		height: calc(var(--icon-preview-size) + var(--name-height));
+		// Ensure that the name outline is visible.
+		overflow: visible;
+
+		span.files-list__row-icon {
+			width: var(--icon-preview-size);
+			height: var(--icon-preview-size);
+		}
+
+		.files-list__row-name-text {
+			margin: 0;
+			// Ensure that the outline is not too close to the text.
+			margin-inline-start: -4px;
+			padding: 0px 4px;
+		}
+	}
+
+	.files-list__row-mtime {
+		width: var(--icon-preview-size);
+		height: var(--mtime-height);
+		font-size: calc(var(--default-font-size) - 4px);
+	}
+
+	.files-list__row-actions {
+		position: absolute;
+		inset-inline-end: calc(var(--half-clickable-area) / 2);
+		inset-block-end: calc(var(--mtime-height) / 2);
+		width: var(--clickable-area);
+		height: var(--clickable-area);
 	}
 }
 </style>
diff --git a/src/views/FilesList/VirtualList.vue b/src/views/FilesList/VirtualList.vue
index 941ddf47b3..fddcaa33ac 100644
--- a/src/views/FilesList/VirtualList.vue
+++ b/src/views/FilesList/VirtualList.vue
@@ -3,11 +3,44 @@
 		<div class="files-list__filters">
 			<slot name="filters" />
 		</div>
+
+		<table class="files-list__table">
+			<!-- Header -->
+			<thead ref="thead" class="files-list__thead">
+				<slot name="header" />
+			</thead>
+			<!-- Body -->
+			<tbody class="files-list__tbody"
+				:class="userConfigStore.grid_view ? 'files-list__tbody--grid' : 'files-list__tbody--list'"
+				data-cy-files-list-tbody>
+				<component :is="dataComponent"
+					v-for="item in filesStore.files"
+					:key="item.nodeId"
+					:source="item" />
+			</tbody>
+		</table>
 	</div>
 </template>
 
 <script>
+import { useFilesStore } from '../../store/files.js'
+import { useUserConfigStore } from '../../store/userconfig.js'
+
 export default {
 	name: 'VirtualList',
+	props: {
+		dataComponent: {
+			type: [Object, Function],
+			required: true,
+		},
+	},
+	setup() {
+		const filesStore = useFilesStore()
+		const userConfigStore = useUserConfigStore()
+		return {
+			filesStore,
+			userConfigStore,
+		}
+	},
 }
 </script>

From ae251c8759151d1269a544a9279ae24e55689721 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Tue, 24 Sep 2024 11:55:30 -0300
Subject: [PATCH 03/48] fix: linter

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/store/userconfig.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/store/userconfig.js b/src/store/userconfig.js
index 2b371cbe86..7e70f4808f 100644
--- a/src/store/userconfig.js
+++ b/src/store/userconfig.js
@@ -4,7 +4,7 @@
  */
 
 import { defineStore } from 'pinia'
-import Vue from 'vue'
+import { set } from 'vue'
 
 export const useUserConfigStore = defineStore('userconfig', {
 	state: () => ({
@@ -12,7 +12,7 @@ export const useUserConfigStore = defineStore('userconfig', {
 	}),
 	actions: {
 		async update(key, value) {
-			Vue.set(this, key, value)
+			set(this, key, value)
 		},
 	},
 })

From 1a56cff4928278585f1683ca8abf8eca45aae0f9 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Tue, 24 Sep 2024 11:55:48 -0300
Subject: [PATCH 04/48] feat: add FileEntryName component

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 .../FilesList/FileEntry/FileEntryGrid.vue     | 35 ++++++++++
 .../FilesList/FileEntry/FileEntryName.vue     | 70 +++++++++++++++++++
 src/views/FilesList/FilesListVirtual.vue      | 42 +++++++++++
 3 files changed, 147 insertions(+)
 create mode 100644 src/views/FilesList/FileEntry/FileEntryName.vue

diff --git a/src/views/FilesList/FileEntry/FileEntryGrid.vue b/src/views/FilesList/FileEntry/FileEntryGrid.vue
index e578746397..3f9cd6a715 100644
--- a/src/views/FilesList/FileEntry/FileEntryGrid.vue
+++ b/src/views/FilesList/FileEntry/FileEntryGrid.vue
@@ -7,15 +7,28 @@
 	<tr>
 		<td class="files-list__row-name">
 			<FileEntryPreview :source="source" />
+			<FileEntryName ref="name"
+				:basename="source.name"
+				:extension="'.pdf'" />
+		</td>
+
+		<!-- Mtime -->
+		<td :style="mtimeOpacity"
+			class="files-list__row-mtime">
+			<NcDateTime v-if="source.request_date" :timestamp="mtime" :ignore-seconds="true" />
 		</td>
 	</tr>
 </template>
 
 <script>
+import NcDateTime from '@nextcloud/vue/dist/Components/NcDateTime.js'
+import FileEntryName from './FileEntryName.vue'
 import FileEntryPreview from './FileEntryPreview.vue'
 export default {
 	name: 'FileEntryGrid',
 	components: {
+		NcDateTime,
+		FileEntryName,
 		FileEntryPreview,
 	},
 	props: {
@@ -24,5 +37,27 @@ export default {
 			required: true,
 		},
 	},
+	computed: {
+		mtime() {
+			return Date.parse(this?.source?.request_date)
+		},
+		mtimeOpacity() {
+			const maxOpacityTime = 31 * 24 * 60 * 60 * 1000 // 31 days
+
+			const mtime = this.mtime?.getTime?.()
+			if (!mtime) {
+				return {}
+			}
+
+			// 1 = today, 0 = 31 days ago
+			const ratio = Math.round(Math.min(100, 100 * (maxOpacityTime - (Date.now() - mtime)) / maxOpacityTime))
+			if (ratio < 0) {
+				return {}
+			}
+			return {
+				color: `color-mix(in srgb, var(--color-main-text) ${ratio}%, var(--color-text-maxcontrast))`,
+			}
+		},
+	}
 }
 </script>
diff --git a/src/views/FilesList/FileEntry/FileEntryName.vue b/src/views/FilesList/FileEntry/FileEntryName.vue
new file mode 100644
index 0000000000..578a82f54e
--- /dev/null
+++ b/src/views/FilesList/FileEntry/FileEntryName.vue
@@ -0,0 +1,70 @@
+<template>
+	<component :is="linkTo.is"
+		ref="basename"
+		class="files-list__row-name-link"
+		v-bind="linkTo.params"
+		dir="auto">
+		<!-- Filename -->
+		<span class="files-list__row-name-text">
+			<!-- Keep the filename stuck to the extension to avoid whitespace rendering issues-->
+			<span class="files-list__row-name-" v-text="basename" />
+			<span class="files-list__row-name-ext" v-text="extension" />
+		</span>
+	</component>
+</template>
+
+<script>
+
+import NcTextField from '@nextcloud/vue/dist/Components/NcTextField.js'
+
+export default {
+	name: 'FileEntryName',
+
+	components: {
+		NcTextField,
+	},
+
+	props: {
+		/**
+		 * The filename without extension
+		 */
+		basename: {
+			type: String,
+			required: true,
+		},
+		/**
+		 * The extension of the filename
+		 */
+		extension: {
+			type: String,
+			required: true,
+		},
+	},
+
+	computed: {
+		linkTo() {
+			return {
+				is: 'button',
+				params: {
+					'aria-label': this.basename,
+					title: this.basename,
+					tabindex: '0',
+				},
+			}
+		},
+	},
+}
+</script>
+
+<style scoped lang="scss">
+button.files-list__row-name-link {
+	background-color: unset;
+	border: none;
+	font-weight: normal;
+
+	&:active {
+		// No active styles - handled by the row entry
+		background-color: unset !important;
+	}
+}
+</style>
diff --git a/src/views/FilesList/FilesListVirtual.vue b/src/views/FilesList/FilesListVirtual.vue
index 735ce7d983..b81a58ea17 100644
--- a/src/views/FilesList/FilesListVirtual.vue
+++ b/src/views/FilesList/FilesListVirtual.vue
@@ -313,6 +313,48 @@ export default {
 			overflow: hidden;
 			// Take as much space as possible
 			flex: 1 1 auto;
+
+			button.files-list__row-name-link {
+				display: flex;
+				align-items: center;
+				text-align: start;
+				// Fill cell height and width
+				width: 100%;
+				height: 100%;
+				// Necessary for flex grow to work
+				min-width: 0;
+				margin: 0;
+				padding: 0;
+
+				// Already added to the inner text, see rule below
+				&:focus-visible {
+					outline: none !important;
+				}
+
+				// Keyboard indicator a11y
+				&:focus .files-list__row-name-text {
+					outline: var(--border-width-input-focused) solid var(--color-main-text) !important;
+					border-radius: var(--border-radius-element);
+				}
+				&:focus:not(:focus-visible) .files-list__row-name-text {
+					outline: none !important;
+				}
+			}
+
+			.files-list__row-name-text {
+				color: var(--color-main-text);
+				// Make some space for the outline
+				padding: var(--default-grid-baseline) calc(2 * var(--default-grid-baseline));
+				padding-inline-start: -10px;
+				// Align two name and ext
+				display: inline-flex;
+			}
+
+			.files-list__row-name-ext {
+				color: var(--color-text-maxcontrast);
+				// always show the extension
+				overflow: visible;
+			}
 		}
 
 		.files-list__row-actions {

From 34cb4c206031ff08bfe9792865a13d41492a5bc5 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Tue, 24 Sep 2024 13:11:20 -0300
Subject: [PATCH 05/48] chore: add component EntryAction

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/store/actionsmenu.js                      |  12 ++
 .../FilesList/FileEntry/FileEntryActions.vue  | 125 ++++++++++++++++++
 .../FilesList/FileEntry/FileEntryGrid.vue     |  33 ++++-
 src/views/FilesList/FilesList.vue             |   3 +-
 src/views/FilesList/FilesListVirtual.vue      |   9 +-
 src/views/FilesList/VirtualList.vue           |   7 +-
 6 files changed, 185 insertions(+), 4 deletions(-)
 create mode 100644 src/store/actionsmenu.js
 create mode 100644 src/views/FilesList/FileEntry/FileEntryActions.vue

diff --git a/src/store/actionsmenu.js b/src/store/actionsmenu.js
new file mode 100644
index 0000000000..16676167f2
--- /dev/null
+++ b/src/store/actionsmenu.js
@@ -0,0 +1,12 @@
+/**
+ * SPDX-FileCopyrightText: 2024 LibreCode coop and contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { defineStore } from 'pinia'
+
+export const useActionsMenuStore = defineStore('actionsmenu', {
+	state: () => ({
+		opened: null,
+	}),
+})
diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
new file mode 100644
index 0000000000..df92fbd66c
--- /dev/null
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -0,0 +1,125 @@
+<template>
+	<td class="files-list__row-actions">
+		<!-- Menu actions -->
+		<NcActions ref="actionsMenu"
+			:force-name="true"
+			type="tertiary"
+			:open.sync="openedMenu"
+			@close="openedSubmenu = null">
+			<!-- Default actions list-->
+			<NcActionButton v-for="action in enabledMenuActions"
+				:key="action.id"
+				:ref="`action-${action.id}`"
+				:class="{
+					[`files-list__row-action-${action.id}`]: true,
+				}"
+				:aria-label="action.title"
+				:title="action.title">
+				<template #icon>
+					<NcLoadingIcon v-if="loading === action.id" :size="18" />
+					<NcIconSvgWrapper v-else :svg="action.iconSvgInline" />
+				</template>
+				{{ action.title }}
+			</NcActionButton>
+		</NcActions>
+	</td>
+</template>
+
+<script>
+import svgFile from '@mdi/svg/svg/file.svg?raw'
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
+import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
+import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
+
+import { useActionsMenuStore } from '../../../store/actionsmenu.js'
+
+export default {
+	name: 'FileEntryActions',
+	components: {
+		NcActionButton,
+		NcActions,
+		NcIconSvgWrapper,
+		NcLoadingIcon,
+	},
+	props: {
+		opened: {
+			type: Boolean,
+			default: false,
+		},
+		source: {
+			type: Object,
+			required: true,
+		},
+		loading: {
+			type: Boolean,
+			required: true,
+		},
+	},
+	setup() {
+		const actionsMenuStore = useActionsMenuStore()
+		return { actionsMenuStore }
+	},
+	data() {
+		return {
+			openedSubmenu: null,
+			enabledMenuActions: [
+				{
+					id: 'id-teste0',
+					title: 'title 0',
+					iconSvgInline: svgFile,
+				},
+				{
+					id: 'id-teste1',
+					title: 'title 1',
+					iconSvgInline: svgFile,
+				},
+				{
+					id: 'id-teste2',
+					title: 'title 2',
+					iconSvgInline: svgFile,
+				},
+			],
+		}
+	},
+	computed: {
+		openedMenu: {
+			get() {
+				return this.actionsMenuStore.opened === this.source.nodeId
+			},
+			set(opened) {
+				this.actionsMenuStore.opened = opened ? this.source.nodeId : null
+			},
+		},
+	},
+}
+</script>
+
+<style lang="scss">
+// Allow right click to define the position of the menu
+// only if defined
+main.app-content[style*="mouse-pos-x"] .v-popper__popper {
+	transform: translate3d(var(--mouse-pos-x), var(--mouse-pos-y), 0px) !important;
+
+	// If the menu is too close to the bottom, we move it up
+	&[data-popper-placement="top"] {
+		// 34px added to align with the top of the cursor
+		transform: translate3d(var(--mouse-pos-x), calc(var(--mouse-pos-y) - 50vh + 34px), 0px) !important;
+	}
+	// Hide arrow if floating
+	.v-popper__arrow-container {
+		display: none;
+	}
+}
+</style>
+
+<style lang="scss" scoped>
+:deep(.button-vue--icon-and-text, .files-list__row-action-sharing-status) {
+	.button-vue__text {
+		color: var(--color-primary-element);
+	}
+	.button-vue__icon {
+		color: var(--color-primary-element);
+	}
+}
+</style>
diff --git a/src/views/FilesList/FileEntry/FileEntryGrid.vue b/src/views/FilesList/FileEntry/FileEntryGrid.vue
index 3f9cd6a715..1b643771c0 100644
--- a/src/views/FilesList/FileEntry/FileEntryGrid.vue
+++ b/src/views/FilesList/FileEntry/FileEntryGrid.vue
@@ -17,17 +17,30 @@
 			class="files-list__row-mtime">
 			<NcDateTime v-if="source.request_date" :timestamp="mtime" :ignore-seconds="true" />
 		</td>
+
+		<!-- Actions -->
+		<FileEntryActions ref="actions"
+			:class="`files-list__row-actions-${source.nodeId}`"
+			:opened.sync="openedMenu"
+			:source="source"
+			:loading="loading" />
 	</tr>
 </template>
 
 <script>
 import NcDateTime from '@nextcloud/vue/dist/Components/NcDateTime.js'
+
+import FileEntryActions from './FileEntryActions.vue'
 import FileEntryName from './FileEntryName.vue'
 import FileEntryPreview from './FileEntryPreview.vue'
+
+import { useActionsMenuStore } from '../../../store/actionsmenu.js'
+
 export default {
 	name: 'FileEntryGrid',
 	components: {
 		NcDateTime,
+		FileEntryActions,
 		FileEntryName,
 		FileEntryPreview,
 	},
@@ -36,11 +49,29 @@ export default {
 			type: Object,
 			required: true,
 		},
+		loading: {
+			type: Boolean,
+			required: true,
+		},
+	},
+	setup() {
+		const actionsMenuStore = useActionsMenuStore()
+		return { actionsMenuStore }
 	},
 	computed: {
 		mtime() {
 			return Date.parse(this?.source?.request_date)
 		},
+
+		openedMenu: {
+			get() {
+				return this.actionsMenuStore.opened === this.source.nodeId
+			},
+			set(opened) {
+				this.actionsMenuStore.opened = opened ? this.source.nodeId : null
+			},
+		},
+
 		mtimeOpacity() {
 			const maxOpacityTime = 31 * 24 * 60 * 60 * 1000 // 31 days
 
@@ -58,6 +89,6 @@ export default {
 				color: `color-mix(in srgb, var(--color-main-text) ${ratio}%, var(--color-text-maxcontrast))`,
 			}
 		},
-	}
+	},
 }
 </script>
diff --git a/src/views/FilesList/FilesList.vue b/src/views/FilesList/FilesList.vue
index 9dc04f48f8..5be7eaab20 100644
--- a/src/views/FilesList/FilesList.vue
+++ b/src/views/FilesList/FilesList.vue
@@ -68,7 +68,8 @@
 			</template>
 		</NcEmptyContent>
 		<FilesListVirtual v-else
-			:nodes="dirContentsSorted" />
+			:nodes="dirContentsSorted"
+			:loading="loading" />
 	</NcAppContent>
 </template>
 
diff --git a/src/views/FilesList/FilesListVirtual.vue b/src/views/FilesList/FilesListVirtual.vue
index b81a58ea17..f5df3f5792 100644
--- a/src/views/FilesList/FilesListVirtual.vue
+++ b/src/views/FilesList/FilesListVirtual.vue
@@ -1,5 +1,6 @@
 <template>
-	<VirtualList :data-component="userConfigStore.grid_view ? FileEntryGrid : FileEntry">
+	<VirtualList :data-component="userConfigStore.grid_view ? FileEntryGrid : FileEntry"
+		:loading="loading">
 		<template #filters>
 			<FileListFilters />
 		</template>
@@ -12,7 +13,9 @@
 </template>
 
 <script>
+// eslint-disable-next-line vue/no-unused-components
 import FileEntry from './FileEntry/FileEntry.vue'
+// eslint-disable-next-line vue/no-unused-components
 import FileEntryGrid from './FileEntry/FileEntryGrid.vue'
 import FileListFilters from './FileListFilters.vue'
 import FilesListTableHeader from './FilesListTableHeader.vue'
@@ -35,6 +38,10 @@ export default {
 			type: Array,
 			required: true,
 		},
+		loading: {
+			type: Boolean,
+			required: true,
+		},
 	},
 	setup() {
 		const filesStore = useFilesStore()
diff --git a/src/views/FilesList/VirtualList.vue b/src/views/FilesList/VirtualList.vue
index fddcaa33ac..e7a9a6c013 100644
--- a/src/views/FilesList/VirtualList.vue
+++ b/src/views/FilesList/VirtualList.vue
@@ -16,7 +16,8 @@
 				<component :is="dataComponent"
 					v-for="item in filesStore.files"
 					:key="item.nodeId"
-					:source="item" />
+					:source="item"
+					:loading="loading" />
 			</tbody>
 		</table>
 	</div>
@@ -33,6 +34,10 @@ export default {
 			type: [Object, Function],
 			required: true,
 		},
+		loading: {
+			type: Boolean,
+			required: true,
+		},
 	},
 	setup() {
 		const filesStore = useFilesStore()

From 1a1665e9f66266b6934932370949963506f75c35 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Wed, 25 Sep 2024 10:57:01 -0300
Subject: [PATCH 06/48] feat: trigger opened menu on right click

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 .../FilesList/FileEntry/FileEntryActions.vue  | 40 +++++++++++--------
 .../FilesList/FileEntry/FileEntryGrid.vue     | 24 ++++++++++-
 2 files changed, 46 insertions(+), 18 deletions(-)

diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index df92fbd66c..fe5f7a43ef 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -63,23 +63,7 @@ export default {
 	data() {
 		return {
 			openedSubmenu: null,
-			enabledMenuActions: [
-				{
-					id: 'id-teste0',
-					title: 'title 0',
-					iconSvgInline: svgFile,
-				},
-				{
-					id: 'id-teste1',
-					title: 'title 1',
-					iconSvgInline: svgFile,
-				},
-				{
-					id: 'id-teste2',
-					title: 'title 2',
-					iconSvgInline: svgFile,
-				},
-			],
+			enabledMenuActions: [],
 		}
 	},
 	computed: {
@@ -92,6 +76,28 @@ export default {
 			},
 		},
 	},
+	mounted() {
+		this.registerAction({
+			id: 'id-teste0',
+			title: 'Validate',
+			iconSvgInline: svgFile,
+		})
+		this.registerAction({
+			id: 'id-teste1',
+			title: 'Sign',
+			iconSvgInline: svgFile,
+		})
+		this.registerAction({
+			id: 'id-teste2',
+			title: 'Delete',
+			iconSvgInline: svgFile,
+		})
+	},
+	methods: {
+		registerAction(action) {
+			this.enabledMenuActions = [...this.enabledMenuActions, action]
+		},
+	},
 }
 </script>
 
diff --git a/src/views/FilesList/FileEntry/FileEntryGrid.vue b/src/views/FilesList/FileEntry/FileEntryGrid.vue
index 1b643771c0..8e1f3c2e2a 100644
--- a/src/views/FilesList/FileEntry/FileEntryGrid.vue
+++ b/src/views/FilesList/FileEntry/FileEntryGrid.vue
@@ -4,7 +4,9 @@
 -->
 
 <template>
-	<tr>
+	<tr
+		class="files-list__row"
+		@contextmenu="onRightClick">
 		<td class="files-list__row-name">
 			<FileEntryPreview :source="source" />
 			<FileEntryName ref="name"
@@ -90,5 +92,25 @@ export default {
 			}
 		},
 	},
+	methods: {
+		// Open the actions menu on right click
+		onRightClick(event) {
+			// If already opened, fallback to default browser
+			if (this.openedMenu) {
+				return
+			}
+
+			// Reset any right menu position potentially set
+			const root = this.$el?.closest('main.app-content')
+			root.style.removeProperty('--mouse-pos-x')
+			root.style.removeProperty('--mouse-pos-y')
+
+			this.actionsMenuStore.opened = this.source.nodeId
+
+			// Prevent any browser defaults
+			event.preventDefault()
+			event.stopPropagation()
+		},
+	}
 }
 </script>

From 5b951d2452a9d55736dbf27a9fe08c7a85a3389d Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Wed, 25 Sep 2024 11:11:40 -0300
Subject: [PATCH 07/48] chore: make FileEntry at table mode to work

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/views/FilesList/FileEntry/FileEntry.vue   | 45 ++++++++++++-
 .../FilesList/FileEntry/FileEntryGrid.vue     | 66 ++-----------------
 .../FilesList/FileEntry/FileEntryMixin.js     | 64 ++++++++++++++++++
 3 files changed, 112 insertions(+), 63 deletions(-)
 create mode 100644 src/views/FilesList/FileEntry/FileEntryMixin.js

diff --git a/src/views/FilesList/FileEntry/FileEntry.vue b/src/views/FilesList/FileEntry/FileEntry.vue
index dc93584abf..fa36861f97 100644
--- a/src/views/FilesList/FileEntry/FileEntry.vue
+++ b/src/views/FilesList/FileEntry/FileEntry.vue
@@ -4,12 +4,55 @@
 -->
 
 <template>
-	<tr />
+	<tr
+		class="files-list__row"
+		@contextmenu="onRightClick">
+		<td class="files-list__row-name">
+			<FileEntryPreview :source="source" />
+			<FileEntryName ref="name"
+				:basename="source.name"
+				:extension="'.pdf'" />
+		</td>
+
+		<!-- Mtime -->
+		<td :style="mtimeOpacity"
+			class="files-list__row-mtime">
+			<NcDateTime v-if="source.request_date" :timestamp="mtime" :ignore-seconds="true" />
+		</td>
+
+		<!-- Actions -->
+		<FileEntryActions ref="actions"
+			:class="`files-list__row-actions-${source.nodeId}`"
+			:opened.sync="openedMenu"
+			:source="source"
+			:loading="loading" />
+	</tr>
 </template>
 
 <script>
+import NcDateTime from '@nextcloud/vue/dist/Components/NcDateTime.js'
+
+import FileEntryActions from './FileEntryActions.vue'
+import FileEntryName from './FileEntryName.vue'
+import FileEntryPreview from './FileEntryPreview.vue'
+
+import { useActionsMenuStore } from '../../../store/actionsmenu.js'
+import FileEntryMixin from './FileEntryMixin.js'
 
 export default {
 	name: 'FileEntry',
+	components: {
+		NcDateTime,
+		FileEntryActions,
+		FileEntryName,
+		FileEntryPreview,
+	},
+	mixins: [
+		FileEntryMixin,
+	],
+	setup() {
+		const actionsMenuStore = useActionsMenuStore()
+		return { actionsMenuStore }
+	},
 }
 </script>
diff --git a/src/views/FilesList/FileEntry/FileEntryGrid.vue b/src/views/FilesList/FileEntry/FileEntryGrid.vue
index 8e1f3c2e2a..5fc7429bb7 100644
--- a/src/views/FilesList/FileEntry/FileEntryGrid.vue
+++ b/src/views/FilesList/FileEntry/FileEntryGrid.vue
@@ -37,6 +37,7 @@ import FileEntryName from './FileEntryName.vue'
 import FileEntryPreview from './FileEntryPreview.vue'
 
 import { useActionsMenuStore } from '../../../store/actionsmenu.js'
+import FileEntryMixin from './FileEntryMixin.js'
 
 export default {
 	name: 'FileEntryGrid',
@@ -46,71 +47,12 @@ export default {
 		FileEntryName,
 		FileEntryPreview,
 	},
-	props: {
-		source: {
-			type: Object,
-			required: true,
-		},
-		loading: {
-			type: Boolean,
-			required: true,
-		},
-	},
+	mixins: [
+		FileEntryMixin,
+	],
 	setup() {
 		const actionsMenuStore = useActionsMenuStore()
 		return { actionsMenuStore }
 	},
-	computed: {
-		mtime() {
-			return Date.parse(this?.source?.request_date)
-		},
-
-		openedMenu: {
-			get() {
-				return this.actionsMenuStore.opened === this.source.nodeId
-			},
-			set(opened) {
-				this.actionsMenuStore.opened = opened ? this.source.nodeId : null
-			},
-		},
-
-		mtimeOpacity() {
-			const maxOpacityTime = 31 * 24 * 60 * 60 * 1000 // 31 days
-
-			const mtime = this.mtime?.getTime?.()
-			if (!mtime) {
-				return {}
-			}
-
-			// 1 = today, 0 = 31 days ago
-			const ratio = Math.round(Math.min(100, 100 * (maxOpacityTime - (Date.now() - mtime)) / maxOpacityTime))
-			if (ratio < 0) {
-				return {}
-			}
-			return {
-				color: `color-mix(in srgb, var(--color-main-text) ${ratio}%, var(--color-text-maxcontrast))`,
-			}
-		},
-	},
-	methods: {
-		// Open the actions menu on right click
-		onRightClick(event) {
-			// If already opened, fallback to default browser
-			if (this.openedMenu) {
-				return
-			}
-
-			// Reset any right menu position potentially set
-			const root = this.$el?.closest('main.app-content')
-			root.style.removeProperty('--mouse-pos-x')
-			root.style.removeProperty('--mouse-pos-y')
-
-			this.actionsMenuStore.opened = this.source.nodeId
-
-			// Prevent any browser defaults
-			event.preventDefault()
-			event.stopPropagation()
-		},
-	}
 }
 </script>
diff --git a/src/views/FilesList/FileEntry/FileEntryMixin.js b/src/views/FilesList/FileEntry/FileEntryMixin.js
new file mode 100644
index 0000000000..2a938b6ae9
--- /dev/null
+++ b/src/views/FilesList/FileEntry/FileEntryMixin.js
@@ -0,0 +1,64 @@
+export default {
+	props: {
+		source: {
+			type: Object,
+			required: true,
+		},
+		loading: {
+			type: Boolean,
+			required: true,
+		},
+	},
+	computed: {
+		mtime() {
+			return Date.parse(this?.source?.request_date)
+		},
+
+		openedMenu: {
+			get() {
+				return this.actionsMenuStore.opened === this.source.nodeId
+			},
+			set(opened) {
+				this.actionsMenuStore.opened = opened ? this.source.nodeId : null
+			},
+		},
+
+		mtimeOpacity() {
+			const maxOpacityTime = 31 * 24 * 60 * 60 * 1000 // 31 days
+
+			const mtime = this.mtime?.getTime?.()
+			if (!mtime) {
+				return {}
+			}
+
+			// 1 = today, 0 = 31 days ago
+			const ratio = Math.round(Math.min(100, 100 * (maxOpacityTime - (Date.now() - mtime)) / maxOpacityTime))
+			if (ratio < 0) {
+				return {}
+			}
+			return {
+				color: `color-mix(in srgb, var(--color-main-text) ${ratio}%, var(--color-text-maxcontrast))`,
+			}
+		},
+	},
+	methods: {
+		// Open the actions menu on right click
+		onRightClick(event) {
+			// If already opened, fallback to default browser
+			if (this.openedMenu) {
+				return
+			}
+
+			// Reset any right menu position potentially set
+			const root = this.$el?.closest('main.app-content')
+			root.style.removeProperty('--mouse-pos-x')
+			root.style.removeProperty('--mouse-pos-y')
+
+			this.actionsMenuStore.opened = this.source.nodeId
+
+			// Prevent any browser defaults
+			event.preventDefault()
+			event.stopPropagation()
+		},
+	},
+}

From d351026055c06dd356c043e42f1811a09df149ef Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Wed, 25 Sep 2024 11:30:44 -0300
Subject: [PATCH 08/48] chore: remove checkbox

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/views/FilesList/FilesListTableHeader.vue | 10 ++--------
 1 file changed, 2 insertions(+), 8 deletions(-)

diff --git a/src/views/FilesList/FilesListTableHeader.vue b/src/views/FilesList/FilesListTableHeader.vue
index e1d109bf64..32d8ea8a3c 100644
--- a/src/views/FilesList/FilesListTableHeader.vue
+++ b/src/views/FilesList/FilesListTableHeader.vue
@@ -4,14 +4,11 @@
 -->
 <template>
 	<tr class="files-list__row-head">
-		<th class="files-list__column files-list__row-checkbox">
-			<NcCheckboxRadioSwitch />
-		</th>
-
 		<!-- Columns display -->
 
 		<!-- Link to file -->
-		<th class="files-list__column files-list__row-name files-list__column--sortable">
+		<th class="files-list__column files-list__row-name files-list__column--sortable"
+			:aria-sort="ariaSortForMode('basename')">
 			<!-- Icon or preview -->
 			<span class="files-list__row-icon" />
 
@@ -36,8 +33,6 @@
 </template>
 
 <script>
-import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
-
 import FilesListTableHeaderButton from './FilesListTableHeaderButton.vue'
 
 export default {
@@ -45,7 +40,6 @@ export default {
 
 	components: {
 		FilesListTableHeaderButton,
-		NcCheckboxRadioSwitch,
 	},
 
 	props: {

From abf9f180549e89f32a006a4f64ecbda36aab2bdf Mon Sep 17 00:00:00 2001
From: Victor Bianchi <vbianchi@protonmail.com>
Date: Wed, 25 Sep 2024 14:18:04 -0300
Subject: [PATCH 09/48] fix: header sorting arrow icon

Signed-off-by: Victor Bianchi <vbianchi@protonmail.com>
---
 src/store/filesSorting.js                     | 32 +++++++++++++++++++
 src/views/FilesList/FileEntry/FileEntry.vue   |  5 ++-
 .../FilesList/FileEntry/FileEntryActions.vue  |  1 +
 .../FilesList/FileEntry/FileEntryGrid.vue     |  5 ++-
 .../FilesList/FilesListTableHeaderButton.vue  | 20 ++++++++++--
 5 files changed, 54 insertions(+), 9 deletions(-)
 create mode 100644 src/store/filesSorting.js

diff --git a/src/store/filesSorting.js b/src/store/filesSorting.js
new file mode 100644
index 0000000000..05549f7b8c
--- /dev/null
+++ b/src/store/filesSorting.js
@@ -0,0 +1,32 @@
+/**
+ * SPDX-FileCopyrightText: 2024 LibreCode coop and contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { defineStore } from 'pinia'
+
+const DEFAULT_SORTING_DIRECTION = 'asc'
+
+export const useFilesSortingStore = defineStore('filesSorting', {
+	state: () => ({
+		sortingMode: 'basename',
+		sortingDirection: DEFAULT_SORTING_DIRECTION,
+	}),
+
+	actions: {
+		toggleSortingDirection() {
+			this.sortingDirection = this.sortingDirection === 'asc' ? 'desc' : 'asc'
+		},
+
+		toggleSortBy(key) {
+			// If we're already sorting by this key, flip the direction
+			if (this.sortingMode === key) {
+				this.toggleSortingDirection()
+				return
+			}
+			// else sort ASC by this new key
+			this.sortingMode = key
+			this.sortingDirection = DEFAULT_SORTING_DIRECTION
+		},
+	},
+})
diff --git a/src/views/FilesList/FileEntry/FileEntry.vue b/src/views/FilesList/FileEntry/FileEntry.vue
index fa36861f97..9ef7d49d3b 100644
--- a/src/views/FilesList/FileEntry/FileEntry.vue
+++ b/src/views/FilesList/FileEntry/FileEntry.vue
@@ -4,8 +4,7 @@
 -->
 
 <template>
-	<tr
-		class="files-list__row"
+	<tr class="files-list__row"
 		@contextmenu="onRightClick">
 		<td class="files-list__row-name">
 			<FileEntryPreview :source="source" />
@@ -36,8 +35,8 @@ import FileEntryActions from './FileEntryActions.vue'
 import FileEntryName from './FileEntryName.vue'
 import FileEntryPreview from './FileEntryPreview.vue'
 
-import { useActionsMenuStore } from '../../../store/actionsmenu.js'
 import FileEntryMixin from './FileEntryMixin.js'
+import { useActionsMenuStore } from '../../../store/actionsmenu.js'
 
 export default {
 	name: 'FileEntry',
diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index fe5f7a43ef..a9724e5ebd 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -27,6 +27,7 @@
 
 <script>
 import svgFile from '@mdi/svg/svg/file.svg?raw'
+
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
diff --git a/src/views/FilesList/FileEntry/FileEntryGrid.vue b/src/views/FilesList/FileEntry/FileEntryGrid.vue
index 5fc7429bb7..3d70e5fb6e 100644
--- a/src/views/FilesList/FileEntry/FileEntryGrid.vue
+++ b/src/views/FilesList/FileEntry/FileEntryGrid.vue
@@ -4,8 +4,7 @@
 -->
 
 <template>
-	<tr
-		class="files-list__row"
+	<tr class="files-list__row"
 		@contextmenu="onRightClick">
 		<td class="files-list__row-name">
 			<FileEntryPreview :source="source" />
@@ -36,8 +35,8 @@ import FileEntryActions from './FileEntryActions.vue'
 import FileEntryName from './FileEntryName.vue'
 import FileEntryPreview from './FileEntryPreview.vue'
 
-import { useActionsMenuStore } from '../../../store/actionsmenu.js'
 import FileEntryMixin from './FileEntryMixin.js'
+import { useActionsMenuStore } from '../../../store/actionsmenu.js'
 
 export default {
 	name: 'FileEntryGrid',
diff --git a/src/views/FilesList/FilesListTableHeaderButton.vue b/src/views/FilesList/FilesListTableHeaderButton.vue
index 982d41617d..66f0e3c9da 100644
--- a/src/views/FilesList/FilesListTableHeaderButton.vue
+++ b/src/views/FilesList/FilesListTableHeaderButton.vue
@@ -3,10 +3,15 @@
   - SPDX-License-Identifier: AGPL-3.0-or-later
 -->
 <template>
-	<NcButton :alignment="mode === 'size' ? 'end' : 'start-reverse'"
-		type="tertiary">
+	<NcButton :class="['files-list__column-sort-button', {
+			'files-list__column-sort-button--active': filesSortingStore.sortingMode === mode,
+			'files-list__column-sort-button--size': filesSortingStore.sortingMode === 'size',
+		}]"
+		:alignment="mode === 'size' ? 'end' : 'start-reverse'"
+		type="tertiary"
+		@click="filesSortingStore.toggleSortBy(mode)">
 		<template #icon>
-			<MenuUp v-if="true" class="files-list__column-sort-button-icon" />
+			<MenuUp v-if="filesSortingStore.sortingMode !== mode || filesSortingStore.sortingDirection === 'asc'" class="files-list__column-sort-button-icon" />
 			<MenuDown v-else class="files-list__column-sort-button-icon" />
 		</template>
 		<span class="files-list__column-sort-button-text">{{ name }}</span>
@@ -20,6 +25,8 @@ import MenuUp from 'vue-material-design-icons/MenuUp.vue'
 
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 
+import { useFilesSortingStore } from '../../store/filesSorting.js'
+
 export default {
 	name: 'FilesListTableHeaderButton',
 
@@ -39,6 +46,13 @@ export default {
 			required: true,
 		},
 	},
+
+	setup() {
+		const filesSortingStore = useFilesSortingStore()
+		return {
+			filesSortingStore,
+		}
+	},
 }
 </script>
 

From 5e613a26e8c9a0e0ddf9d59f4a3c723af0e065a4 Mon Sep 17 00:00:00 2001
From: Victor Bianchi <vbianchi@protonmail.com>
Date: Wed, 25 Sep 2024 18:09:04 -0300
Subject: [PATCH 10/48] feat: add status dot to file entry component

Signed-off-by: Victor Bianchi <vbianchi@protonmail.com>
---
 src/views/FilesList/FileEntry/FileEntry.vue   |  8 ++
 .../FilesList/FileEntry/FileEntryGrid.vue     |  8 ++
 .../FilesList/FileEntry/FileEntryStatus.vue   | 79 +++++++++++++++++++
 src/views/FilesList/FilesListVirtual.vue      | 31 ++++++++
 4 files changed, 126 insertions(+)
 create mode 100644 src/views/FilesList/FileEntry/FileEntryStatus.vue

diff --git a/src/views/FilesList/FileEntry/FileEntry.vue b/src/views/FilesList/FileEntry/FileEntry.vue
index 9ef7d49d3b..bd60d37cd6 100644
--- a/src/views/FilesList/FileEntry/FileEntry.vue
+++ b/src/views/FilesList/FileEntry/FileEntry.vue
@@ -13,6 +13,12 @@
 				:extension="'.pdf'" />
 		</td>
 
+		<!-- Status -->
+		<td class="files-list__row-status">
+			<FileEntryStatus :status="source.status"
+				:status-text="source.statusText" />
+		</td>
+
 		<!-- Mtime -->
 		<td :style="mtimeOpacity"
 			class="files-list__row-mtime">
@@ -34,6 +40,7 @@ import NcDateTime from '@nextcloud/vue/dist/Components/NcDateTime.js'
 import FileEntryActions from './FileEntryActions.vue'
 import FileEntryName from './FileEntryName.vue'
 import FileEntryPreview from './FileEntryPreview.vue'
+import FileEntryStatus from './FileEntryStatus.vue'
 
 import FileEntryMixin from './FileEntryMixin.js'
 import { useActionsMenuStore } from '../../../store/actionsmenu.js'
@@ -45,6 +52,7 @@ export default {
 		FileEntryActions,
 		FileEntryName,
 		FileEntryPreview,
+		FileEntryStatus,
 	},
 	mixins: [
 		FileEntryMixin,
diff --git a/src/views/FilesList/FileEntry/FileEntryGrid.vue b/src/views/FilesList/FileEntry/FileEntryGrid.vue
index 3d70e5fb6e..95acab9cd3 100644
--- a/src/views/FilesList/FileEntry/FileEntryGrid.vue
+++ b/src/views/FilesList/FileEntry/FileEntryGrid.vue
@@ -13,6 +13,12 @@
 				:extension="'.pdf'" />
 		</td>
 
+		<!-- Status -->
+		<td class="files-list__row-status">
+			<FileEntryStatus :status="source.status"
+				:status-text="source.statusText" />
+		</td>
+
 		<!-- Mtime -->
 		<td :style="mtimeOpacity"
 			class="files-list__row-mtime">
@@ -34,6 +40,7 @@ import NcDateTime from '@nextcloud/vue/dist/Components/NcDateTime.js'
 import FileEntryActions from './FileEntryActions.vue'
 import FileEntryName from './FileEntryName.vue'
 import FileEntryPreview from './FileEntryPreview.vue'
+import FileEntryStatus from './FileEntryStatus.vue'
 
 import FileEntryMixin from './FileEntryMixin.js'
 import { useActionsMenuStore } from '../../../store/actionsmenu.js'
@@ -45,6 +52,7 @@ export default {
 		FileEntryActions,
 		FileEntryName,
 		FileEntryPreview,
+		FileEntryStatus,
 	},
 	mixins: [
 		FileEntryMixin,
diff --git a/src/views/FilesList/FileEntry/FileEntryStatus.vue b/src/views/FilesList/FileEntry/FileEntryStatus.vue
new file mode 100644
index 0000000000..431ae56120
--- /dev/null
+++ b/src/views/FilesList/FileEntry/FileEntryStatus.vue
@@ -0,0 +1,79 @@
+<template>
+	<div class="enDot">
+		<div :class="statusText !== 'none' ? 'dot ' + statusToClass(status) : '' "
+			:title="statusText !== 'none' ? statusText : ''" />
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'FileEntryStatus',
+	props: {
+		statusText: {
+			type: String,
+			required: true,
+		},
+		status: {
+			type: Number,
+			required: true,
+		},
+	},
+	methods: {
+		statusToClass(status) {
+			switch (Number(status)) {
+			case 0:
+				return 'no-signers'
+			case 1:
+			case 2:
+				return 'pending'
+			case 3:
+				return 'signed'
+			default:
+				return ''
+			}
+		},
+	},
+}
+</script>
+
+<style lang="scss" scoped>
+.enDot{
+	--dot-size: 10px;
+
+	display: flex;
+	flex-direction: row;
+	align-content: center;
+	margin: 5px;
+	max-width: 100%;
+	align-items: center;
+	justify-content: center;
+	cursor: inherit;
+
+	.dot{
+		flex: 1 0 var(--dot-size);
+		height: var(--dot-size);
+		border-radius: 50%;
+		margin-right: 10px;
+		cursor: inherit;
+	}
+
+	.signed{
+		background: #008000;
+	}
+
+	.no-signers{
+		background: #ff0000;
+	}
+
+	.pending {
+		background: #d67335
+	}
+
+	span{
+		font-size: 14px;
+		font-weight: normal;
+		text-align: center;
+		cursor: inherit;
+	}
+}
+</style>
diff --git a/src/views/FilesList/FilesListVirtual.vue b/src/views/FilesList/FilesListVirtual.vue
index f5df3f5792..93845845ab 100644
--- a/src/views/FilesList/FilesListVirtual.vue
+++ b/src/views/FilesList/FilesListVirtual.vue
@@ -382,12 +382,34 @@ export default {
 			}
 		}
 
+		.files-list__row-mtime,
+		.files-list__row-status {
+			color: var(--color-text-maxcontrast);
+		}
+		.files-list__row-status {
+			width: calc(var(--row-height) * 1.5);
+			// Right align content/text
+			justify-content: flex-end;
+		}
+
+		.files-list__row-mtime {
+			width: calc(var(--row-height) * 2);
+		}
+
 		.files-list__row-column-custom {
 			width: calc(var(--row-height) * 2);
 		}
 	}
 
 }
+
+@media screen and (max-width: 512px) {
+	.files-list :deep(.files-list__filters) {
+		// Reduce padding on mobile
+		padding-inline: var(--default-grid-baseline, 4px);
+	}
+}
+
 </style>
 
 <style lang="scss">
@@ -411,6 +433,7 @@ tbody.files-list__tbody.files-list__tbody--grid {
 	justify-items: center;
 
 	tr {
+		position: relative;
 		display: flex;
 		flex-direction: column;
 		width: var(--row-width);
@@ -477,6 +500,14 @@ tbody.files-list__tbody.files-list__tbody--grid {
 		}
 	}
 
+	.files-list__row-status {
+		position: absolute;
+		top: var(--item-padding);
+		inset-inline-end: var(--item-padding);
+		width: var(--clickable-area);
+		height: var(--clickable-area);
+	}
+
 	.files-list__row-mtime {
 		width: var(--icon-preview-size);
 		height: var(--mtime-height);

From 3d8d93f9f384ee89f3c38fd3fcd1b06ad01d8745 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Wed, 25 Sep 2024 18:12:35 -0300
Subject: [PATCH 11/48] fix: linter

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/views/FilesList/FilesListVirtual.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/FilesList/FilesListVirtual.vue b/src/views/FilesList/FilesListVirtual.vue
index 93845845ab..e4a53adb31 100644
--- a/src/views/FilesList/FilesListVirtual.vue
+++ b/src/views/FilesList/FilesListVirtual.vue
@@ -13,9 +13,7 @@
 </template>
 
 <script>
-// eslint-disable-next-line vue/no-unused-components
 import FileEntry from './FileEntry/FileEntry.vue'
-// eslint-disable-next-line vue/no-unused-components
 import FileEntryGrid from './FileEntry/FileEntryGrid.vue'
 import FileListFilters from './FileListFilters.vue'
 import FilesListTableHeader from './FilesListTableHeader.vue'
@@ -30,7 +28,9 @@ export default {
 		VirtualList,
 		FileListFilters,
 		FilesListTableHeader,
+		// eslint-disable-next-line vue/no-unused-components
 		FileEntry,
+		// eslint-disable-next-line vue/no-unused-components
 		FileEntryGrid,
 	},
 	props: {

From 3c325bf057e0ecfdf9886c16bf4f6f539d7e3685 Mon Sep 17 00:00:00 2001
From: Victor Bianchi <vbianchi@protonmail.com>
Date: Thu, 26 Sep 2024 11:17:33 -0300
Subject: [PATCH 12/48] feat: open file details side bar

Signed-off-by: Victor Bianchi <vbianchi@protonmail.com>
---
 src/views/FilesList/FileEntry/FileEntry.vue     | 16 ++++++++++++----
 src/views/FilesList/FileEntry/FileEntryGrid.vue | 16 ++++++++++++----
 src/views/FilesList/FileEntry/FileEntryMixin.js |  6 ++++++
 3 files changed, 30 insertions(+), 8 deletions(-)

diff --git a/src/views/FilesList/FileEntry/FileEntry.vue b/src/views/FilesList/FileEntry/FileEntry.vue
index bd60d37cd6..540c9b7b89 100644
--- a/src/views/FilesList/FileEntry/FileEntry.vue
+++ b/src/views/FilesList/FileEntry/FileEntry.vue
@@ -6,7 +6,8 @@
 <template>
 	<tr class="files-list__row"
 		@contextmenu="onRightClick">
-		<td class="files-list__row-name">
+		<td class="files-list__row-name"
+			@click="openDetailsIfAvailable">
 			<FileEntryPreview :source="source" />
 			<FileEntryName ref="name"
 				:basename="source.name"
@@ -14,14 +15,16 @@
 		</td>
 
 		<!-- Status -->
-		<td class="files-list__row-status">
+		<td class="files-list__row-status"
+			@click="openDetailsIfAvailable">
 			<FileEntryStatus :status="source.status"
 				:status-text="source.statusText" />
 		</td>
 
 		<!-- Mtime -->
 		<td :style="mtimeOpacity"
-			class="files-list__row-mtime">
+			class="files-list__row-mtime"
+			@click="openDetailsIfAvailable">
 			<NcDateTime v-if="source.request_date" :timestamp="mtime" :ignore-seconds="true" />
 		</td>
 
@@ -44,6 +47,7 @@ import FileEntryStatus from './FileEntryStatus.vue'
 
 import FileEntryMixin from './FileEntryMixin.js'
 import { useActionsMenuStore } from '../../../store/actionsmenu.js'
+import { useFilesStore } from '../../../store/files.js'
 
 export default {
 	name: 'FileEntry',
@@ -59,7 +63,11 @@ export default {
 	],
 	setup() {
 		const actionsMenuStore = useActionsMenuStore()
-		return { actionsMenuStore }
+		const filesStore = useFilesStore()
+		return {
+			actionsMenuStore,
+			filesStore,
+		}
 	},
 }
 </script>
diff --git a/src/views/FilesList/FileEntry/FileEntryGrid.vue b/src/views/FilesList/FileEntry/FileEntryGrid.vue
index 95acab9cd3..951f4e2b61 100644
--- a/src/views/FilesList/FileEntry/FileEntryGrid.vue
+++ b/src/views/FilesList/FileEntry/FileEntryGrid.vue
@@ -6,7 +6,8 @@
 <template>
 	<tr class="files-list__row"
 		@contextmenu="onRightClick">
-		<td class="files-list__row-name">
+		<td class="files-list__row-name"
+			@click="openDetailsIfAvailable">
 			<FileEntryPreview :source="source" />
 			<FileEntryName ref="name"
 				:basename="source.name"
@@ -14,14 +15,16 @@
 		</td>
 
 		<!-- Status -->
-		<td class="files-list__row-status">
+		<td class="files-list__row-status"
+			@click="openDetailsIfAvailable">
 			<FileEntryStatus :status="source.status"
 				:status-text="source.statusText" />
 		</td>
 
 		<!-- Mtime -->
 		<td :style="mtimeOpacity"
-			class="files-list__row-mtime">
+			class="files-list__row-mtime"
+			@click="openDetailsIfAvailable">
 			<NcDateTime v-if="source.request_date" :timestamp="mtime" :ignore-seconds="true" />
 		</td>
 
@@ -44,6 +47,7 @@ import FileEntryStatus from './FileEntryStatus.vue'
 
 import FileEntryMixin from './FileEntryMixin.js'
 import { useActionsMenuStore } from '../../../store/actionsmenu.js'
+import { useFilesStore } from '../../../store/files.js'
 
 export default {
 	name: 'FileEntryGrid',
@@ -59,7 +63,11 @@ export default {
 	],
 	setup() {
 		const actionsMenuStore = useActionsMenuStore()
-		return { actionsMenuStore }
+		const filesStore = useFilesStore()
+		return {
+			actionsMenuStore,
+			filesStore,
+		}
 	},
 }
 </script>
diff --git a/src/views/FilesList/FileEntry/FileEntryMixin.js b/src/views/FilesList/FileEntry/FileEntryMixin.js
index 2a938b6ae9..5eb1f78272 100644
--- a/src/views/FilesList/FileEntry/FileEntryMixin.js
+++ b/src/views/FilesList/FileEntry/FileEntryMixin.js
@@ -60,5 +60,11 @@ export default {
 			event.preventDefault()
 			event.stopPropagation()
 		},
+
+		openDetailsIfAvailable(event) {
+			event.preventDefault()
+			event.stopPropagation()
+			this.filesStore.selectFile(this.source.nodeId)
+		},
 	},
 }

From 1102bd481b9627087c30bd3aaebff17b606ba421 Mon Sep 17 00:00:00 2001
From: Victor Bianchi <vbianchi@protonmail.com>
Date: Thu, 26 Sep 2024 14:46:01 -0300
Subject: [PATCH 13/48] feat: implement file filtering logic WIP

Signed-off-by: Victor Bianchi <vbianchi@protonmail.com>
---
 src/store/files.js                            | 344 +++++++++---------
 src/store/filesSorting.js                     |   3 +
 src/store/filters.js                          |   3 +-
 .../FileListFilter/FileListFilterModified.vue |  10 +
 4 files changed, 196 insertions(+), 164 deletions(-)

diff --git a/src/store/files.js b/src/store/files.js
index b5ee266762..affa56fb66 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -4,6 +4,7 @@
  */
 
 import { defineStore } from 'pinia'
+import { subscribe } from '@nextcloud/event-bus'
 import { set } from 'vue'
 
 import axios from '@nextcloud/axios'
@@ -12,174 +13,191 @@ import { generateOcsUrl } from '@nextcloud/router'
 
 import { useSidebarStore } from './sidebar.js'
 import { useSignStore } from './sign.js'
+import { useFiltersStore } from './filters.js'
+import { useFilesSortingStore } from './filesSorting.js'
 
-export const useFilesStore = defineStore('files', {
-	state: () => {
-		return {
-			files: {},
-			selectedNodeId: 0,
-			identifyingSigner: false,
-			loading: false,
-			filterActive: 'all',
-		}
-	},
-
-	actions: {
-		addFile(file) {
-			set(this.files, file.nodeId, file)
-			this.hydrateFile(file.nodeId)
-		},
-		selectFile(nodeId) {
-			this.selectedNodeId = nodeId ?? 0
-			if (this.selectedNodeId === 0) {
-				const signStore = useSignStore()
-				signStore.reset()
-				return
-			}
-			const sidebarStore = useSidebarStore()
-			sidebarStore.activeRequestSignatureTab()
-		},
-		getFile() {
-			return this.files[this.selectedNodeId] ?? {}
-		},
-		async flushSelectedFile() {
-			const files = await this.getAllFiles({
-				nodeId: this.selectedNodeId,
-			})
-			this.addFile(files[this.selectedNodeId])
-		},
-		enableIdentifySigner() {
-			this.identifyingSigner = true
-		},
-		disableIdentifySigner() {
-			this.identifyingSigner = false
-		},
-		hasSigners() {
-			if (this.selectedNodeId === 0) {
-				return false
-			}
-			if (!Object.hasOwn(this.getFile(), 'signers')) {
-				return false
-			}
-			return this.files[this.selectedNodeId].signers.length > 0
-		},
-		isPartialSigned() {
-			if (this.selectedNodeId === 0) {
-				return false
-			}
-			if (!Object.hasOwn(this.getFile(), 'signers')) {
-				return false
-			}
-			return this.files[this.selectedNodeId].signers
-				.filter(signer => signer.signed?.length > 0).length > 0
-		},
-		isFullSigned() {
-			if (this.selectedNodeId === 0) {
-				return false
+export const useFilesStore = function(...args) {
+	const store = defineStore('files', {
+		state: () => {
+			return {
+				files: {},
+				selectedNodeId: 0,
+				identifyingSigner: false,
+				loading: false,
+				filterActive: 'all',
 			}
-			if (!Object.hasOwn(this.getFile(), 'signers')) {
-				return false
-			}
-			return this.files[this.selectedNodeId].signers.length > 0
-				&& this.files[this.selectedNodeId].signers
-					.filter(signer => signer.signed?.length > 0).length === this.files[this.selectedNodeId].signers.length
-		},
-		getSubtitle() {
-			if (this.selectedNodeId === 0) {
-				return ''
-			}
-			const file = this.files[this.selectedNodeId]
-			if ((file?.requested_by?.userId ?? '').length === 0 || file?.request_date.length === 0) {
-				return ''
-			}
-			return t('libresign', 'Requested by {name}, at {date}', {
-				name: file.requested_by.userId,
-				date: Moment(Date.parse(file.request_date)).format('LL LTS'),
-			})
 		},
-		async hydrateFile(nodeId) {
-			if (Object.hasOwn(this.files[nodeId], 'uuid')) {
-				return
-			}
-			await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/validate/file_id/{fileId}', {
-				fileId: nodeId,
-			}))
-				.then((response) => {
-					set(this.files, nodeId, response.data.ocs.data)
-					this.addUniqueIdentifierToAllSigners(this.files[nodeId].signers)
+
+		actions: {
+			addFile(file) {
+				set(this.files, file.nodeId, file)
+				this.hydrateFile(file.nodeId)
+			},
+			selectFile(nodeId) {
+				this.selectedNodeId = nodeId ?? 0
+				if (this.selectedNodeId === 0) {
+					const signStore = useSignStore()
+					signStore.reset()
+					return
+				}
+				const sidebarStore = useSidebarStore()
+				sidebarStore.activeRequestSignatureTab()
+			},
+			getFile() {
+				return this.files[this.selectedNodeId] ?? {}
+			},
+			async flushSelectedFile() {
+				const files = await this.getAllFiles({
+					nodeId: this.selectedNodeId,
 				})
-				.catch(() => {
-					set(this.files[nodeId], 'signers', [])
+				this.addFile(files[this.selectedNodeId])
+			},
+			enableIdentifySigner() {
+				this.identifyingSigner = true
+			},
+			disableIdentifySigner() {
+				this.identifyingSigner = false
+			},
+			hasSigners() {
+				if (this.selectedNodeId === 0) {
+					return false
+				}
+				if (!Object.hasOwn(this.getFile(), 'signers')) {
+					return false
+				}
+				return this.files[this.selectedNodeId].signers.length > 0
+			},
+			isPartialSigned() {
+				if (this.selectedNodeId === 0) {
+					return false
+				}
+				if (!Object.hasOwn(this.getFile(), 'signers')) {
+					return false
+				}
+				return this.files[this.selectedNodeId].signers
+					.filter(signer => signer.signed?.length > 0).length > 0
+			},
+			isFullSigned() {
+				if (this.selectedNodeId === 0) {
+					return false
+				}
+				if (!Object.hasOwn(this.getFile(), 'signers')) {
+					return false
+				}
+				return this.files[this.selectedNodeId].signers.length > 0
+					&& this.files[this.selectedNodeId].signers
+						.filter(signer => signer.signed?.length > 0).length === this.files[this.selectedNodeId].signers.length
+			},
+			getSubtitle() {
+				if (this.selectedNodeId === 0) {
+					return ''
+				}
+				const file = this.files[this.selectedNodeId]
+				if ((file?.requested_by?.userId ?? '').length === 0 || file?.request_date.length === 0) {
+					return ''
+				}
+				return t('libresign', 'Requested by {name}, at {date}', {
+					name: file.requested_by.userId,
+					date: Moment(Date.parse(file.request_date)).format('LL LTS'),
 				})
-		},
-		addUniqueIdentifierToAllSigners(signers) {
-			if (signers === undefined) {
-				return
-			}
-			signers.map(signer => this.addIdentifierToSigner(signer))
-		},
-		addIdentifierToSigner(signer) {
-			// generate unique code to new signer to be possible delete or edit
-			if ((signer.identify === undefined || signer.identify === '') && signer.signRequestId === undefined) {
-				signer.identify = btoa(JSON.stringify(signer))
-			}
-			if (signer.signRequestId) {
-				signer.identify = signer.signRequestId
-			}
-		},
-		signerUpdate(signer) {
-			this.addIdentifierToSigner(signer)
-			// Remove if already exists
-			for (let i = this.files[this.selectedNodeId].signers.length - 1; i >= 0; i--) {
-				if (this.files[this.selectedNodeId].signers[i].identify === signer.identify) {
-					this.files[this.selectedNodeId].signers.splice(i, 1)
-					break
-				}
-				if (this.files[this.selectedNodeId].signers[i].signRequestId === signer.identify) {
-					this.files[this.selectedNodeId].signers.splice(i, 1)
-					break
+			},
+			async hydrateFile(nodeId) {
+				if (Object.hasOwn(this.files[nodeId], 'uuid')) {
+					return
 				}
-			}
-			this.files[this.selectedNodeId].signers.push(signer)
-		},
-		async deleteSigner(signer) {
-			if (!isNaN(signer.signRequestId)) {
-				await axios.delete(generateOcsUrl('/apps/libresign/api/{apiVersion}/sign/file_id/{fileId}/{signRequestId}', {
-					apiVersion: 'v1',
-					fileId: this.selectedNodeId,
-					signRequestId: signer.signRequestId,
+				await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/validate/file_id/{fileId}', {
+					fileId: nodeId,
 				}))
-			}
-			set(
-				this.files[this.selectedNodeId],
-				'signers',
-				this.files[this.selectedNodeId].signers.filter((i) => i.identify !== signer.identify),
-			)
-		},
-		async getAllFiles(filter) {
-			const response = await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: filter })
-			this.files = {}
-			response.data.ocs.data.data.forEach(file => {
-				this.addFile(file)
-			})
-			return this.files
-		},
-		filter(type) {
-			this.filterActive = type
-			if (type === 'pending') {
-				return Object.values(this.files).filter(
-					(a) => (a.status === 1 || a.status === 2)).sort(
-					(a, b) => (a.request_date < b.request_date) ? 1 : -1)
-			}
-			if (type === 'signed') {
-				return Object.values(this.files).filter(
-					(a) => (a.status === 3)).sort(
-					(a, b) => (a.request_date < b.request_date) ? 1 : -1)
-			}
-			if (type === 'all') {
-				this.filterActive = 'all'
-				return Object.values(this.files).sort((a, b) => (a.request_date < b.request_date) ? 1 : -1)
-			}
+					.then((response) => {
+						set(this.files, nodeId, response.data.ocs.data)
+						this.addUniqueIdentifierToAllSigners(this.files[nodeId].signers)
+					})
+					.catch(() => {
+						set(this.files[nodeId], 'signers', [])
+					})
+			},
+			addUniqueIdentifierToAllSigners(signers) {
+				if (signers === undefined) {
+					return
+				}
+				signers.map(signer => this.addIdentifierToSigner(signer))
+			},
+			addIdentifierToSigner(signer) {
+				// generate unique code to new signer to be possible delete or edit
+				if ((signer.identify === undefined || signer.identify === '') && signer.signRequestId === undefined) {
+					signer.identify = btoa(JSON.stringify(signer))
+				}
+				if (signer.signRequestId) {
+					signer.identify = signer.signRequestId
+				}
+			},
+			signerUpdate(signer) {
+				this.addIdentifierToSigner(signer)
+				// Remove if already exists
+				for (let i = this.files[this.selectedNodeId].signers.length - 1; i >= 0; i--) {
+					if (this.files[this.selectedNodeId].signers[i].identify === signer.identify) {
+						this.files[this.selectedNodeId].signers.splice(i, 1)
+						break
+					}
+					if (this.files[this.selectedNodeId].signers[i].signRequestId === signer.identify) {
+						this.files[this.selectedNodeId].signers.splice(i, 1)
+						break
+					}
+				}
+				this.files[this.selectedNodeId].signers.push(signer)
+			},
+			async deleteSigner(signer) {
+				if (!isNaN(signer.signRequestId)) {
+					await axios.delete(generateOcsUrl('/apps/libresign/api/{apiVersion}/sign/file_id/{fileId}/{signRequestId}', {
+						apiVersion: 'v1',
+						fileId: this.selectedNodeId,
+						signRequestId: signer.signRequestId,
+					}))
+				}
+				set(
+					this.files[this.selectedNodeId],
+					'signers',
+					this.files[this.selectedNodeId].signers.filter((i) => i.identify !== signer.identify),
+				)
+			},
+			async getAllFiles(filter) {
+				const { chips } = useFiltersStore()
+				const { sortingMode, sortingDirection } = useFilesSortingStore()
+				const response = await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: filter })
+				this.files = {}
+				response.data.ocs.data.data.forEach(file => {
+					this.addFile(file)
+				})
+				return this.files
+			},
+			filter(type) {
+				this.filterActive = type
+				if (type === 'pending') {
+					return Object.values(this.files).filter(
+						(a) => (a.status === 1 || a.status === 2)).sort(
+						(a, b) => (a.request_date < b.request_date) ? 1 : -1)
+				}
+				if (type === 'signed') {
+					return Object.values(this.files).filter(
+						(a) => (a.status === 3)).sort(
+						(a, b) => (a.request_date < b.request_date) ? 1 : -1)
+				}
+				if (type === 'all') {
+					this.filterActive = 'all'
+					return Object.values(this.files).sort((a, b) => (a.request_date < b.request_date) ? 1 : -1)
+				}
+			},
 		},
-	},
-})
+	})
+
+	const filesStore = store(...args)
+
+	// Make sure we only register the listeners once
+	if (!filesStore._initialized) {
+		subscribe('libresign:filters:update', filesStore.getAllFiles)
+		subscribe('libresign:sorting:update', filesStore.getAllFiles)
+		filesStore._initialized = true
+	}
+
+	return filesStore
+}
diff --git a/src/store/filesSorting.js b/src/store/filesSorting.js
index 05549f7b8c..226dd5bb29 100644
--- a/src/store/filesSorting.js
+++ b/src/store/filesSorting.js
@@ -3,6 +3,7 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
+import { emit } from '@nextcloud/event-bus'
 import { defineStore } from 'pinia'
 
 const DEFAULT_SORTING_DIRECTION = 'asc'
@@ -16,6 +17,7 @@ export const useFilesSortingStore = defineStore('filesSorting', {
 	actions: {
 		toggleSortingDirection() {
 			this.sortingDirection = this.sortingDirection === 'asc' ? 'desc' : 'asc'
+			emit('libresign:sorting:update')
 		},
 
 		toggleSortBy(key) {
@@ -27,6 +29,7 @@ export const useFilesSortingStore = defineStore('filesSorting', {
 			// else sort ASC by this new key
 			this.sortingMode = key
 			this.sortingDirection = DEFAULT_SORTING_DIRECTION
+			emit('libresign:sorting:update')
 		},
 	},
 })
diff --git a/src/store/filters.js b/src/store/filters.js
index cb8c13e1a9..55bf76899b 100644
--- a/src/store/filters.js
+++ b/src/store/filters.js
@@ -3,6 +3,7 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
+import { emit } from '@nextcloud/event-bus'
 import { defineStore } from 'pinia'
 
 import logger from '../helpers/logger.js'
@@ -21,7 +22,7 @@ export const useFiltersStore = defineStore('filter', {
 	actions: {
 		onFilterUpdateChips(event) {
 			this.chips = { ...this.chips, [event.id]: [...event.detail] }
-
+			emit('libresign:filters:update')
 			logger.debug('File list filter chips updated', { chips: event.detail })
 		},
 	},
diff --git a/src/views/FilesList/FileListFilter/FileListFilterModified.vue b/src/views/FilesList/FileListFilter/FileListFilterModified.vue
index 8634199086..e725c0ce39 100644
--- a/src/views/FilesList/FileListFilter/FileListFilterModified.vue
+++ b/src/views/FilesList/FileListFilter/FileListFilterModified.vue
@@ -53,25 +53,35 @@ export default {
 				{
 					id: 'today',
 					label: t('libresign', 'Today'),
+					start: '',
+					end: '',
 					filter: (time) => time > startOfToday(),
 				},
 				{
 					id: 'last-7',
 					label: t('libresign', 'Last 7 days'),
+					start: '',
+					end: '',
 					filter: (time) => time > (startOfToday() - (7 * 24 * 60 * 60 * 1000)),
 				},
 				{
 					id: 'last-30',
 					label: t('libresign', 'Last 30 days'),
+					start: '',
+					end: '',
 					filter: (time) => time > (startOfToday() - (30 * 24 * 60 * 60 * 1000)),
 				},
 				{
 					id: 'this-year',
 					label: t('libresign', 'This year ({year})', { year: (new Date()).getFullYear() }),
+					start: '',
+					end: '',
 					filter: (time) => time > (new Date(startOfToday())).setMonth(0, 1),
 				},
 				{
 					id: 'last-year',
+					start: '',
+					end: '',
 					label: t('libresign', 'Last year ({year})', { year: (new Date()).getFullYear() - 1 }),
 					filter: (time) => (time > (new Date(startOfToday())).setFullYear((new Date()).getFullYear() - 1, 0, 1)) && (time < (new Date(startOfToday())).setMonth(0, 1)),
 				},

From bbbc826f70d12f862604b469cf2a99fbd2155f24 Mon Sep 17 00:00:00 2001
From: Victor Bianchi <vbianchi@protonmail.com>
Date: Mon, 30 Sep 2024 12:20:05 -0300
Subject: [PATCH 14/48] feat: filter files according to status and modified
 values

Signed-off-by: Victor Bianchi <vbianchi@protonmail.com>
---
 lib/Controller/FileController.php             | 10 +++++--
 lib/Db/SignRequestMapper.php                  | 12 +++++++-
 src/store/files.js                            | 16 ++++++++--
 src/store/filesSorting.js                     |  3 +-
 src/store/filters.js                          |  3 +-
 .../FileListFilter/FileListFilterModified.vue | 30 ++++++++-----------
 .../FileListFilter/FileListFilterStatus.vue   |  1 +
 7 files changed, 50 insertions(+), 25 deletions(-)

diff --git a/lib/Controller/FileController.php b/lib/Controller/FileController.php
index c38ec2d9f9..bf3d416bd0 100644
--- a/lib/Controller/FileController.php
+++ b/lib/Controller/FileController.php
@@ -192,9 +192,11 @@ public function validate(?string $type = null, $identifier = null): DataResponse
 	 *
 	 * @param string|null $signer_uuid Signer UUID
 	 * @param string|null $nodeId The nodeId (also called fileId). Is the id of a file at Nextcloud
-	 * @param int|null $status Status could be one of 0 = draft, 1 = able to sign, 2 = partial signed, 3 = signed, 4 = deleted.
+	 * @param list<int>|null $status Status could be none or many of 0 = draft, 1 = able to sign, 2 = partial signed, 3 = signed, 4 = deleted.
 	 * @param int|null $page the number of page to return
 	 * @param int|null $length Total of elements to return
+	 * @param int|null $start Start date of signature request (UNIX timestamp)
+	 * @param int|null $end End date of signature request (UNIX timestamp)
 	 * @return DataResponse<Http::STATUS_OK, array{pagination: LibresignPagination, data: ?LibresignFile[]}, array{}>
 	 *
 	 * 200: OK
@@ -207,12 +209,16 @@ public function list(
 		?int $length = null,
 		?string $signer_uuid = null,
 		?string $nodeId = null,
-		?int $status = null,
+		?array $status = null,
+		?int $start = null,
+		?int $end = null,
 	): DataResponse {
 		$filter = array_filter([
 			'signer_uuid' => $signer_uuid,
 			'nodeId' => $nodeId,
 			'status' => $status,
+			'start' => $start,
+			'end' => $end,
 		], static function ($var) { return $var !== null; });
 		$return = $this->fileService
 			->setMe($this->userSession->getUser())
diff --git a/lib/Db/SignRequestMapper.php b/lib/Db/SignRequestMapper.php
index 88ddfd0ab6..56aaf2a316 100644
--- a/lib/Db/SignRequestMapper.php
+++ b/lib/Db/SignRequestMapper.php
@@ -472,7 +472,17 @@ private function getFilesAssociatedFilesWithMeQueryBuilder(string $userId, ?arra
 			}
 			if (!empty($filter['status'])) {
 				$qb->andWhere(
-					$qb->expr()->eq('f.status', $qb->createNamedParameter($filter['status'], IQueryBuilder::PARAM_INT))
+					$qb->expr()->in('f.status', $qb->createNamedParameter($filter['status'], IQueryBuilder::PARAM_INT_ARRAY))
+				);
+			}
+			if (!empty($filter['start'])) {
+				$qb->andWhere(
+					$qb->expr()->gte('f.created_at', $qb->createNamedParameter($filter['start'], IQueryBuilder::PARAM_INT))
+				);
+			}
+			if (!empty($filter['end'])) {
+				$qb->andWhere(
+					$qb->expr()->lte('f.created_at', $qb->createNamedParameter($filter['end'], IQueryBuilder::PARAM_INT))
 				);
 			}
 			if (isset($filter['length']) && isset($filter['page'])) {
diff --git a/src/store/files.js b/src/store/files.js
index affa56fb66..1c57e5e75c 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -4,17 +4,17 @@
  */
 
 import { defineStore } from 'pinia'
-import { subscribe } from '@nextcloud/event-bus'
 import { set } from 'vue'
 
 import axios from '@nextcloud/axios'
+import { subscribe } from '@nextcloud/event-bus'
 import Moment from '@nextcloud/moment'
 import { generateOcsUrl } from '@nextcloud/router'
 
+import { useFilesSortingStore } from './filesSorting.js'
+import { useFiltersStore } from './filters.js'
 import { useSidebarStore } from './sidebar.js'
 import { useSignStore } from './sign.js'
-import { useFiltersStore } from './filters.js'
-import { useFilesSortingStore } from './filesSorting.js'
 
 export const useFilesStore = function(...args) {
 	const store = defineStore('files', {
@@ -161,8 +161,18 @@ export const useFilesStore = function(...args) {
 				)
 			},
 			async getAllFiles(filter) {
+				if (!filter) filter = {}
 				const { chips } = useFiltersStore()
+				if (chips?.status?.length) {
+					filter.status = chips.status.map(c => c.id)
+				}
+				if (chips?.modified?.length) {
+					const { start, end } = chips.modified[0]
+					filter.start = Math.floor(start / 1000)
+					filter.end = Math.floor(end / 1000)
+				}
 				const { sortingMode, sortingDirection } = useFilesSortingStore()
+				// TODO: pass sortingMode and sortingDirection to API call
 				const response = await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: filter })
 				this.files = {}
 				response.data.ocs.data.data.forEach(file => {
diff --git a/src/store/filesSorting.js b/src/store/filesSorting.js
index 226dd5bb29..70f8904a3e 100644
--- a/src/store/filesSorting.js
+++ b/src/store/filesSorting.js
@@ -3,9 +3,10 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
-import { emit } from '@nextcloud/event-bus'
 import { defineStore } from 'pinia'
 
+import { emit } from '@nextcloud/event-bus'
+
 const DEFAULT_SORTING_DIRECTION = 'asc'
 
 export const useFilesSortingStore = defineStore('filesSorting', {
diff --git a/src/store/filters.js b/src/store/filters.js
index 55bf76899b..750d1f694b 100644
--- a/src/store/filters.js
+++ b/src/store/filters.js
@@ -3,9 +3,10 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
-import { emit } from '@nextcloud/event-bus'
 import { defineStore } from 'pinia'
 
+import { emit } from '@nextcloud/event-bus'
+
 import logger from '../helpers/logger.js'
 
 export const useFiltersStore = defineStore('filter', {
diff --git a/src/views/FilesList/FileListFilter/FileListFilterModified.vue b/src/views/FilesList/FileListFilter/FileListFilterModified.vue
index e725c0ce39..1ec88dd242 100644
--- a/src/views/FilesList/FileListFilter/FileListFilterModified.vue
+++ b/src/views/FilesList/FileListFilter/FileListFilterModified.vue
@@ -28,6 +28,7 @@ import FileListFilter from './FileListFilter.vue'
 import { useFiltersStore } from '../../../store/filters.js'
 
 const startOfToday = () => (new Date()).setHours(0, 0, 0, 0)
+const endOfToday = () => (new Date()).setHours(23, 59, 59, 999)
 
 export default {
 	name: 'FileListFilterModified',
@@ -47,43 +48,36 @@ export default {
 	data() {
 		return {
 			selectedOption: null,
-			timeRangeEnd: null,
-			timeRangeStart: null,
 			timePresets: [
 				{
 					id: 'today',
 					label: t('libresign', 'Today'),
-					start: '',
-					end: '',
-					filter: (time) => time > startOfToday(),
+					start: startOfToday(),
+					end: endOfToday(),
 				},
 				{
 					id: 'last-7',
 					label: t('libresign', 'Last 7 days'),
-					start: '',
-					end: '',
-					filter: (time) => time > (startOfToday() - (7 * 24 * 60 * 60 * 1000)),
+					start: startOfToday() - (7 * 24 * 60 * 60 * 1000),
+					end: endOfToday(),
 				},
 				{
 					id: 'last-30',
 					label: t('libresign', 'Last 30 days'),
-					start: '',
-					end: '',
-					filter: (time) => time > (startOfToday() - (30 * 24 * 60 * 60 * 1000)),
+					start: startOfToday() - (30 * 24 * 60 * 60 * 1000),
+					end: endOfToday(),
 				},
 				{
 					id: 'this-year',
 					label: t('libresign', 'This year ({year})', { year: (new Date()).getFullYear() }),
-					start: '',
-					end: '',
-					filter: (time) => time > (new Date(startOfToday())).setMonth(0, 1),
+					start: (new Date(startOfToday())).setMonth(0, 1),
+					end: endOfToday(),
 				},
 				{
 					id: 'last-year',
-					start: '',
-					end: '',
 					label: t('libresign', 'Last year ({year})', { year: (new Date()).getFullYear() - 1 }),
-					filter: (time) => (time > (new Date(startOfToday())).setFullYear((new Date()).getFullYear() - 1, 0, 1)) && (time < (new Date(startOfToday())).setMonth(0, 1)),
+					start: (new Date(startOfToday())).setFullYear((new Date()).getFullYear() - 1, 0, 1),
+					end: (new Date(startOfToday())).setMonth(0, 1),
 				},
 			],
 		}
@@ -112,6 +106,8 @@ export default {
 			const chips = []
 			if (preset) {
 				chips.push({
+					start: preset.start,
+					end: preset.end,
 					icon: calendarSvg,
 					text: preset.label,
 					onclick: () => this.setPreset(),
diff --git a/src/views/FilesList/FileListFilter/FileListFilterStatus.vue b/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
index d68fa5fda7..6af5c717ce 100644
--- a/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
+++ b/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
@@ -104,6 +104,7 @@ export default {
 			if (presets && presets.length > 0) {
 				for (const preset of presets) {
 					chips.push({
+						id: preset.id,
 						icon: preset.icon,
 						text: preset.label,
 						onclick: () => this.setPreset(presets.filter(({ id }) => id !== preset.id)),

From be783aa5c39033f3dbf2d4a3b58a3bbb2f7443d2 Mon Sep 17 00:00:00 2001
From: Victor Bianchi <vbianchi@protonmail.com>
Date: Mon, 30 Sep 2024 14:12:46 -0300
Subject: [PATCH 15/48] chore: update OpenAPI documentation

Signed-off-by: Victor Bianchi <vbianchi@protonmail.com>
---
 openapi-full.json                 | 69 ++++++++++++++++++++++++++++++-
 openapi.json                      | 69 ++++++++++++++++++++++++++++++-
 src/types/openapi/openapi-full.ts | 51 ++++++++++++++++++++++-
 src/types/openapi/openapi.ts      | 51 ++++++++++++++++++++++-
 4 files changed, 232 insertions(+), 8 deletions(-)

diff --git a/openapi-full.json b/openapi-full.json
index 7a5298e3b1..fad3f76592 100644
--- a/openapi-full.json
+++ b/openapi-full.json
@@ -1128,6 +1128,48 @@
                 }
             }
         },
+        "/index.php/apps/libresign/p/sign/{uuid}/pdf": {
+            "get": {
+                "operationId": "page-sign-pdf",
+                "summary": "Sign page to authenticated signer",
+                "description": "The path is used only by frontend",
+                "tags": [
+                    "page"
+                ],
+                "security": [
+                    {},
+                    {
+                        "bearer_auth": []
+                    },
+                    {
+                        "basic_auth": []
+                    }
+                ],
+                "parameters": [
+                    {
+                        "name": "uuid",
+                        "in": "path",
+                        "description": "Sign request uuid",
+                        "required": true,
+                        "schema": {
+                            "type": "string"
+                        }
+                    }
+                ],
+                "responses": {
+                    "200": {
+                        "description": "OK",
+                        "content": {
+                            "text/html": {
+                                "schema": {
+                                    "type": "string"
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        },
         "/index.php/apps/libresign/p/sign/{uuid}": {
             "get": {
                 "operationId": "page-sign",
@@ -3695,9 +3737,32 @@
                         }
                     },
                     {
-                        "name": "status",
+                        "name": "status[]",
+                        "in": "query",
+                        "description": "Status could be none or many of 0 = draft, 1 = able to sign, 2 = partial signed, 3 = signed, 4 = deleted.",
+                        "schema": {
+                            "type": "array",
+                            "nullable": true,
+                            "items": {
+                                "type": "integer",
+                                "format": "int64"
+                            }
+                        }
+                    },
+                    {
+                        "name": "start",
+                        "in": "query",
+                        "description": "Start date of signature request (UNIX timestamp)",
+                        "schema": {
+                            "type": "integer",
+                            "format": "int64",
+                            "nullable": true
+                        }
+                    },
+                    {
+                        "name": "end",
                         "in": "query",
-                        "description": "Status could be one of 0 = draft, 1 = able to sign, 2 = partial signed, 3 = signed, 4 = deleted.",
+                        "description": "End date of signature request (UNIX timestamp)",
                         "schema": {
                             "type": "integer",
                             "format": "int64",
diff --git a/openapi.json b/openapi.json
index ebf9a8d844..fde54c2766 100644
--- a/openapi.json
+++ b/openapi.json
@@ -1032,6 +1032,48 @@
                 }
             }
         },
+        "/index.php/apps/libresign/p/sign/{uuid}/pdf": {
+            "get": {
+                "operationId": "page-sign-pdf",
+                "summary": "Sign page to authenticated signer",
+                "description": "The path is used only by frontend",
+                "tags": [
+                    "page"
+                ],
+                "security": [
+                    {},
+                    {
+                        "bearer_auth": []
+                    },
+                    {
+                        "basic_auth": []
+                    }
+                ],
+                "parameters": [
+                    {
+                        "name": "uuid",
+                        "in": "path",
+                        "description": "Sign request uuid",
+                        "required": true,
+                        "schema": {
+                            "type": "string"
+                        }
+                    }
+                ],
+                "responses": {
+                    "200": {
+                        "description": "OK",
+                        "content": {
+                            "text/html": {
+                                "schema": {
+                                    "type": "string"
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        },
         "/index.php/apps/libresign/p/sign/{uuid}": {
             "get": {
                 "operationId": "page-sign",
@@ -3599,9 +3641,32 @@
                         }
                     },
                     {
-                        "name": "status",
+                        "name": "status[]",
+                        "in": "query",
+                        "description": "Status could be none or many of 0 = draft, 1 = able to sign, 2 = partial signed, 3 = signed, 4 = deleted.",
+                        "schema": {
+                            "type": "array",
+                            "nullable": true,
+                            "items": {
+                                "type": "integer",
+                                "format": "int64"
+                            }
+                        }
+                    },
+                    {
+                        "name": "start",
+                        "in": "query",
+                        "description": "Start date of signature request (UNIX timestamp)",
+                        "schema": {
+                            "type": "integer",
+                            "format": "int64",
+                            "nullable": true
+                        }
+                    },
+                    {
+                        "name": "end",
                         "in": "query",
-                        "description": "Status could be one of 0 = draft, 1 = able to sign, 2 = partial signed, 3 = signed, 4 = deleted.",
+                        "description": "End date of signature request (UNIX timestamp)",
                         "schema": {
                             "type": "integer",
                             "format": "int64",
diff --git a/src/types/openapi/openapi-full.ts b/src/types/openapi/openapi-full.ts
index 64966b8c1c..769b00c353 100644
--- a/src/types/openapi/openapi-full.ts
+++ b/src/types/openapi/openapi-full.ts
@@ -153,6 +153,26 @@ export type paths = {
         patch?: never;
         trace?: never;
     };
+    "/index.php/apps/libresign/p/sign/{uuid}/pdf": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        /**
+         * Sign page to authenticated signer
+         * @description The path is used only by frontend
+         */
+        get: operations["page-sign-pdf"];
+        put?: never;
+        post?: never;
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/index.php/apps/libresign/p/sign/{uuid}": {
         parameters: {
             query?: never;
@@ -1419,6 +1439,29 @@ export interface operations {
             };
         };
     };
+    "page-sign-pdf": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path: {
+                /** @description Sign request uuid */
+                uuid: string;
+            };
+            cookie?: never;
+        };
+        requestBody?: never;
+        responses: {
+            /** @description OK */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "text/html": string;
+                };
+            };
+        };
+    };
     "page-sign": {
         parameters: {
             query?: never;
@@ -2453,8 +2496,12 @@ export interface operations {
                 signer_uuid?: string | null;
                 /** @description The nodeId (also called fileId). Is the id of a file at Nextcloud */
                 nodeId?: string | null;
-                /** @description Status could be one of 0 = draft, 1 = able to sign, 2 = partial signed, 3 = signed, 4 = deleted. */
-                status?: number | null;
+                /** @description Status could be none or many of 0 = draft, 1 = able to sign, 2 = partial signed, 3 = signed, 4 = deleted. */
+                "status[]"?: number[] | null;
+                /** @description Start date of signature request (UNIX timestamp) */
+                start?: number | null;
+                /** @description End date of signature request (UNIX timestamp) */
+                end?: number | null;
             };
             header: {
                 /** @description Required to be true for the API request to pass */
diff --git a/src/types/openapi/openapi.ts b/src/types/openapi/openapi.ts
index 2f1422039c..256118bfd9 100644
--- a/src/types/openapi/openapi.ts
+++ b/src/types/openapi/openapi.ts
@@ -153,6 +153,26 @@ export type paths = {
         patch?: never;
         trace?: never;
     };
+    "/index.php/apps/libresign/p/sign/{uuid}/pdf": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        /**
+         * Sign page to authenticated signer
+         * @description The path is used only by frontend
+         */
+        get: operations["page-sign-pdf"];
+        put?: never;
+        post?: never;
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/index.php/apps/libresign/p/sign/{uuid}": {
         parameters: {
             query?: never;
@@ -1273,6 +1293,29 @@ export interface operations {
             };
         };
     };
+    "page-sign-pdf": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path: {
+                /** @description Sign request uuid */
+                uuid: string;
+            };
+            cookie?: never;
+        };
+        requestBody?: never;
+        responses: {
+            /** @description OK */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "text/html": string;
+                };
+            };
+        };
+    };
     "page-sign": {
         parameters: {
             query?: never;
@@ -2307,8 +2350,12 @@ export interface operations {
                 signer_uuid?: string | null;
                 /** @description The nodeId (also called fileId). Is the id of a file at Nextcloud */
                 nodeId?: string | null;
-                /** @description Status could be one of 0 = draft, 1 = able to sign, 2 = partial signed, 3 = signed, 4 = deleted. */
-                status?: number | null;
+                /** @description Status could be none or many of 0 = draft, 1 = able to sign, 2 = partial signed, 3 = signed, 4 = deleted. */
+                "status[]"?: number[] | null;
+                /** @description Start date of signature request (UNIX timestamp) */
+                start?: number | null;
+                /** @description End date of signature request (UNIX timestamp) */
+                end?: number | null;
             };
             header: {
                 /** @description Required to be true for the API request to pass */

From 1026c867af82009664c146296f16d74c0b0a284b Mon Sep 17 00:00:00 2001
From: Victor Bianchi <vbianchi@protonmail.com>
Date: Mon, 30 Sep 2024 16:28:13 -0300
Subject: [PATCH 16/48] feat: implement file sorting

Signed-off-by: Victor Bianchi <vbianchi@protonmail.com>
---
 lib/Controller/FileController.php            | 10 +++-
 lib/Db/SignRequestMapper.php                 | 15 +++++-
 lib/Service/FileService.php                  |  8 ++-
 src/Components/File/File.vue                 |  8 +--
 src/store/files.js                           | 53 +++++++++++---------
 src/store/filesSorting.js                    |  2 +-
 src/views/FilesList/FilesList.vue            |  2 +-
 src/views/FilesList/FilesListTableHeader.vue |  6 +--
 src/views/FilesList/VirtualList.vue          |  2 +-
 9 files changed, 68 insertions(+), 38 deletions(-)

diff --git a/lib/Controller/FileController.php b/lib/Controller/FileController.php
index bf3d416bd0..e9b2757375 100644
--- a/lib/Controller/FileController.php
+++ b/lib/Controller/FileController.php
@@ -197,6 +197,8 @@ public function validate(?string $type = null, $identifier = null): DataResponse
 	 * @param int|null $length Total of elements to return
 	 * @param int|null $start Start date of signature request (UNIX timestamp)
 	 * @param int|null $end End date of signature request (UNIX timestamp)
+	 * @param string|null $sortBy Name of the column to sort by
+	 * @param string|null $sortDirection Ascending or descending order
 	 * @return DataResponse<Http::STATUS_OK, array{pagination: LibresignPagination, data: ?LibresignFile[]}, array{}>
 	 *
 	 * 200: OK
@@ -212,6 +214,8 @@ public function list(
 		?array $status = null,
 		?int $start = null,
 		?int $end = null,
+		?string $sortBy = null,
+		?string $sortDirection = null,
 	): DataResponse {
 		$filter = array_filter([
 			'signer_uuid' => $signer_uuid,
@@ -220,9 +224,13 @@ public function list(
 			'start' => $start,
 			'end' => $end,
 		], static function ($var) { return $var !== null; });
+		$sort = [
+			'sortBy' => $sortBy,
+			'sortDirection' => $sortDirection,
+		];
 		$return = $this->fileService
 			->setMe($this->userSession->getUser())
-			->listAssociatedFilesOfSignFlow($page, $length, $filter);
+			->listAssociatedFilesOfSignFlow($page, $length, $filter, $sort);
 		return new DataResponse($return, Http::STATUS_OK);
 	}
 
diff --git a/lib/Db/SignRequestMapper.php b/lib/Db/SignRequestMapper.php
index 56aaf2a316..61a6c5c321 100644
--- a/lib/Db/SignRequestMapper.php
+++ b/lib/Db/SignRequestMapper.php
@@ -329,11 +329,12 @@ public function getFilesAssociatedFilesWithMeFormatted(
 		array $filter,
 		?int $page = null,
 		?int $length = null,
+		?array $sort = [],
 	): array {
 		$filter['email'] = $user->getEMailAddress();
 		$filter['length'] = $length;
 		$filter['page'] = $page;
-		$pagination = $this->getFilesAssociatedFilesWithMeStmt($user->getUID(), $filter);
+		$pagination = $this->getFilesAssociatedFilesWithMeStmt($user->getUID(), $filter, $sort);
 		$pagination->setMaxPerPage($length);
 		$pagination->setCurrentPage($page);
 		$currentPageResults = $pagination->getCurrentPageResults();
@@ -493,7 +494,11 @@ private function getFilesAssociatedFilesWithMeQueryBuilder(string $userId, ?arra
 		return $qb;
 	}
 
-	private function getFilesAssociatedFilesWithMeStmt(string $userId, ?array $filter = []): Pagination {
+	private function getFilesAssociatedFilesWithMeStmt(
+		string $userId,
+		?array $filter = [],
+		?array $sort = [],
+	): Pagination {
 		$qb = $this->getFilesAssociatedFilesWithMeQueryBuilder($userId, $filter);
 		$qb->select(
 			'f.id',
@@ -504,6 +509,12 @@ private function getFilesAssociatedFilesWithMeStmt(string $userId, ?array $filte
 			'f.status',
 			'f.metadata',
 		);
+		if (!empty($sort) && in_array($sort['sortBy'], ['name', 'status', 'created_at'])) {
+			$qb->orderBy(
+				$qb->func()->lower('f.' . $sort['sortBy']),
+				$sort['sortDirection'] == 'asc' ? 'asc' : 'desc'
+			);
+		}
 		$qb->selectAlias('f.created_at', 'request_date');
 
 		$countQueryBuilderModifier = function (IQueryBuilder $qb): int {
diff --git a/lib/Service/FileService.php b/lib/Service/FileService.php
index 1d9632e779..da777230ec 100644
--- a/lib/Service/FileService.php
+++ b/lib/Service/FileService.php
@@ -432,7 +432,12 @@ public function setFileByPath(string $path): self {
 	 *
 	 * @psalm-return array{data: array, pagination: array}
 	 */
-	public function listAssociatedFilesOfSignFlow($page = null, $length = null, array $filter = []): array {
+	public function listAssociatedFilesOfSignFlow(
+		$page = null,
+		$length = null,
+		array $filter = [],
+		array $sort = [],
+	): array {
 		$page = $page ?? 1;
 		$length = $length ?? (int)$this->appConfig->getAppValue('length_of_page', '100');
 
@@ -441,6 +446,7 @@ public function listAssociatedFilesOfSignFlow($page = null, $length = null, arra
 			$filter,
 			$page,
 			$length,
+			$sort,
 		);
 
 		$signers = $this->signRequestMapper->getByMultipleFileId(array_column($return['data'], 'id'));
diff --git a/src/Components/File/File.vue b/src/Components/File/File.vue
index 54911f712e..bc35e1c5c8 100644
--- a/src/Components/File/File.vue
+++ b/src/Components/File/File.vue
@@ -15,10 +15,10 @@
 			@load="backgroundFailed = false">
 		<FileIcon v-else v-once :size="128" />
 		<div class="enDot">
-			<div :class="filesStore.files[currentNodeId].statusText !== 'none' ? 'dot ' + statusToClass(filesStore.files[currentNodeId].status) : '' " />
-			<span>{{ filesStore.files[currentNodeId].statusText !== 'none' ? filesStore.files[currentNodeId].statusText : '' }}</span>
+			<div :class="filesStore.files.get(currentNodeId).statusText !== 'none' ? 'dot ' + statusToClass(filesStore.files.get(currentNodeId).status) : '' " />
+			<span>{{ filesStore.files.get(currentNodeId).statusText !== 'none' ? filesStore.files.get(currentNodeId).statusText : '' }}</span>
 		</div>
-		<h1>{{ filesStore.files[currentNodeId].name }}</h1>
+		<h1>{{ filesStore.files.get(currentNodeId).name }}</h1>
 	</div>
 </template>
 
@@ -64,7 +64,7 @@ export default {
 				return null
 			}
 			let previewUrl = ''
-			if (this.filesStore.files[this.currentNodeId]?.uuid?.length > 0) {
+			if (this.filesStore.files.get(this.currentNodeId)?.uuid?.length > 0) {
 				previewUrl = generateOcsUrl('/apps/libresign/api/v1/file/thumbnail/{nodeId}', {
 					nodeId: this.currentNodeId,
 				})
diff --git a/src/store/files.js b/src/store/files.js
index 1c57e5e75c..28d0a486a5 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -20,7 +20,7 @@ export const useFilesStore = function(...args) {
 	const store = defineStore('files', {
 		state: () => {
 			return {
-				files: {},
+				files: new Map(),
 				selectedNodeId: 0,
 				identifyingSigner: false,
 				loading: false,
@@ -30,7 +30,7 @@ export const useFilesStore = function(...args) {
 
 		actions: {
 			addFile(file) {
-				set(this.files, file.nodeId, file)
+				this.files.set(file.nodeId, file)
 				this.hydrateFile(file.nodeId)
 			},
 			selectFile(nodeId) {
@@ -44,13 +44,13 @@ export const useFilesStore = function(...args) {
 				sidebarStore.activeRequestSignatureTab()
 			},
 			getFile() {
-				return this.files[this.selectedNodeId] ?? {}
+				return this.files.get(this.selectedNodeId) ?? {}
 			},
 			async flushSelectedFile() {
 				const files = await this.getAllFiles({
 					nodeId: this.selectedNodeId,
 				})
-				this.addFile(files[this.selectedNodeId])
+				this.addFile(files.get(this.selectedNodeId))
 			},
 			enableIdentifySigner() {
 				this.identifyingSigner = true
@@ -65,7 +65,7 @@ export const useFilesStore = function(...args) {
 				if (!Object.hasOwn(this.getFile(), 'signers')) {
 					return false
 				}
-				return this.files[this.selectedNodeId].signers.length > 0
+				return this.files.get(this.selectedNodeId).signers.length > 0
 			},
 			isPartialSigned() {
 				if (this.selectedNodeId === 0) {
@@ -74,7 +74,7 @@ export const useFilesStore = function(...args) {
 				if (!Object.hasOwn(this.getFile(), 'signers')) {
 					return false
 				}
-				return this.files[this.selectedNodeId].signers
+				return this.files.get(this.selectedNodeId).signers
 					.filter(signer => signer.signed?.length > 0).length > 0
 			},
 			isFullSigned() {
@@ -84,15 +84,15 @@ export const useFilesStore = function(...args) {
 				if (!Object.hasOwn(this.getFile(), 'signers')) {
 					return false
 				}
-				return this.files[this.selectedNodeId].signers.length > 0
-					&& this.files[this.selectedNodeId].signers
-						.filter(signer => signer.signed?.length > 0).length === this.files[this.selectedNodeId].signers.length
+				return this.files.get(this.selectedNodeId).signers.length > 0
+					&& this.files.get(this.selectedNodeId).signers
+						.filter(signer => signer.signed?.length > 0).length === this.files.get(this.selectedNodeId).signers.length
 			},
 			getSubtitle() {
 				if (this.selectedNodeId === 0) {
 					return ''
 				}
-				const file = this.files[this.selectedNodeId]
+				const file = this.files.get(this.selectedNodeId)
 				if ((file?.requested_by?.userId ?? '').length === 0 || file?.request_date.length === 0) {
 					return ''
 				}
@@ -102,18 +102,18 @@ export const useFilesStore = function(...args) {
 				})
 			},
 			async hydrateFile(nodeId) {
-				if (Object.hasOwn(this.files[nodeId], 'uuid')) {
+				if (Object.hasOwn(this.files.get(nodeId), 'uuid')) {
 					return
 				}
 				await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/validate/file_id/{fileId}', {
 					fileId: nodeId,
 				}))
 					.then((response) => {
-						set(this.files, nodeId, response.data.ocs.data)
-						this.addUniqueIdentifierToAllSigners(this.files[nodeId].signers)
+						this.files.set(nodeId, response.data.ocs.data)
+						this.addUniqueIdentifierToAllSigners(this.files.get(nodeId).signers)
 					})
 					.catch(() => {
-						set(this.files[nodeId], 'signers', [])
+						set(this.files.get(nodeId), 'signers', [])
 					})
 			},
 			addUniqueIdentifierToAllSigners(signers) {
@@ -134,17 +134,17 @@ export const useFilesStore = function(...args) {
 			signerUpdate(signer) {
 				this.addIdentifierToSigner(signer)
 				// Remove if already exists
-				for (let i = this.files[this.selectedNodeId].signers.length - 1; i >= 0; i--) {
-					if (this.files[this.selectedNodeId].signers[i].identify === signer.identify) {
-						this.files[this.selectedNodeId].signers.splice(i, 1)
+				for (let i = this.files.get(this.selectedNodeId).signers.length - 1; i >= 0; i--) {
+					if (this.files.get(this.selectedNodeId).signers[i].identify === signer.identify) {
+						this.files.get(this.selectedNodeId).signers.splice(i, 1)
 						break
 					}
-					if (this.files[this.selectedNodeId].signers[i].signRequestId === signer.identify) {
-						this.files[this.selectedNodeId].signers.splice(i, 1)
+					if (this.files.get(this.selectedNodeId).signers[i].signRequestId === signer.identify) {
+						this.files.get(this.selectedNodeId).signers.splice(i, 1)
 						break
 					}
 				}
-				this.files[this.selectedNodeId].signers.push(signer)
+				this.files.get(this.selectedNodeId).signers.push(signer)
 			},
 			async deleteSigner(signer) {
 				if (!isNaN(signer.signRequestId)) {
@@ -155,9 +155,9 @@ export const useFilesStore = function(...args) {
 					}))
 				}
 				set(
-					this.files[this.selectedNodeId],
+					this.files.get(this.selectedNodeId),
 					'signers',
-					this.files[this.selectedNodeId].signers.filter((i) => i.identify !== signer.identify),
+					this.files.get(this.selectedNodeId).signers.filter((i) => i.identify !== signer.identify),
 				)
 			},
 			async getAllFiles(filter) {
@@ -172,9 +172,14 @@ export const useFilesStore = function(...args) {
 					filter.end = Math.floor(end / 1000)
 				}
 				const { sortingMode, sortingDirection } = useFilesSortingStore()
-				// TODO: pass sortingMode and sortingDirection to API call
+				if (sortingMode) {
+					filter.sortBy = sortingMode
+				}
+				if (sortingDirection) {
+					filter.sortDirection = sortingDirection
+				}
 				const response = await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: filter })
-				this.files = {}
+				this.files = new Map()
 				response.data.ocs.data.data.forEach(file => {
 					this.addFile(file)
 				})
diff --git a/src/store/filesSorting.js b/src/store/filesSorting.js
index 70f8904a3e..7e89b66170 100644
--- a/src/store/filesSorting.js
+++ b/src/store/filesSorting.js
@@ -11,7 +11,7 @@ const DEFAULT_SORTING_DIRECTION = 'asc'
 
 export const useFilesSortingStore = defineStore('filesSorting', {
 	state: () => ({
-		sortingMode: 'basename',
+		sortingMode: 'name',
 		sortingDirection: DEFAULT_SORTING_DIRECTION,
 	}),
 
diff --git a/src/views/FilesList/FilesList.vue b/src/views/FilesList/FilesList.vue
index 5be7eaab20..1cee2bffef 100644
--- a/src/views/FilesList/FilesList.vue
+++ b/src/views/FilesList/FilesList.vue
@@ -150,7 +150,7 @@ export default {
 			return this.dirContentsFiltered
 		},
 		isEmptyDir() {
-			return this.filesStore.files.length === 0
+			return this.filesStore.files.size === 0
 		},
 		isRefreshing() {
 			return !this.isEmptyDir
diff --git a/src/views/FilesList/FilesListTableHeader.vue b/src/views/FilesList/FilesListTableHeader.vue
index 32d8ea8a3c..19211678b1 100644
--- a/src/views/FilesList/FilesListTableHeader.vue
+++ b/src/views/FilesList/FilesListTableHeader.vue
@@ -13,7 +13,7 @@
 			<span class="files-list__row-icon" />
 
 			<!-- Name -->
-			<FilesListTableHeaderButton :name="t('files', 'Name')" mode="basename" />
+			<FilesListTableHeaderButton :name="t('files', 'Name')" mode="name" />
 		</th>
 
 		<!-- Actions -->
@@ -59,8 +59,8 @@ export default {
 					sort: true,
 				},
 				{
-					title: t('libresign', 'Modified'),
-					id: 'modified',
+					title: t('libresign', 'Created at'),
+					id: 'created_at',
 					sort: true,
 				},
 			],
diff --git a/src/views/FilesList/VirtualList.vue b/src/views/FilesList/VirtualList.vue
index e7a9a6c013..8c3404c72e 100644
--- a/src/views/FilesList/VirtualList.vue
+++ b/src/views/FilesList/VirtualList.vue
@@ -14,7 +14,7 @@
 				:class="userConfigStore.grid_view ? 'files-list__tbody--grid' : 'files-list__tbody--list'"
 				data-cy-files-list-tbody>
 				<component :is="dataComponent"
-					v-for="item in filesStore.files"
+					v-for="item in filesStore.files.values()"
 					:key="item.nodeId"
 					:source="item"
 					:loading="loading" />

From d3aedd773deffaa8f082f7b62b3171ac950725c5 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Sun, 13 Oct 2024 21:40:01 -0300
Subject: [PATCH 17/48] chore: implement buttons to reques to sign

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/Components/Signers/Signer.vue             |   6 +-
 src/store/files.js                            |  46 ++--
 .../FilesList/FileEntry/FileEntryStatus.vue   |   2 +
 src/views/FilesList/FilesList.vue             | 227 +++++++++++++++++-
 src/views/FilesList/VirtualList.vue           |   2 +-
 5 files changed, 254 insertions(+), 29 deletions(-)

diff --git a/src/Components/Signers/Signer.vue b/src/Components/Signers/Signer.vue
index 8d9ed9ed59..6d7f81b8ad 100644
--- a/src/Components/Signers/Signer.vue
+++ b/src/Components/Signers/Signer.vue
@@ -13,7 +13,9 @@
 			<template #subname>
 				<Bullet v-for="method in identifyMethodsNames" :key="method" :name="method" />
 			</template>
-			<slot v-if="$slots.actions" slot="actions" name="actions" />
+			<NcActions>
+				<slot v-if="$slots.actions" slot="actions" name="actions" />
+			</NcActions>
 			<template #indicator>
 				<CheckboxBlankCircle :size="16"
 					:fill-color="statusColor"
@@ -29,6 +31,7 @@ import { emit } from '@nextcloud/event-bus'
 import { loadState } from '@nextcloud/initial-state'
 import Moment from '@nextcloud/moment'
 
+import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar.js'
 import NcListItem from '@nextcloud/vue/dist/Components/NcListItem.js'
 
@@ -39,6 +42,7 @@ import { useFilesStore } from '../../store/files.js'
 export default {
 	name: 'Signer',
 	components: {
+		NcActions,
 		NcListItem,
 		NcAvatar,
 		CheckboxBlankCircle,
diff --git a/src/store/files.js b/src/store/files.js
index 28d0a486a5..2826fddde1 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -20,7 +20,7 @@ export const useFilesStore = function(...args) {
 	const store = defineStore('files', {
 		state: () => {
 			return {
-				files: new Map(),
+				files: {},
 				selectedNodeId: 0,
 				identifyingSigner: false,
 				loading: false,
@@ -30,7 +30,7 @@ export const useFilesStore = function(...args) {
 
 		actions: {
 			addFile(file) {
-				this.files.set(file.nodeId, file)
+				set(this.files, file.nodeId, file)
 				this.hydrateFile(file.nodeId)
 			},
 			selectFile(nodeId) {
@@ -44,13 +44,13 @@ export const useFilesStore = function(...args) {
 				sidebarStore.activeRequestSignatureTab()
 			},
 			getFile() {
-				return this.files.get(this.selectedNodeId) ?? {}
+				return this.files[this.selectedNodeId] ?? {}
 			},
 			async flushSelectedFile() {
 				const files = await this.getAllFiles({
 					nodeId: this.selectedNodeId,
 				})
-				this.addFile(files.get(this.selectedNodeId))
+				this.addFile(files[this.selectedNodeId])
 			},
 			enableIdentifySigner() {
 				this.identifyingSigner = true
@@ -65,7 +65,7 @@ export const useFilesStore = function(...args) {
 				if (!Object.hasOwn(this.getFile(), 'signers')) {
 					return false
 				}
-				return this.files.get(this.selectedNodeId).signers.length > 0
+				return this.files[this.selectedNodeId].signers.length > 0
 			},
 			isPartialSigned() {
 				if (this.selectedNodeId === 0) {
@@ -74,7 +74,7 @@ export const useFilesStore = function(...args) {
 				if (!Object.hasOwn(this.getFile(), 'signers')) {
 					return false
 				}
-				return this.files.get(this.selectedNodeId).signers
+				return this.files[this.selectedNodeId].signers
 					.filter(signer => signer.signed?.length > 0).length > 0
 			},
 			isFullSigned() {
@@ -84,15 +84,15 @@ export const useFilesStore = function(...args) {
 				if (!Object.hasOwn(this.getFile(), 'signers')) {
 					return false
 				}
-				return this.files.get(this.selectedNodeId).signers.length > 0
-					&& this.files.get(this.selectedNodeId).signers
-						.filter(signer => signer.signed?.length > 0).length === this.files.get(this.selectedNodeId).signers.length
+				return this.files[this.selectedNodeId].signers.length > 0
+					&& this.files[this.selectedNodeId].signers
+						.filter(signer => signer.signed?.length > 0).length === this.files[this.selectedNodeId].signers.length
 			},
 			getSubtitle() {
 				if (this.selectedNodeId === 0) {
 					return ''
 				}
-				const file = this.files.get(this.selectedNodeId)
+				const file = this.files[this.selectedNodeId]
 				if ((file?.requested_by?.userId ?? '').length === 0 || file?.request_date.length === 0) {
 					return ''
 				}
@@ -102,18 +102,18 @@ export const useFilesStore = function(...args) {
 				})
 			},
 			async hydrateFile(nodeId) {
-				if (Object.hasOwn(this.files.get(nodeId), 'uuid')) {
+				if (Object.hasOwn(this.files[nodeId], 'uuid')) {
 					return
 				}
 				await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/validate/file_id/{fileId}', {
 					fileId: nodeId,
 				}))
 					.then((response) => {
-						this.files.set(nodeId, response.data.ocs.data)
-						this.addUniqueIdentifierToAllSigners(this.files.get(nodeId).signers)
+						set(this.files, nodeId, response.data.ocs.data)
+						this.addUniqueIdentifierToAllSigners(this.files[nodeId].signers)
 					})
 					.catch(() => {
-						set(this.files.get(nodeId), 'signers', [])
+						set(this.files[nodeId], 'signers', [])
 					})
 			},
 			addUniqueIdentifierToAllSigners(signers) {
@@ -134,17 +134,17 @@ export const useFilesStore = function(...args) {
 			signerUpdate(signer) {
 				this.addIdentifierToSigner(signer)
 				// Remove if already exists
-				for (let i = this.files.get(this.selectedNodeId).signers.length - 1; i >= 0; i--) {
-					if (this.files.get(this.selectedNodeId).signers[i].identify === signer.identify) {
-						this.files.get(this.selectedNodeId).signers.splice(i, 1)
+				for (let i = this.files[this.selectedNodeId].signers.length - 1; i >= 0; i--) {
+					if (this.files[this.selectedNodeId].signers[i].identify === signer.identify) {
+						this.files[this.selectedNodeId].signers.splice(i, 1)
 						break
 					}
-					if (this.files.get(this.selectedNodeId).signers[i].signRequestId === signer.identify) {
-						this.files.get(this.selectedNodeId).signers.splice(i, 1)
+					if (this.files[this.selectedNodeId].signers[i].signRequestId === signer.identify) {
+						this.files[this.selectedNodeId].signers.splice(i, 1)
 						break
 					}
 				}
-				this.files.get(this.selectedNodeId).signers.push(signer)
+				this.files[this.selectedNodeId].signers.push(signer)
 			},
 			async deleteSigner(signer) {
 				if (!isNaN(signer.signRequestId)) {
@@ -155,9 +155,9 @@ export const useFilesStore = function(...args) {
 					}))
 				}
 				set(
-					this.files.get(this.selectedNodeId),
+					this.files[this.selectedNodeId],
 					'signers',
-					this.files.get(this.selectedNodeId).signers.filter((i) => i.identify !== signer.identify),
+					this.files[this.selectedNodeId].signers.filter((i) => i.identify !== signer.identify),
 				)
 			},
 			async getAllFiles(filter) {
@@ -179,7 +179,7 @@ export const useFilesStore = function(...args) {
 					filter.sortDirection = sortingDirection
 				}
 				const response = await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: filter })
-				this.files = new Map()
+				this.files = []
 				response.data.ocs.data.data.forEach(file => {
 					this.addFile(file)
 				})
diff --git a/src/views/FilesList/FileEntry/FileEntryStatus.vue b/src/views/FilesList/FileEntry/FileEntryStatus.vue
index 431ae56120..88a4ed6c66 100644
--- a/src/views/FilesList/FileEntry/FileEntryStatus.vue
+++ b/src/views/FilesList/FileEntry/FileEntryStatus.vue
@@ -12,10 +12,12 @@ export default {
 		statusText: {
 			type: String,
 			required: true,
+			default: 'none',
 		},
 		status: {
 			type: Number,
 			required: true,
+			default: 0,
 		},
 	},
 	methods: {
diff --git a/src/views/FilesList/FilesList.vue b/src/views/FilesList/FilesList.vue
index 1cee2bffef..f527c5f974 100644
--- a/src/views/FilesList/FilesList.vue
+++ b/src/views/FilesList/FilesList.vue
@@ -16,23 +16,24 @@
 					</template>
 				</NcBreadcrumb>
 				<template #actions>
-					<NcActions :menu-name="t('libresign', 'Request')">
+					<NcActions :menu-name="t('libresign', 'Request')"
+						:open.sync="openedMenu">
 						<template #icon>
 							<PlusIcon :size="20" />
 						</template>
-						<NcActionButton>
+						<NcActionButton @click="showModalUploadFromUrl()">
 							<template #icon>
 								<LinkIcon :size="20" />
 							</template>
 							{{ t('libresign', 'Upload from URL') }}
 						</NcActionButton>
-						<NcActionButton>
+						<NcActionButton @click="showFilePicker = true">
 							<template #icon>
 								<FolderIcon :size="20" />
 							</template>
 							{{ t('libresign', 'Choose from Files') }}
 						</NcActionButton>
-						<NcActionButton>
+						<NcActionButton @click="uploadFile">
 							<template #icon>
 								<NcLoadingIcon v-if="isUploading" :size="20" />
 								<UploadIcon v-else :size="20" />
@@ -70,6 +71,37 @@
 		<FilesListVirtual v-else
 			:nodes="dirContentsSorted"
 			:loading="loading" />
+		<FilePicker v-if="showFilePicker"
+			:name="t('libresign', 'Select your file')"
+			:multiselect="false"
+			:buttons="filePickerButtons"
+			:mimetype-filter="['application/pdf']"
+			@close="showFilePicker = false" />
+		<NcDialog v-if="modalUploadFromUrl"
+			:name="t('libresign', 'URL of a PDF file')"
+			:can-close="!loading"
+			@closing="closeModalUploadFromUrl">
+			<NcNoteCard v-for="message in uploadUrlErrors"
+				:key="message"
+				type="error">
+				{{ message }}
+			</NcNoteCard>
+			<NcTextField :label="t('libresign', 'URL of a PDF file')"
+				:value.sync="pdfUrl">
+				<LinkIcon :size="20" />
+			</NcTextField>
+			<template #actions>
+				<NcButton :disabled="!canUploadFronUrl"
+					type="primary"
+					@click="uploadUrl">
+					{{ t('libresign', 'Send') }}
+					<template #icon>
+						<NcLoadingIcon v-if="loading" :size="20" />
+						<CloudUploadIcon v-else :size="20" />
+					</template>
+				</NcButton>
+			</template>
+		</NcDialog>
 	</NcAppContent>
 </template>
 
@@ -77,6 +109,7 @@
 
 import HomeSvg from '@mdi/svg/svg/home.svg?raw'
 
+import CloudUploadIcon from 'vue-material-design-icons/CloudUpload.vue'
 import FolderIcon from 'vue-material-design-icons/Folder.vue'
 import ListViewIcon from 'vue-material-design-icons/FormatListBulletedSquare.vue'
 import LinkIcon from 'vue-material-design-icons/Link.vue'
@@ -84,24 +117,50 @@ import PlusIcon from 'vue-material-design-icons/Plus.vue'
 import UploadIcon from 'vue-material-design-icons/Upload.vue'
 import ViewGridIcon from 'vue-material-design-icons/ViewGrid.vue'
 
+import axios from '@nextcloud/axios'
+import { FilePickerVue as FilePicker } from '@nextcloud/dialogs/filepicker.js'
+import { subscribe, unsubscribe } from '@nextcloud/event-bus'
+import { generateOcsUrl } from '@nextcloud/router'
+
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent.js'
 import NcBreadcrumb from '@nextcloud/vue/dist/Components/NcBreadcrumb.js'
 import NcBreadcrumbs from '@nextcloud/vue/dist/Components/NcBreadcrumbs.js'
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
+import NcDialog from '@nextcloud/vue/dist/Components/NcDialog.js'
 import NcEmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent.js'
 import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
 import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
+import NcNoteCard from '@nextcloud/vue/dist/Components/NcNoteCard.js'
+import NcTextField from '@nextcloud/vue/dist/Components/NcTextField.js'
 
 import FilesListVirtual from './FilesListVirtual.vue'
 
+import { filesService } from '../../domains/files/index.js'
+import { useActionsMenuStore } from '../../store/actionsmenu.js'
 import { useFilesStore } from '../../store/files.js'
+import { useSidebarStore } from '../../store/sidebar.js'
 import { useUserConfigStore } from '../../store/userconfig.js'
 
+const PDF_MIME_TYPE = 'application/pdf'
+
+const loadFileToBase64 = file => {
+	return new Promise((resolve, reject) => {
+		const reader = new FileReader()
+		reader.readAsDataURL(file)
+		reader.onload = () => resolve(reader.result)
+		reader.onerror = (error) => reject(error)
+	})
+}
 export default {
 	name: 'FilesList',
 	components: {
+		FilePicker,
+		NcDialog,
+		NcNoteCard,
+		NcTextField,
+		CloudUploadIcon,
 		NcAppContent,
 		NcButton,
 		PlusIcon,
@@ -120,21 +179,73 @@ export default {
 		NcEmptyContent,
 	},
 	setup() {
+		const actionsMenuStore = useActionsMenuStore()
 		const filesStore = useFilesStore()
+		const sidebarStore = useSidebarStore()
 		const userConfigStore = useUserConfigStore()
 		return {
+			actionsMenuStore,
 			filesStore,
+			sidebarStore,
 			userConfigStore,
 		}
 	},
 	data() {
 		return {
+			modalUploadFromUrl: false,
+			showingFilePicker: false,
+			pdfUrl: '',
+			file: {},
+			signers: [],
+			uploadUrlErrors: [],
+			errors: [],
 			isUploading: false,
 			loading: false,
 			dirContentsFiltered: [],
 		}
 	},
 	computed: {
+		filePickerButtons() {
+			return [{
+				label: t('libresign', 'Choose'),
+				callback: (nodes) => this.handleFileChoose(nodes),
+				type: 'primary',
+			}]
+		},
+		canRequest() {
+			return this.signers.length > 0
+		},
+		canUploadFronUrl() {
+			if (this.loading) {
+				return false
+			}
+			try {
+				// eslint-disable-next-line no-new
+				new URL(this.pdfUrl)
+				return true
+			} catch (e) {
+				return false
+			}
+		},
+		openedMenu: {
+			get() {
+				return this.actionsMenuStore.opened === 'global'
+			},
+			set(opened) {
+				this.actionsMenuStore.opened = opened ? 'global' : null
+			},
+		},
+		showFilePicker: {
+			get() {
+				return this.showingFilePicker
+			},
+			set(state) {
+				this.showingFilePicker = state
+				if (state) {
+					this.openedMenu = false
+				}
+			},
+		},
 		viewIcon() {
 			return HomeSvg
 		},
@@ -160,6 +271,14 @@ export default {
 	async created() {
 		await this.filesStore.getAllFiles()
 	},
+	async mounted() {
+		subscribe('libresign:visible-elements-saved', this.closeSidebar)
+		this.filesStore.disableIdentifySigner()
+	},
+	beforeUnmount() {
+		unsubscribe('libresign:visible-elements-saved')
+		this.filesStore.selectFile()
+	},
 	methods: {
 		refresh() {
 			console.log('Need to implement refresh')
@@ -172,6 +291,106 @@ export default {
 			console.log('Implement filter here')
 			this.dirContentsFiltered = nodes
 		},
+		closeSidebar() {
+			this.filesStore.selectFile()
+		},
+		showModalUploadFromUrl() {
+			this.actionsMenuStore.opened = false
+			this.modalUploadFromUrl = true
+		},
+		closeModalUploadFromUrl() {
+			this.cleanErrors()
+			this.modalUploadFromUrl = false
+		},
+		cleanErrors() {
+			this.uploadUrlErrors = []
+			this.errors = []
+		},
+		async uploadUrl() {
+			this.loading = true
+			this.cleanErrors()
+			await axios.post(generateOcsUrl('/apps/libresign/api/v1/file'), {
+				file: {
+					url: this.pdfUrl,
+				},
+			})
+				.then(({ data }) => {
+					this.filesStore.addFile({
+						nodeId: data.ocs.data.id,
+						name: data.ocs.data.name,
+					})
+					this.filesStore.selectFile(data.ocs.data.id)
+					this.closeModalUploadFromUrl()
+				})
+				.catch(({ response }) => {
+					this.uploadUrlErrors = [response.data.ocs.data.message]
+				})
+			this.loading = false
+		},
+		async upload(file) {
+			try {
+				const { name: original } = file
+
+				const name = original.split('.').slice(0, -1).join('.')
+
+				const data = await loadFileToBase64(file)
+
+				const res = await filesService.uploadFile({ name, file: data })
+
+				this.filesStore.addFile({
+					nodeId: res.id,
+					name: res.name,
+				})
+				this.filesStore.selectFile(res.id)
+				this.cleanErrors()
+			} catch (err) {
+				this.errors = [err.response.data.ocs.data.message]
+			}
+		},
+		uploadFile() {
+			this.loading = true
+			const input = document.createElement('input')
+			input.accept = PDF_MIME_TYPE
+			input.type = 'file'
+
+			input.onchange = async (ev) => {
+				const file = ev.target.files[0]
+
+				if (file) {
+					this.upload(file)
+				}
+
+				input.remove()
+			}
+
+			input.click()
+			this.loading = false
+		},
+		async handleFileChoose(nodes) {
+			const path = nodes[0]?.path
+			if (!path) {
+				return
+			}
+
+			await axios.post(generateOcsUrl('/apps/libresign/api/v1/file'), {
+				file: {
+					path,
+				},
+				name: path.match(/([^/]*?)(?:\.[^.]*)?$/)[1] ?? '',
+			})
+				.then(({ data }) => {
+					this.filesStore.addFile({
+						nodeId: data.ocs.data.id,
+						name: data.ocs.data.name,
+					})
+					this.filesStore.selectFile(data.ocs.data.id)
+					this.cleanErrors()
+				})
+				.catch(({ response }) => {
+					this.errors = [response.data.ocs.data.message]
+					this.loading = false
+				})
+		},
 	},
 }
 </script>
diff --git a/src/views/FilesList/VirtualList.vue b/src/views/FilesList/VirtualList.vue
index 8c3404c72e..e7a9a6c013 100644
--- a/src/views/FilesList/VirtualList.vue
+++ b/src/views/FilesList/VirtualList.vue
@@ -14,7 +14,7 @@
 				:class="userConfigStore.grid_view ? 'files-list__tbody--grid' : 'files-list__tbody--list'"
 				data-cy-files-list-tbody>
 				<component :is="dataComponent"
-					v-for="item in filesStore.files.values()"
+					v-for="item in filesStore.files"
 					:key="item.nodeId"
 					:source="item"
 					:loading="loading" />

From 405e781e3e540e59250751d78c0a235be814ef57 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Sun, 13 Oct 2024 22:12:37 -0300
Subject: [PATCH 18/48] chore: move methods to store

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 .../RightSidebar/RequestSignatureTab.vue      | 48 +++----------------
 src/store/files.js                            | 45 ++++++++++++++++-
 .../FilesList/FileEntry/FileEntryActions.vue  |  6 +--
 src/views/FilesList/VirtualList.vue           |  2 +-
 4 files changed, 54 insertions(+), 47 deletions(-)

diff --git a/src/Components/RightSidebar/RequestSignatureTab.vue b/src/Components/RightSidebar/RequestSignatureTab.vue
index 4bb0a18190..0ec5cb4dea 100644
--- a/src/Components/RightSidebar/RequestSignatureTab.vue
+++ b/src/Components/RightSidebar/RequestSignatureTab.vue
@@ -14,7 +14,7 @@
 			@click="addSigner">
 			{{ t('libresign', 'Add signer') }}
 		</NcButton>
-		<Signers :signers="dataSigners"
+		<Signers :signers="filesStore.signers()"
 			event="libresign:edit-signer">
 			<template #actions="{signer}">
 				<NcActionButton v-if="canSave && !signer.signed"
@@ -26,7 +26,7 @@
 					</template>
 					{{ t('libresign', 'Delete') }}
 				</NcActionButton>
-				<NcActionButton v-if="canRequestSign && !signer.signed && signer.signRequestId && !signer.me"
+				<NcActionButton v-if="filesStore.canRequestSign && !signer.signed && signer.signRequestId && !signer.me"
 					icon="icon-comment"
 					:close-after-click="true"
 					@click="sendNotify(signer)">
@@ -36,7 +36,7 @@
 		</Signers>
 		<div class="action-buttons">
 			<NcButton v-if="canSave"
-				:type="canSign ? 'secondary' : 'primary'"
+				:type="filesStore.canSign() ? 'secondary' : 'primary'"
 				:disabled="hasLoading"
 				@click="save()">
 				<template #icon>
@@ -44,7 +44,7 @@
 				</template>
 				{{ t('libresign', 'Next') }}
 			</NcButton>
-			<NcButton v-if="canSign"
+			<NcButton v-if="filesStore.canSign()"
 				type="primary"
 				:disabled="hasLoading"
 				@click="sign()">
@@ -53,7 +53,7 @@
 				</template>
 				{{ t('libresign', 'Sign') }}
 			</NcButton>
-			<NcButton v-if="canValidate"
+			<NcButton v-if="filesStore.canValidate()"
 				type="primary"
 				@click="validationFile()">
 				{{ t('libresign', 'Validate') }}
@@ -72,11 +72,9 @@
 <script>
 import Delete from 'vue-material-design-icons/Delete.vue'
 
-import { getCurrentUser } from '@nextcloud/auth'
 import axios from '@nextcloud/axios'
 import { showError, showSuccess } from '@nextcloud/dialogs'
 import { emit, subscribe, unsubscribe } from '@nextcloud/event-bus'
-import { loadState } from '@nextcloud/initial-state'
 import { generateOcsUrl } from '@nextcloud/router'
 
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
@@ -122,43 +120,9 @@ export default {
 			hasLoading: false,
 			signerToEdit: {},
 			modalSrc: '',
-			canRequestSign: loadState('libresign', 'can_request_sign', false),
 		}
 	},
 	computed: {
-		canAddSigner() {
-			return this.canRequestSign
-				&& (
-					!Object.hasOwn(this.filesStore.getFile(), 'requested_by')
-					|| this.filesStore.getFile().requested_by.userId === getCurrentUser().uid
-				)
-				&& !this.filesStore.isPartialSigned()
-				&& !this.filesStore.isFullSigned()
-		},
-		canSave() {
-			return this.canRequestSign
-				&& (
-					!Object.hasOwn(this.filesStore.getFile(), 'requested_by')
-					|| this.filesStore.getFile().requested_by.userId === getCurrentUser().uid
-				)
-				&& !this.filesStore.isPartialSigned()
-				&& !this.filesStore.isFullSigned()
-				&& this.filesStore.getFile()?.signers?.length > 0
-		},
-		canSign() {
-			return !this.filesStore.isFullSigned()
-				&& this.filesStore.getFile().status > 0
-				&& this.filesStore.getFile()?.signers?.filter(signer => signer.me).length > 0
-				&& this.filesStore.getFile()?.signers?.filter(signer => signer.me)
-					.filter(signer => signer.signed?.length > 0).length === 0
-		},
-		canValidate() {
-			return this.filesStore.isPartialSigned()
-				|| this.filesStore.isFullSigned()
-		},
-		dataSigners() {
-			return this.filesStore.getFile()?.signers ?? []
-		},
 		hasSigners() {
 			return this.filesStore.hasSigners()
 		},
@@ -241,7 +205,7 @@ export default {
 					users: [],
 				},
 			}
-			this.dataSigners.forEach(signer => {
+			this.filesStore.signers().forEach(signer => {
 				const user = {
 					displayName: signer.displayName,
 					identify: {},
diff --git a/src/store/files.js b/src/store/files.js
index 2826fddde1..202c1509d5 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -6,8 +6,10 @@
 import { defineStore } from 'pinia'
 import { set } from 'vue'
 
+import { getCurrentUser } from '@nextcloud/auth'
 import axios from '@nextcloud/axios'
 import { subscribe } from '@nextcloud/event-bus'
+import { loadState } from '@nextcloud/initial-state'
 import Moment from '@nextcloud/moment'
 import { generateOcsUrl } from '@nextcloud/router'
 
@@ -25,6 +27,7 @@ export const useFilesStore = function(...args) {
 				identifyingSigner: false,
 				loading: false,
 				filterActive: 'all',
+				canRequestSign: loadState('libresign', 'can_request_sign', false),
 			}
 		},
 
@@ -58,6 +61,9 @@ export const useFilesStore = function(...args) {
 			disableIdentifySigner() {
 				this.identifyingSigner = false
 			},
+			signers() {
+				return this.getFile()?.signers ?? []
+			},
 			hasSigners() {
 				if (this.selectedNodeId === 0) {
 					return false
@@ -88,6 +94,43 @@ export const useFilesStore = function(...args) {
 					&& this.files[this.selectedNodeId].signers
 						.filter(signer => signer.signed?.length > 0).length === this.files[this.selectedNodeId].signers.length
 			},
+			canSign() {
+				return !this.isFullSigned()
+				&& this.getFile().status > 0
+				&& this.getFile()?.signers?.filter(signer => signer.me).length > 0
+				&& this.getFile()?.signers?.filter(signer => signer.me)
+					.filter(signer => signer.signed?.length > 0).length === 0
+			},
+			canValidate() {
+				return this.isPartialSigned()
+					|| this.isFullSigned()
+			},
+			canDelete() {
+				return this.canRequestSign
+					&& (
+						!Object.hasOwn(this.getFile(), 'requested_by')
+						|| this.getFile().requested_by.userId === getCurrentUser().uid
+					)
+			},
+			canAddSigner() {
+				return this.canRequestSign
+					&& (
+						!Object.hasOwn(this.getFile(), 'requested_by')
+						|| this.getFile().requested_by.userId === getCurrentUser().uid
+					)
+					&& !this.isPartialSigned()
+					&& !this.isFullSigned()
+			},
+			canSave() {
+				return this.canRequestSign
+					&& (
+						!Object.hasOwn(this.getFile(), 'requested_by')
+						|| this.getFile().requested_by.userId === getCurrentUser().uid
+					)
+					&& !this.isPartialSigned()
+					&& !this.isFullSigned()
+					&& this.getFile()?.signers?.length > 0
+			},
 			getSubtitle() {
 				if (this.selectedNodeId === 0) {
 					return ''
@@ -179,7 +222,7 @@ export const useFilesStore = function(...args) {
 					filter.sortDirection = sortingDirection
 				}
 				const response = await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: filter })
-				this.files = []
+				this.files = {}
 				response.data.ocs.data.data.forEach(file => {
 					this.addFile(file)
 				})
diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index a9724e5ebd..6cd1db2eac 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -80,17 +80,17 @@ export default {
 	mounted() {
 		this.registerAction({
 			id: 'id-teste0',
-			title: 'Validate',
+			title: t('libresign', 'Validate'),
 			iconSvgInline: svgFile,
 		})
 		this.registerAction({
 			id: 'id-teste1',
-			title: 'Sign',
+			title: t('libresign', 'Sign'),
 			iconSvgInline: svgFile,
 		})
 		this.registerAction({
 			id: 'id-teste2',
-			title: 'Delete',
+			title: t('libresign', 'Delete'),
 			iconSvgInline: svgFile,
 		})
 	},
diff --git a/src/views/FilesList/VirtualList.vue b/src/views/FilesList/VirtualList.vue
index e7a9a6c013..1acf4fc1cd 100644
--- a/src/views/FilesList/VirtualList.vue
+++ b/src/views/FilesList/VirtualList.vue
@@ -14,7 +14,7 @@
 				:class="userConfigStore.grid_view ? 'files-list__tbody--grid' : 'files-list__tbody--list'"
 				data-cy-files-list-tbody>
 				<component :is="dataComponent"
-					v-for="item in filesStore.files"
+					v-for="(item) in filesStore.files"
 					:key="item.nodeId"
 					:source="item"
 					:loading="loading" />

From c14e5b054ffdfbf33a7676f5e91f7bc5d1c22765 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Sat, 19 Oct 2024 16:26:00 -0300
Subject: [PATCH 19/48] chore: make sign menu to work

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 .../RightSidebar/RequestSignatureTab.vue      | 12 +--
 src/store/files.js                            | 96 ++++++++++---------
 .../FilesList/FileEntry/FileEntryActions.vue  | 69 +++++++++----
 3 files changed, 108 insertions(+), 69 deletions(-)

diff --git a/src/Components/RightSidebar/RequestSignatureTab.vue b/src/Components/RightSidebar/RequestSignatureTab.vue
index 0ec5cb4dea..9de501c288 100644
--- a/src/Components/RightSidebar/RequestSignatureTab.vue
+++ b/src/Components/RightSidebar/RequestSignatureTab.vue
@@ -9,15 +9,15 @@
 	</div>
 	<div v-else
 		id="request-signature-tab">
-		<NcButton v-if="canAddSigner"
+		<NcButton v-if="filesStore.canAddSigner()"
 			:type="hasSigners ? 'secondary' : 'primary'"
 			@click="addSigner">
 			{{ t('libresign', 'Add signer') }}
 		</NcButton>
-		<Signers :signers="filesStore.signers()"
+		<Signers :signers="filesStore.signers"
 			event="libresign:edit-signer">
 			<template #actions="{signer}">
-				<NcActionButton v-if="canSave && !signer.signed"
+				<NcActionButton v-if="filesStore.canSave() && !signer.signed"
 					aria-label="Delete"
 					:close-after-click="true"
 					@click="filesStore.deleteSigner(signer)">
@@ -35,7 +35,7 @@
 			</template>
 		</Signers>
 		<div class="action-buttons">
-			<NcButton v-if="canSave"
+			<NcButton v-if="filesStore.canSave()"
 				:type="filesStore.canSign() ? 'secondary' : 'primary'"
 				:disabled="hasLoading"
 				@click="save()">
@@ -124,7 +124,7 @@ export default {
 	},
 	computed: {
 		hasSigners() {
-			return this.filesStore.hasSigners()
+			return this.filesStore.hasSigners(this.filesStore.getFile())
 		},
 		fileName() {
 			return this.filesStore.getFile()?.name ?? ''
@@ -205,7 +205,7 @@ export default {
 					users: [],
 				},
 			}
-			this.filesStore.signers().forEach(signer => {
+			(this.filesStore.getFile()?.signers ?? []).forEach(signer => {
 				const user = {
 					displayName: signer.displayName,
 					identify: {},
diff --git a/src/store/files.js b/src/store/files.js
index 202c1509d5..7bc32a6349 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -46,7 +46,10 @@ export const useFilesStore = function(...args) {
 				const sidebarStore = useSidebarStore()
 				sidebarStore.activeRequestSignatureTab()
 			},
-			getFile() {
+			getFile(file) {
+				if (typeof file === 'object') {
+					return file
+				}
 				return this.files[this.selectedNodeId] ?? {}
 			},
 			async flushSelectedFile() {
@@ -61,81 +64,86 @@ export const useFilesStore = function(...args) {
 			disableIdentifySigner() {
 				this.identifyingSigner = false
 			},
-			signers() {
-				return this.getFile()?.signers ?? []
-			},
-			hasSigners() {
+			hasSigners(file) {
+				file = this.getFile(file)
 				if (this.selectedNodeId === 0) {
 					return false
 				}
-				if (!Object.hasOwn(this.getFile(), 'signers')) {
+				if (!Object.hasOwn(file, 'signers')) {
 					return false
 				}
-				return this.files[this.selectedNodeId].signers.length > 0
+				return file.signers.length > 0
 			},
-			isPartialSigned() {
+			isPartialSigned(file) {
+				file = this.getFile(file)
 				if (this.selectedNodeId === 0) {
 					return false
 				}
-				if (!Object.hasOwn(this.getFile(), 'signers')) {
+				if (!Object.hasOwn(file, 'signers')) {
 					return false
 				}
-				return this.files[this.selectedNodeId].signers
+				return file.signers
 					.filter(signer => signer.signed?.length > 0).length > 0
 			},
-			isFullSigned() {
+			isFullSigned(file) {
+				file = this.getFile(file)
 				if (this.selectedNodeId === 0) {
 					return false
 				}
-				if (!Object.hasOwn(this.getFile(), 'signers')) {
+				if (!Object.hasOwn(file, 'signers')) {
 					return false
 				}
-				return this.files[this.selectedNodeId].signers.length > 0
-					&& this.files[this.selectedNodeId].signers
-						.filter(signer => signer.signed?.length > 0).length === this.files[this.selectedNodeId].signers.length
+				return file.signers.length > 0
+					&& file.signers
+						.filter(signer => signer.signed?.length > 0).length === file.signers.length
 			},
-			canSign() {
-				return !this.isFullSigned()
-				&& this.getFile().status > 0
-				&& this.getFile()?.signers?.filter(signer => signer.me).length > 0
-				&& this.getFile()?.signers?.filter(signer => signer.me)
+			canSign(file) {
+				file = this.getFile(file)
+				return !this.isFullSigned(file)
+				&& file.status > 0
+				&& file?.signers?.filter(signer => signer.me).length > 0
+				&& file?.signers?.filter(signer => signer.me)
 					.filter(signer => signer.signed?.length > 0).length === 0
 			},
-			canValidate() {
-				return this.isPartialSigned()
-					|| this.isFullSigned()
+			canValidate(file) {
+				file = this.getFile(file)
+				return this.isPartialSigned(file)
+					|| this.isFullSigned(file)
 			},
-			canDelete() {
+			canDelete(file) {
+				file = this.getFile(file)
 				return this.canRequestSign
 					&& (
-						!Object.hasOwn(this.getFile(), 'requested_by')
-						|| this.getFile().requested_by.userId === getCurrentUser().uid
+						!Object.hasOwn(file, 'requested_by')
+						|| file.requested_by.userId === getCurrentUser().uid
 					)
 			},
-			canAddSigner() {
+			canAddSigner(file) {
+				file = this.getFile(file)
 				return this.canRequestSign
 					&& (
-						!Object.hasOwn(this.getFile(), 'requested_by')
-						|| this.getFile().requested_by.userId === getCurrentUser().uid
+						!Object.hasOwn(file, 'requested_by')
+						|| file.requested_by.userId === getCurrentUser().uid
 					)
-					&& !this.isPartialSigned()
-					&& !this.isFullSigned()
+					&& !this.isPartialSigned(file)
+					&& !this.isFullSigned(file)
 			},
-			canSave() {
+			canSave(file) {
+				file = this.getFile(file)
 				return this.canRequestSign
 					&& (
-						!Object.hasOwn(this.getFile(), 'requested_by')
-						|| this.getFile().requested_by.userId === getCurrentUser().uid
+						!Object.hasOwn(file, 'requested_by')
+						|| file.requested_by.userId === getCurrentUser().uid
 					)
-					&& !this.isPartialSigned()
-					&& !this.isFullSigned()
-					&& this.getFile()?.signers?.length > 0
+					&& !this.isPartialSigned(file)
+					&& !this.isFullSigned(file)
+					&& file?.signers?.length > 0
 			},
 			getSubtitle() {
 				if (this.selectedNodeId === 0) {
 					return ''
 				}
-				const file = this.files[this.selectedNodeId]
+				const file = this.getFile()
 				if ((file?.requested_by?.userId ?? '').length === 0 || file?.request_date.length === 0) {
 					return ''
 				}
@@ -177,17 +185,17 @@ export const useFilesStore = function(...args) {
 			signerUpdate(signer) {
 				this.addIdentifierToSigner(signer)
 				// Remove if already exists
-				for (let i = this.files[this.selectedNodeId].signers.length - 1; i >= 0; i--) {
-					if (this.files[this.selectedNodeId].signers[i].identify === signer.identify) {
-						this.files[this.selectedNodeId].signers.splice(i, 1)
+				for (let i = this.getFile().signers.length - 1; i >= 0; i--) {
+					if (this.getFile().signers[i].identify === signer.identify) {
+						this.getFile().signers.splice(i, 1)
 						break
 					}
-					if (this.files[this.selectedNodeId].signers[i].signRequestId === signer.identify) {
-						this.files[this.selectedNodeId].signers.splice(i, 1)
+					if (this.getFile().signers[i].signRequestId === signer.identify) {
+						this.getFile().signers.splice(i, 1)
 						break
 					}
 				}
-				this.files[this.selectedNodeId].signers.push(signer)
+				this.getFile().signers.push(signer)
 			},
 			async deleteSigner(signer) {
 				if (!isNaN(signer.signRequestId)) {
diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index 6cd1db2eac..84cc27a56a 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -5,7 +5,7 @@
 			:force-name="true"
 			type="tertiary"
 			:open.sync="openedMenu"
-			@close="openedSubmenu = null">
+			@close="openedMenu = null">
 			<!-- Default actions list-->
 			<NcActionButton v-for="action in enabledMenuActions"
 				:key="action.id"
@@ -14,7 +14,8 @@
 					[`files-list__row-action-${action.id}`]: true,
 				}"
 				:aria-label="action.title"
-				:title="action.title">
+				:title="action.title"
+				@click="onActionClick(action)">
 				<template #icon>
 					<NcLoadingIcon v-if="loading === action.id" :size="18" />
 					<NcIconSvgWrapper v-else :svg="action.iconSvgInline" />
@@ -27,6 +28,8 @@
 
 <script>
 import svgFile from '@mdi/svg/svg/file.svg?raw'
+import svgSignature from '@mdi/svg/svg/signature.svg?raw'
+import svgTextBoxCheck from '@mdi/svg/svg/text-box-check.svg?raw'
 
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
@@ -34,6 +37,8 @@ import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js
 import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
 
 import { useActionsMenuStore } from '../../../store/actionsmenu.js'
+import { useFilesStore } from '../../../store/files.js'
+import { useSignStore } from '../../../store/sign.js'
 
 export default {
 	name: 'FileEntryActions',
@@ -59,11 +64,16 @@ export default {
 	},
 	setup() {
 		const actionsMenuStore = useActionsMenuStore()
-		return { actionsMenuStore }
+		const filesStore = useFilesStore()
+		const signStore = useSignStore()
+		return {
+			actionsMenuStore,
+			filesStore,
+			signStore,
+		}
 	},
 	data() {
 		return {
-			openedSubmenu: null,
 			enabledMenuActions: [],
 		}
 	},
@@ -78,23 +88,44 @@ export default {
 		},
 	},
 	mounted() {
-		this.registerAction({
-			id: 'id-teste0',
-			title: t('libresign', 'Validate'),
-			iconSvgInline: svgFile,
-		})
-		this.registerAction({
-			id: 'id-teste1',
-			title: t('libresign', 'Sign'),
-			iconSvgInline: svgFile,
-		})
-		this.registerAction({
-			id: 'id-teste2',
-			title: t('libresign', 'Delete'),
-			iconSvgInline: svgFile,
-		})
+		if (this.filesStore.getFile(this.filesStore.files[this.source.nodeId])) {
+			this.registerAction({
+				id: 'validate',
+				title: t('libresign', 'Validate'),
+				iconSvgInline: svgTextBoxCheck,
+			})
+		}
+		if (this.filesStore.canSign(this.filesStore.files[this.source.nodeId])) {
+			this.registerAction({
+				id: 'sign',
+				title: t('libresign', 'Sign'),
+				iconSvgInline: svgSignature,
+			})
+		}
+		if (this.filesStore.canDelete(this.filesStore.files[this.source.nodeId])) {
+			this.registerAction({
+				id: 'delete',
+				title: t('libresign', 'Delete'),
+				iconSvgInline: svgFile,
+			})
+		}
 	},
 	methods: {
+		async onActionClick(action) {
+			if (action.id === 'sign') {
+				this.openedMenu = null
+				const uuid = this.source.signers
+					.reduce((accumulator, signer) => {
+						if (signer.me) {
+							return signer.sign_uuid
+						}
+						return accumulator
+					}, '')
+				this.signStore.setDocumentToSign(this.source)
+				this.$router.push({ name: 'SignPDF', params: { uuid } })
+				this.filesStore.selectFile(this.source.nodeId)
+			}
+		},
 		registerAction(action) {
 			this.enabledMenuActions = [...this.enabledMenuActions, action]
 		},

From 5e83492b27b8fb0c08df403569b67414b95eb8d9 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Sat, 19 Oct 2024 17:07:50 -0300
Subject: [PATCH 20/48] chore: implement validate

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/views/FilesList/FileEntry/FileEntryActions.vue | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index 84cc27a56a..ea1ef8afb2 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -38,6 +38,7 @@ import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
 
 import { useActionsMenuStore } from '../../../store/actionsmenu.js'
 import { useFilesStore } from '../../../store/files.js'
+import { useSidebarStore } from '../../../store/sidebar.js'
 import { useSignStore } from '../../../store/sign.js'
 
 export default {
@@ -65,10 +66,12 @@ export default {
 	setup() {
 		const actionsMenuStore = useActionsMenuStore()
 		const filesStore = useFilesStore()
+		const sidebarStore = useSidebarStore()
 		const signStore = useSignStore()
 		return {
 			actionsMenuStore,
 			filesStore,
+			sidebarStore,
 			signStore,
 		}
 	},
@@ -112,9 +115,11 @@ export default {
 	},
 	methods: {
 		async onActionClick(action) {
+			const uuid = this.source.uuid
+			this.openedMenu = null
+			this.sidebarStore.hideSidebar()
 			if (action.id === 'sign') {
-				this.openedMenu = null
-				const uuid = this.source.signers
+				this.source.signers
 					.reduce((accumulator, signer) => {
 						if (signer.me) {
 							return signer.sign_uuid
@@ -124,6 +129,8 @@ export default {
 				this.signStore.setDocumentToSign(this.source)
 				this.$router.push({ name: 'SignPDF', params: { uuid } })
 				this.filesStore.selectFile(this.source.nodeId)
+			} else if (action.id === 'validate') {
+				this.$router.push({ name: 'ValidationFile', params: { uuid } })
 			}
 		},
 		registerAction(action) {

From 9a9ff673e3923a829856b4a8a32892dce69cec1c Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Mon, 21 Oct 2024 08:10:52 -0300
Subject: [PATCH 21/48] chore: start to implement delete

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/store/files.js                                 | 9 ++++++++-
 src/views/FilesList/FileEntry/FileEntryActions.vue | 2 ++
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/store/files.js b/src/store/files.js
index 7bc32a6349..ee95730e9d 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -4,7 +4,7 @@
  */
 
 import { defineStore } from 'pinia'
-import { set } from 'vue'
+import { del, set } from 'vue'
 
 import { getCurrentUser } from '@nextcloud/auth'
 import axios from '@nextcloud/axios'
@@ -211,6 +211,13 @@ export const useFilesStore = function(...args) {
 					this.files[this.selectedNodeId].signers.filter((i) => i.identify !== signer.identify),
 				)
 			},
+			async delete(file) {
+				file = this.getFile(file)
+				const response = await axios.delete(generateOcsUrl('/apps/libresign/api/v1/sign/file_id/{fileId}', {
+					fileId: file.nodeId
+				}))
+				del(this.files, file.nodeId)
+			},
 			async getAllFiles(filter) {
 				if (!filter) filter = {}
 				const { chips } = useFiltersStore()
diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index ea1ef8afb2..0c1c81833a 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -131,6 +131,8 @@ export default {
 				this.filesStore.selectFile(this.source.nodeId)
 			} else if (action.id === 'validate') {
 				this.$router.push({ name: 'ValidationFile', params: { uuid } })
+			} else if (action.id === 'delete') {
+				this.filesStore.delete(this.source)
 			}
 		},
 		registerAction(action) {

From d34029aede8746a95ced071eddb82dce5de81a1c Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 24 Oct 2024 07:37:25 -0300
Subject: [PATCH 22/48] fix: prevent to be funcion when isn't

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/Components/RightSidebar/RequestSignatureTab.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Components/RightSidebar/RequestSignatureTab.vue b/src/Components/RightSidebar/RequestSignatureTab.vue
index 9de501c288..b76ee3c36c 100644
--- a/src/Components/RightSidebar/RequestSignatureTab.vue
+++ b/src/Components/RightSidebar/RequestSignatureTab.vue
@@ -204,7 +204,7 @@ export default {
 					name: this.filesStore.getFile()?.name,
 					users: [],
 				},
-			}
+			};
 			(this.filesStore.getFile()?.signers ?? []).forEach(signer => {
 				const user = {
 					displayName: signer.displayName,

From b01976e155e9b38adc0c41ef15707f56ae61d732 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 24 Oct 2024 07:37:42 -0300
Subject: [PATCH 23/48] fix: lint

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/store/files.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/store/files.js b/src/store/files.js
index ee95730e9d..4269c1890d 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -214,7 +214,7 @@ export const useFilesStore = function(...args) {
 			async delete(file) {
 				file = this.getFile(file)
 				const response = await axios.delete(generateOcsUrl('/apps/libresign/api/v1/sign/file_id/{fileId}', {
-					fileId: file.nodeId
+					fileId: file.nodeId,
 				}))
 				del(this.files, file.nodeId)
 			},

From 0d44f7aaa835599f877e24d90e2fe5b7264b9f40 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 24 Oct 2024 07:56:06 -0300
Subject: [PATCH 24/48] chore: confirm before delete

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 .../FilesList/FileEntry/FileEntryActions.vue  | 25 ++++++++++++++++++-
 1 file changed, 24 insertions(+), 1 deletion(-)

diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index 0c1c81833a..4b570672e9 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -23,6 +23,21 @@
 				{{ action.title }}
 			</NcActionButton>
 		</NcActions>
+		<NcDialog v-if="confirmDelete"
+			:name="t('libresign', 'Confirm')"
+			@closing="confirmDelete = false">
+			{{ t('libresign', 'The signature request will be deleted. Do you confirm this action?') }}
+			<template #actions>
+				<NcButton type="error"
+					@click="doDelete()">
+					{{ t('libresign', 'Yes') }}
+				</NcButton>
+				<NcButton type="primary"
+					@click="confirmDelete = false">
+					{{ t('libresign', 'No') }}
+				</NcButton>
+			</template>
+		</NcDialog>
 	</td>
 </template>
 
@@ -33,6 +48,8 @@ import svgTextBoxCheck from '@mdi/svg/svg/text-box-check.svg?raw'
 
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
+import NcDialog from '@nextcloud/vue/dist/Components/NcDialog.js'
 import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
 import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
 
@@ -46,6 +63,8 @@ export default {
 	components: {
 		NcActionButton,
 		NcActions,
+		NcButton,
+		NcDialog,
 		NcIconSvgWrapper,
 		NcLoadingIcon,
 	},
@@ -78,6 +97,7 @@ export default {
 	data() {
 		return {
 			enabledMenuActions: [],
+			confirmDelete: false,
 		}
 	},
 	computed: {
@@ -132,12 +152,15 @@ export default {
 			} else if (action.id === 'validate') {
 				this.$router.push({ name: 'ValidationFile', params: { uuid } })
 			} else if (action.id === 'delete') {
-				this.filesStore.delete(this.source)
+				this.confirmDelete = true
 			}
 		},
 		registerAction(action) {
 			this.enabledMenuActions = [...this.enabledMenuActions, action]
 		},
+		doDelete() {
+			this.filesStore.delete(this.source)
+		},
 	},
 }
 </script>

From 554c18ab9d3edf23d68e3a32c7ba6104ce484ba9 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 24 Oct 2024 08:45:11 -0300
Subject: [PATCH 25/48] chore: indent

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/store/files.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/store/files.js b/src/store/files.js
index 4269c1890d..3e6f5d3d61 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -100,10 +100,10 @@ export const useFilesStore = function(...args) {
 			canSign(file) {
 				file = this.getFile(file)
 				return !this.isFullSigned(file)
-				&& file.status > 0
-				&& file?.signers?.filter(signer => signer.me).length > 0
-				&& file?.signers?.filter(signer => signer.me)
-					.filter(signer => signer.signed?.length > 0).length === 0
+					&& file.status > 0
+					&& file?.signers?.filter(signer => signer.me).length > 0
+					&& file?.signers?.filter(signer => signer.me)
+						.filter(signer => signer.signed?.length > 0).length === 0
 			},
 			canValidate(file) {
 				file = this.getFile(file)

From f5b5b57ee68b134ebff8e2c20ca4d491e85a683c Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 24 Oct 2024 11:18:58 -0300
Subject: [PATCH 26/48] chore: make reactive the conditional to display actions

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 .../FilesList/FileEntry/FileEntryActions.vue  | 63 +++++++++++--------
 1 file changed, 36 insertions(+), 27 deletions(-)

diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index 4b570672e9..d1574fbfe5 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -7,7 +7,7 @@
 			:open.sync="openedMenu"
 			@close="openedMenu = null">
 			<!-- Default actions list-->
-			<NcActionButton v-for="action in enabledMenuActions"
+			<NcActionButton v-for="action in visibleMenu"
 				:key="action.id"
 				:ref="`action-${action.id}`"
 				:class="{
@@ -42,7 +42,7 @@
 </template>
 
 <script>
-import svgFile from '@mdi/svg/svg/file.svg?raw'
+import svgDelete from '@mdi/svg/svg/delete.svg?raw'
 import svgSignature from '@mdi/svg/svg/signature.svg?raw'
 import svgTextBoxCheck from '@mdi/svg/svg/text-box-check.svg?raw'
 
@@ -109,36 +109,45 @@ export default {
 				this.actionsMenuStore.opened = opened ? this.source.nodeId : null
 			},
 		},
+		visibleMenu() {
+			return this.enabledMenuActions.filter(action => this.visibleIf(action.id))
+		},
 	},
 	mounted() {
-		if (this.filesStore.getFile(this.filesStore.files[this.source.nodeId])) {
-			this.registerAction({
-				id: 'validate',
-				title: t('libresign', 'Validate'),
-				iconSvgInline: svgTextBoxCheck,
-			})
-		}
-		if (this.filesStore.canSign(this.filesStore.files[this.source.nodeId])) {
-			this.registerAction({
-				id: 'sign',
-				title: t('libresign', 'Sign'),
-				iconSvgInline: svgSignature,
-			})
-		}
-		if (this.filesStore.canDelete(this.filesStore.files[this.source.nodeId])) {
-			this.registerAction({
-				id: 'delete',
-				title: t('libresign', 'Delete'),
-				iconSvgInline: svgFile,
-			})
-		}
+		this.registerAction({
+			id: 'validate',
+			title: t('libresign', 'Validate'),
+			iconSvgInline: svgTextBoxCheck,
+		})
+		this.registerAction({
+			id: 'sign',
+			title: t('libresign', 'Sign'),
+			iconSvgInline: svgSignature,
+		})
+		this.registerAction({
+			id: 'delete',
+			title: t('libresign', 'Delete'),
+			iconSvgInline: svgDelete,
+		})
 	},
 	methods: {
-		async onActionClick(action) {
+		visibleIf(id) {
+			const file = this.filesStore.files[this.source.nodeId]
+			let visible = false
+			if (id === 'sign') {
+				visible = this.filesStore.canSign(file)
+			} else if (id === 'validate') {
+				visible = this.filesStore.canValidate(file)
+			} else if (id === 'delete') {
+				visible = this.filesStore.canDelete(file)
+			}
+			return visible
+		},
+		async onActionClick(id) {
 			const uuid = this.source.uuid
 			this.openedMenu = null
 			this.sidebarStore.hideSidebar()
-			if (action.id === 'sign') {
+			if (id === 'sign') {
 				this.source.signers
 					.reduce((accumulator, signer) => {
 						if (signer.me) {
@@ -149,9 +158,9 @@ export default {
 				this.signStore.setDocumentToSign(this.source)
 				this.$router.push({ name: 'SignPDF', params: { uuid } })
 				this.filesStore.selectFile(this.source.nodeId)
-			} else if (action.id === 'validate') {
+			} else if (id === 'validate') {
 				this.$router.push({ name: 'ValidationFile', params: { uuid } })
-			} else if (action.id === 'delete') {
+			} else if (id === 'delete') {
 				this.confirmDelete = true
 			}
 		},

From 317fe81f7a167f8ffa58f59538854df91d759709 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 24 Oct 2024 11:56:43 -0300
Subject: [PATCH 27/48] fix: sing from action

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/store/files.js                            |  6 ----
 .../FilesList/FileEntry/FileEntryActions.vue  | 29 ++++++++++---------
 2 files changed, 16 insertions(+), 19 deletions(-)

diff --git a/src/store/files.js b/src/store/files.js
index 3e6f5d3d61..2b9134fc57 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -76,9 +76,6 @@ export const useFilesStore = function(...args) {
 			},
 			isPartialSigned(file) {
 				file = this.getFile(file)
-				if (this.selectedNodeId === 0) {
-					return false
-				}
 				if (!Object.hasOwn(file, 'signers')) {
 					return false
 				}
@@ -87,9 +84,6 @@ export const useFilesStore = function(...args) {
 			},
 			isFullSigned(file) {
 				file = this.getFile(file)
-				if (this.selectedNodeId === 0) {
-					return false
-				}
 				if (!Object.hasOwn(file, 'signers')) {
 					return false
 				}
diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index d1574fbfe5..d49ad6bed5 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -110,7 +110,7 @@ export default {
 			},
 		},
 		visibleMenu() {
-			return this.enabledMenuActions.filter(action => this.visibleIf(action.id))
+			return this.enabledMenuActions.filter(action => this.visibleIf(action))
 		},
 	},
 	mounted() {
@@ -131,24 +131,23 @@ export default {
 		})
 	},
 	methods: {
-		visibleIf(id) {
+		visibleIf(action) {
 			const file = this.filesStore.files[this.source.nodeId]
 			let visible = false
-			if (id === 'sign') {
+			if (action.id === 'sign') {
 				visible = this.filesStore.canSign(file)
-			} else if (id === 'validate') {
+			} else if (action.id === 'validate') {
 				visible = this.filesStore.canValidate(file)
-			} else if (id === 'delete') {
+			} else if (action.id === 'delete') {
 				visible = this.filesStore.canDelete(file)
 			}
 			return visible
 		},
-		async onActionClick(id) {
-			const uuid = this.source.uuid
+		async onActionClick(action) {
 			this.openedMenu = null
 			this.sidebarStore.hideSidebar()
-			if (id === 'sign') {
-				this.source.signers
+			if (action.id === 'sign') {
+				const signer = this.source.signers
 					.reduce((accumulator, signer) => {
 						if (signer.me) {
 							return signer.sign_uuid
@@ -156,11 +155,15 @@ export default {
 						return accumulator
 					}, '')
 				this.signStore.setDocumentToSign(this.source)
-				this.$router.push({ name: 'SignPDF', params: { uuid } })
+				this.$router.push({ name: 'SignPDF', params: {
+					uuid: signer.sign_uui
+				}})
 				this.filesStore.selectFile(this.source.nodeId)
-			} else if (id === 'validate') {
-				this.$router.push({ name: 'ValidationFile', params: { uuid } })
-			} else if (id === 'delete') {
+			} else if (action.id === 'validate') {
+				this.$router.push({ name: 'ValidationFile', params: {
+					uuid: this.source.uuid,
+				} })
+			} else if (action.id === 'delete') {
 				this.confirmDelete = true
 			}
 		},

From 37b1a05e0cb4d3e5243588de0d44df99777c68d2 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 24 Oct 2024 14:21:56 -0300
Subject: [PATCH 28/48] chore: only delete from backend when the file exists at
 LibreSign side

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/store/files.js | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/store/files.js b/src/store/files.js
index 2b9134fc57..d449522a6d 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -207,9 +207,11 @@ export const useFilesStore = function(...args) {
 			},
 			async delete(file) {
 				file = this.getFile(file)
-				const response = await axios.delete(generateOcsUrl('/apps/libresign/api/v1/sign/file_id/{fileId}', {
-					fileId: file.nodeId,
-				}))
+				if (file?.uuid !== undefined) {
+					const response = await axios.delete(generateOcsUrl('/apps/libresign/api/v1/sign/file_id/{fileId}', {
+						fileId: file.nodeId,
+					}))
+				}
 				del(this.files, file.nodeId)
 			},
 			async getAllFiles(filter) {

From ecf7688ff58288130cba4944850954040c0477b9 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 24 Oct 2024 14:55:11 -0300
Subject: [PATCH 29/48] fix: way to get signer uuid

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/views/FilesList/FileEntry/FileEntryActions.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index d49ad6bed5..fbc2f9ecfb 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -147,7 +147,7 @@ export default {
 			this.openedMenu = null
 			this.sidebarStore.hideSidebar()
 			if (action.id === 'sign') {
-				const signer = this.source.signers
+				const sign_uuid = this.source.signers
 					.reduce((accumulator, signer) => {
 						if (signer.me) {
 							return signer.sign_uuid
@@ -156,7 +156,7 @@ export default {
 					}, '')
 				this.signStore.setDocumentToSign(this.source)
 				this.$router.push({ name: 'SignPDF', params: {
-					uuid: signer.sign_uui
+					uuid: sign_uuid
 				}})
 				this.filesStore.selectFile(this.source.nodeId)
 			} else if (action.id === 'validate') {

From 3305ccb96e5e1eab758337fc9ec117c446a270a8 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 24 Oct 2024 16:26:55 -0300
Subject: [PATCH 30/48] feat: implement order

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/store/files.js                  | 11 +++++++++++
 src/views/FilesList/VirtualList.vue |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/store/files.js b/src/store/files.js
index d449522a6d..8b524405d6 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -28,6 +28,7 @@ export const useFilesStore = function(...args) {
 				loading: false,
 				filterActive: 'all',
 				canRequestSign: loadState('libresign', 'can_request_sign', false),
+				ordered: [],
 			}
 		},
 
@@ -35,6 +36,7 @@ export const useFilesStore = function(...args) {
 			addFile(file) {
 				set(this.files, file.nodeId, file)
 				this.hydrateFile(file.nodeId)
+				this.ordered.push(file.nodeId)
 			},
 			selectFile(nodeId) {
 				this.selectedNodeId = nodeId ?? 0
@@ -213,6 +215,11 @@ export const useFilesStore = function(...args) {
 					}))
 				}
 				del(this.files, file.nodeId)
+
+				const index = this.ordered.indexOf(file.nodeId)
+				if (index > -1) {
+					this.ordered.splice(index, 1)
+				}
 			},
 			async getAllFiles(filter) {
 				if (!filter) filter = {}
@@ -234,11 +241,15 @@ export const useFilesStore = function(...args) {
 				}
 				const response = await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: filter })
 				this.files = {}
+				this.ordered = []
 				response.data.ocs.data.data.forEach(file => {
 					this.addFile(file)
 				})
 				return this.files
 			},
+			filesSorted() {
+				return this.ordered.map(key => this.files[key])
+			},
 			filter(type) {
 				this.filterActive = type
 				if (type === 'pending') {
diff --git a/src/views/FilesList/VirtualList.vue b/src/views/FilesList/VirtualList.vue
index 1acf4fc1cd..e3cc011d8c 100644
--- a/src/views/FilesList/VirtualList.vue
+++ b/src/views/FilesList/VirtualList.vue
@@ -14,7 +14,7 @@
 				:class="userConfigStore.grid_view ? 'files-list__tbody--grid' : 'files-list__tbody--list'"
 				data-cy-files-list-tbody>
 				<component :is="dataComponent"
-					v-for="(item) in filesStore.files"
+					v-for="(item) in filesStore.filesSorted()"
 					:key="item.nodeId"
 					:source="item"
 					:loading="loading" />

From c244c758db2fdfe093421613419dbd7bf2457cd9 Mon Sep 17 00:00:00 2001
From: Victor Bianchi <vbianchi@protonmail.com>
Date: Mon, 28 Oct 2024 10:16:23 -0300
Subject: [PATCH 31/48] feat: implement lazy loading of files with pagination

Signed-off-by: Victor Bianchi <vbianchi@protonmail.com>
---
 src/store/files.js                  | 27 ++++++++++++++++++++++++---
 src/views/FilesList/VirtualList.vue | 25 +++++++++++++++++++++++++
 2 files changed, 49 insertions(+), 3 deletions(-)

diff --git a/src/store/files.js b/src/store/files.js
index 8b524405d6..e9ffa2ae1d 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -29,6 +29,10 @@ export const useFilesStore = function(...args) {
 				filterActive: 'all',
 				canRequestSign: loadState('libresign', 'can_request_sign', false),
 				ordered: [],
+				paginationCurrent: '',
+				paginationNext: '',
+				paginationLast: '',
+				paginationLength: '',
 			}
 		},
 
@@ -222,6 +226,7 @@ export const useFilesStore = function(...args) {
 				}
 			},
 			async getAllFiles(filter) {
+				// Build filter params object
 				if (!filter) filter = {}
 				const { chips } = useFiltersStore()
 				if (chips?.status?.length) {
@@ -239,12 +244,28 @@ export const useFilesStore = function(...args) {
 				if (sortingDirection) {
 					filter.sortDirection = sortingDirection
 				}
-				const response = await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: filter })
-				this.files = {}
-				this.ordered = []
+
+				// Build pagination params object
+				const pagination = {}
+				if (this.paginationNext) pagination.page = this.paginationNext
+				if (this.paginationLength) pagination.length = this.paginationNext
+
+				// Call API
+				const response = await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: {...filter, ...pagination} })
+
+				// Update state according to API response
+				if (!this.paginationCurrent) {
+					this.files = {}
+					this.ordered = []
+				}
 				response.data.ocs.data.data.forEach(file => {
 					this.addFile(file)
 				})
+				const currentPaginationParams = new URLSearchParams(response.data.ocs.data.pagination.current.split('?')[1])
+				this.paginationCurrent = currentPaginationParams.get('page')
+				this.paginationLength = currentPaginationParams.get('length')
+				this.paginationNext = new URLSearchParams(response.data.ocs.data.pagination.next.split('?')[1]).get('page')
+				this.paginationLast = new URLSearchParams(response.data.ocs.data.pagination.last.split('?')[1]).get('page')
 				return this.files
 			},
 			filesSorted() {
diff --git a/src/views/FilesList/VirtualList.vue b/src/views/FilesList/VirtualList.vue
index e3cc011d8c..49b51245b5 100644
--- a/src/views/FilesList/VirtualList.vue
+++ b/src/views/FilesList/VirtualList.vue
@@ -47,5 +47,30 @@ export default {
 			userConfigStore,
 		}
 	},
+	data() {
+		return {
+			observer: null,
+		}
+	},
+	mounted() {
+		this.observer = new IntersectionObserver(([entry]) => {
+			if (entry && entry.isIntersecting) {
+				this.filesStore.getAllFiles()
+			}
+		})
+		// Is there a better way to target the last tr element? Maybe something like useRef?
+		if (this.$el.querySelector('table tbody tr:last-child')) {
+			this.observer.observe(this.$el.querySelector('table tbody tr:last-child'))
+		}
+	},
+	beforeDestroy() {
+		if (this.observer) this.observer.disconnect()
+	},
+	updated() {
+		if (this.observer) {
+			this.observer.disconnect()
+			this.observer.observe(this.$el.querySelector('table tbody tr:last-child'))
+		}
+	},
 }
 </script>

From 503856fd7e48dd69a3ea1b529a7375e3d2ca9eba Mon Sep 17 00:00:00 2001
From: Victor Bianchi <vbianchi@protonmail.com>
Date: Thu, 31 Oct 2024 12:06:09 -0300
Subject: [PATCH 32/48] feat: integrate file list filters and pagination query
 params WIP

Signed-off-by: Victor Bianchi <vbianchi@protonmail.com>
---
 lib/Db/AccountFileMapper.php       |  2 +-
 lib/Db/SignRequestMapper.php       |  2 +-
 lib/Helper/Pagination.php          | 36 +++++++++++++++++++++---------
 lib/Service/AccountFileService.php |  4 ++--
 lib/Service/FileService.php        |  4 ++--
 src/store/files.js                 | 18 ++++++---------
 6 files changed, 39 insertions(+), 27 deletions(-)

diff --git a/lib/Db/AccountFileMapper.php b/lib/Db/AccountFileMapper.php
index e811b61bc1..c892be7a07 100644
--- a/lib/Db/AccountFileMapper.php
+++ b/lib/Db/AccountFileMapper.php
@@ -151,7 +151,7 @@ private function getUserAccountFile(array $filter = []): Pagination {
 			$qb->setMaxResults($filter['length']);
 		}
 
-		$pagination = new Pagination($qb);
+		$pagination = new Pagination($qb, $this->urlGenerator);
 		return $pagination;
 	}
 
diff --git a/lib/Db/SignRequestMapper.php b/lib/Db/SignRequestMapper.php
index 61a6c5c321..027dbe5901 100644
--- a/lib/Db/SignRequestMapper.php
+++ b/lib/Db/SignRequestMapper.php
@@ -526,7 +526,7 @@ private function getFilesAssociatedFilesWithMeStmt(
 			return (int)$qb->executeQuery()->fetchOne();
 		};
 
-		$pagination = new Pagination($qb);
+		$pagination = new Pagination($qb, $this->urlGenerator);
 		return $pagination;
 	}
 
diff --git a/lib/Helper/Pagination.php b/lib/Helper/Pagination.php
index 3ed5cf6749..d5a779918c 100644
--- a/lib/Helper/Pagination.php
+++ b/lib/Helper/Pagination.php
@@ -9,14 +9,15 @@
 namespace OCA\Libresign\Helper;
 
 use OCA\Libresign\Db\PagerFantaQueryAdapter;
+use OCP\IURLGenerator;
 use OCP\DB\QueryBuilder\IQueryBuilder;
 use Pagerfanta\Pagerfanta;
 
 class Pagination extends Pagerfanta {
-	/** @var string */
-	private $rootPath;
+	private string $routeName;
 	public function __construct(
 		IQueryBuilder $queryBuilder,
+		private IURLGenerator $urlGenerator,
 	) {
 		$adapter = new PagerFantaQueryAdapter($queryBuilder);
 		parent::__construct($adapter);
@@ -25,20 +26,28 @@ public function __construct(
 	/**
 	 * @return static
 	 */
-	public function setRootPath(string $rootPath = ''): self {
-		$this->rootPath = $rootPath;
+	public function setRouteName(string $routeName = ''): self {
+		$this->routeName = $routeName;
 		return $this;
 	}
 
-	public function getPagination(?int $page, ?int $length): array {
+	public function getPagination(?int $page, ?int $length, array $filter = []): array {
 		$this->setMaxPerPage($length);
 		$pagination['total'] = $this->count();
 		if ($pagination['total'] > $length) {
-			$pagination['current'] = $this->rootPath . '?page=' . $page . '&length=' . $length;
-			$pagination['next'] = $this->hasNextPage()      ? $this->rootPath . '?page=' . $this->getNextPage() . '&length=' . $length : null;
-			$pagination['prev'] = $this->hasPreviousPage()  ? $this->rootPath . '?page=' . $this->getPreviousPage() . '&length=' . $length : null;
-			$pagination['last'] = $this->hasNextPage()      ? $this->rootPath . '?page=' . $this->getNbPages() . '&length=' . $length : null;
-			$pagination['first'] = $this->hasPreviousPage() ? $this->rootPath . '?page=1&length=' . $length : null;
+			$pagination['current'] = $this->linkToRoute($page, $length, $filter);
+			$pagination['next'] = $this->hasNextPage()
+				? $this->linkToRoute($this->getNextPage(), $length, $filter)
+				: null;
+			$pagination['prev'] = $this->hasPreviousPage()
+				? $this->linkToRoute($this->getPreviousPage(), $length, $filter)
+				: null;
+			$pagination['last'] = $this->hasNextPage()
+				? $this->linkToRoute($this->getNbPages(), $length, $filter)
+				: null;
+			$pagination['first'] = $this->hasPreviousPage()
+				? $this->linkToRoute(1, $length, $filter)
+				: null;
 		} else {
 			$pagination['current'] = null;
 			$pagination['next'] = null;
@@ -48,4 +57,11 @@ public function getPagination(?int $page, ?int $length): array {
 		}
 		return $pagination;
 	}
+
+	private function linkToRoute(int $page, int $length, array $filter): string {
+		return $this->urlGenerator->linkToRoute(
+			$this->routeName,
+			array_merge(['page' => $page, 'length' => $length, 'apiVersion' => 'v1'], $filter)
+		);
+	}
 }
diff --git a/lib/Service/AccountFileService.php b/lib/Service/AccountFileService.php
index 48efb4357b..3960195500 100644
--- a/lib/Service/AccountFileService.php
+++ b/lib/Service/AccountFileService.php
@@ -49,10 +49,10 @@ public function accountFileList(array $filter, ?int $page = null, ?int $length =
 		$page = $page ?? 1;
 		$length = $length ?? (int)$this->appConfig->getAppValue('length_of_page', '100');
 		$data = $this->accountFileMapper->accountFileList($filter, $page, $length);
-		$data['pagination']->setRootPath('/file/list');
+		$data['pagination']->setRouteName('ocs.libresign.File.list');
 		return [
 			'data' => $data['data'],
-			'pagination' => $data['pagination']->getPagination($page, $length)
+			'pagination' => $data['pagination']->getPagination($page, $length, $filter)
 		];
 	}
 }
diff --git a/lib/Service/FileService.php b/lib/Service/FileService.php
index da777230ec..57ce58d6cc 100644
--- a/lib/Service/FileService.php
+++ b/lib/Service/FileService.php
@@ -454,10 +454,10 @@ public function listAssociatedFilesOfSignFlow(
 		$visibleElements = $this->signRequestMapper->getVisibleElementsFromSigners($signers);
 		$return['data'] = $this->associateAllAndFormat($this->me, $return['data'], $signers, $identifyMethods, $visibleElements);
 
-		$return['pagination']->setRootPath('/file/list');
+		$return['pagination']->setRouteName('ocs.libresign.File.list');
 		return [
 			'data' => $return['data'],
-			'pagination' => $return['pagination']->getPagination($page, $length)
+			'pagination' => $return['pagination']->getPagination($page, $length, $filter)
 		];
 	}
 
diff --git a/src/store/files.js b/src/store/files.js
index e9ffa2ae1d..4bdef5ae98 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -29,9 +29,9 @@ export const useFilesStore = function(...args) {
 				filterActive: 'all',
 				canRequestSign: loadState('libresign', 'can_request_sign', false),
 				ordered: [],
-				paginationCurrent: '',
-				paginationNext: '',
-				paginationLast: '',
+				paginationCurrentUrl: '',
+				paginationNextUrl: '',
+				paginationLastUrl: '',
 				paginationLength: '',
 			}
 		},
@@ -245,16 +245,12 @@ export const useFilesStore = function(...args) {
 					filter.sortDirection = sortingDirection
 				}
 
-				// Build pagination params object
-				const pagination = {}
-				if (this.paginationNext) pagination.page = this.paginationNext
-				if (this.paginationLength) pagination.length = this.paginationNext
-
 				// Call API
-				const response = await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: {...filter, ...pagination} })
-
+				const response = this.paginationNextUrl
+					? await axios.get(this.paginationNextUrl)
+					: await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: filter })
 				// Update state according to API response
-				if (!this.paginationCurrent) {
+				if (!this.paginationCurrentUrl) {
 					this.files = {}
 					this.ordered = []
 				}

From 37e16f1218114a44259c28681efdc07eac4b45b6 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 12:57:50 -0300
Subject: [PATCH 33/48] fix: prevent infinity loop when use
 IntersectionObserver

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/store/files.js | 63 +++++++++++++++++++++++++++-------------------
 1 file changed, 37 insertions(+), 26 deletions(-)

diff --git a/src/store/files.js b/src/store/files.js
index 4bdef5ae98..2aa178892a 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -29,10 +29,8 @@ export const useFilesStore = function(...args) {
 				filterActive: 'all',
 				canRequestSign: loadState('libresign', 'can_request_sign', false),
 				ordered: [],
-				paginationCurrentUrl: '',
 				paginationNextUrl: '',
-				paginationLastUrl: '',
-				paginationLength: '',
+				loadedAll: false,
 			}
 		},
 
@@ -226,44 +224,57 @@ export const useFilesStore = function(...args) {
 				}
 			},
 			async getAllFiles(filter) {
-				// Build filter params object
-				if (!filter) filter = {}
+				if (this.loading || this.loadedAll) {
+					return this.files
+				}
+				this.loading = true
+				const url = !this.paginationNextUrl
+					? generateOcsUrl('/apps/libresign/api/v1/file/list')
+					: this.paginationNextUrl
+
+				const urlObj = new URL(url)
+				const params = new URLSearchParams(urlObj.search)
+
+				if (filter) {
+					for (const [key, value] of Object.entries(filter)) {
+						params.set(key, value)
+					}
+				}
 				const { chips } = useFiltersStore()
 				if (chips?.status?.length) {
-					filter.status = chips.status.map(c => c.id)
+					params.set('status', chips.status.map(c => c.id))
 				}
 				if (chips?.modified?.length) {
 					const { start, end } = chips.modified[0]
-					filter.start = Math.floor(start / 1000)
-					filter.end = Math.floor(end / 1000)
+					params.set('start', Math.floor(start / 1000))
+					params.set('end', Math.floor(end / 1000))
 				}
 				const { sortingMode, sortingDirection } = useFilesSortingStore()
 				if (sortingMode) {
-					filter.sortBy = sortingMode
+					params.set('sortBy', sortingMode)
 				}
 				if (sortingDirection) {
-					filter.sortDirection = sortingDirection
+					params.set('sortDirection', sortingDirection)
 				}
 
-				// Call API
-				const response = this.paginationNextUrl
-					? await axios.get(this.paginationNextUrl)
-					: await axios.get(generateOcsUrl('/apps/libresign/api/v1/file/list'), { params: filter })
-				// Update state according to API response
-				if (!this.paginationCurrentUrl) {
-					this.files = {}
-					this.ordered = []
-				}
+				urlObj.search = params.toString()
+
+				const response = await axios.get(urlObj.toString())
+				this.paginationNextUrl = response.data.ocs.data.pagination.next
+				this.loadedAll = !this.paginationNextUrl
+				this.files = {}
+				this.ordered = []
 				response.data.ocs.data.data.forEach(file => {
 					this.addFile(file)
 				})
-				const currentPaginationParams = new URLSearchParams(response.data.ocs.data.pagination.current.split('?')[1])
-				this.paginationCurrent = currentPaginationParams.get('page')
-				this.paginationLength = currentPaginationParams.get('length')
-				this.paginationNext = new URLSearchParams(response.data.ocs.data.pagination.next.split('?')[1]).get('page')
-				this.paginationLast = new URLSearchParams(response.data.ocs.data.pagination.last.split('?')[1]).get('page')
+				this.loading = false
 				return this.files
 			},
+			async updateAllFiles() {
+				this.paginationNext = null
+				this.loadedAll = false
+				return this.getAllFiles()
+			},
 			filesSorted() {
 				return this.ordered.map(key => this.files[key])
 			},
@@ -291,8 +302,8 @@ export const useFilesStore = function(...args) {
 
 	// Make sure we only register the listeners once
 	if (!filesStore._initialized) {
-		subscribe('libresign:filters:update', filesStore.getAllFiles)
-		subscribe('libresign:sorting:update', filesStore.getAllFiles)
+		subscribe('libresign:filters:update', filesStore.updateAllFiles)
+		subscribe('libresign:sorting:update', filesStore.updateAllFiles)
 		filesStore._initialized = true
 	}
 

From 8fc7b64ad0cf9a0de71db4e8edd9ebf3591cec9c Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 12:58:32 -0300
Subject: [PATCH 34/48] fix: linter

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/store/files.js                            |  2 +-
 .../FilesList/FileEntry/FileEntryActions.vue  | 20 ++++++++++++-------
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/src/store/files.js b/src/store/files.js
index 2aa178892a..bfa21dbc3d 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -212,7 +212,7 @@ export const useFilesStore = function(...args) {
 			async delete(file) {
 				file = this.getFile(file)
 				if (file?.uuid !== undefined) {
-					const response = await axios.delete(generateOcsUrl('/apps/libresign/api/v1/sign/file_id/{fileId}', {
+					await axios.delete(generateOcsUrl('/apps/libresign/api/v1/sign/file_id/{fileId}', {
 						fileId: file.nodeId,
 					}))
 				}
diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index fbc2f9ecfb..7258328636 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -147,7 +147,7 @@ export default {
 			this.openedMenu = null
 			this.sidebarStore.hideSidebar()
 			if (action.id === 'sign') {
-				const sign_uuid = this.source.signers
+				const signUuid = this.source.signers
 					.reduce((accumulator, signer) => {
 						if (signer.me) {
 							return signer.sign_uuid
@@ -155,14 +155,20 @@ export default {
 						return accumulator
 					}, '')
 				this.signStore.setDocumentToSign(this.source)
-				this.$router.push({ name: 'SignPDF', params: {
-					uuid: sign_uuid
-				}})
+				this.$router.push({
+					name: 'SignPDF',
+					params: {
+						uuid: signUuid,
+					},
+				})
 				this.filesStore.selectFile(this.source.nodeId)
 			} else if (action.id === 'validate') {
-				this.$router.push({ name: 'ValidationFile', params: {
-					uuid: this.source.uuid,
-				} })
+				this.$router.push({
+					name: 'ValidationFile',
+					params: {
+						uuid: this.source.uuid,
+					},
+				})
 			} else if (action.id === 'delete') {
 				this.confirmDelete = true
 			}

From f53d524db2b3670433a376de665d893e390ea70f Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 13:04:08 -0300
Subject: [PATCH 35/48] chore: remove timeline

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/Components/LeftSidebar/LeftSidebar.vue |  10 +-
 src/router/router.js                       |   5 -
 src/store/files.js                         |  18 ---
 src/views/Timeline/Timeline.vue            | 150 ---------------------
 4 files changed, 1 insertion(+), 182 deletions(-)
 delete mode 100644 src/views/Timeline/Timeline.vue

diff --git a/src/Components/LeftSidebar/LeftSidebar.vue b/src/Components/LeftSidebar/LeftSidebar.vue
index 9b24041108..c97059d599 100644
--- a/src/Components/LeftSidebar/LeftSidebar.vue
+++ b/src/Components/LeftSidebar/LeftSidebar.vue
@@ -15,17 +15,9 @@
 					<FileSignIcon :size="20" />
 				</template>
 			</NcAppNavigationItem>
-			<NcAppNavigationItem id="timeline"
-				:to="{ name: 'timeline' }"
-				:name="t('libresign', 'Files')"
-				@click="unselectFile">
-				<template #icon>
-					<FolderIcon :size="20" />
-				</template>
-			</NcAppNavigationItem>
 			<NcAppNavigationItem id="fileslist"
 				:to="{ name: 'fileslist' }"
-				:name="t('libresign', 'New files')"
+				:name="t('libresign', 'Files')"
 				@click="unselectFile">
 				<template #icon>
 					<FolderIcon :size="20" />
diff --git a/src/router/router.js b/src/router/router.js
index bec603b178..ca66b65f8c 100644
--- a/src/router/router.js
+++ b/src/router/router.js
@@ -136,11 +136,6 @@ const router = new Router({
 			component: () => import('../views/Validation.vue'),
 			props: true,
 		},
-		{
-			path: '/f/timeline/sign',
-			name: 'timeline',
-			component: () => import('../views/Timeline/Timeline.vue'),
-		},
 		{
 			path: '/f/filelist/sign',
 			name: 'fileslist',
diff --git a/src/store/files.js b/src/store/files.js
index bfa21dbc3d..5514c9586a 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -26,7 +26,6 @@ export const useFilesStore = function(...args) {
 				selectedNodeId: 0,
 				identifyingSigner: false,
 				loading: false,
-				filterActive: 'all',
 				canRequestSign: loadState('libresign', 'can_request_sign', false),
 				ordered: [],
 				paginationNextUrl: '',
@@ -278,23 +277,6 @@ export const useFilesStore = function(...args) {
 			filesSorted() {
 				return this.ordered.map(key => this.files[key])
 			},
-			filter(type) {
-				this.filterActive = type
-				if (type === 'pending') {
-					return Object.values(this.files).filter(
-						(a) => (a.status === 1 || a.status === 2)).sort(
-						(a, b) => (a.request_date < b.request_date) ? 1 : -1)
-				}
-				if (type === 'signed') {
-					return Object.values(this.files).filter(
-						(a) => (a.status === 3)).sort(
-						(a, b) => (a.request_date < b.request_date) ? 1 : -1)
-				}
-				if (type === 'all') {
-					this.filterActive = 'all'
-					return Object.values(this.files).sort((a, b) => (a.request_date < b.request_date) ? 1 : -1)
-				}
-			},
 		},
 	})
 
diff --git a/src/views/Timeline/Timeline.vue b/src/views/Timeline/Timeline.vue
deleted file mode 100644
index 3a4617e26d..0000000000
--- a/src/views/Timeline/Timeline.vue
+++ /dev/null
@@ -1,150 +0,0 @@
-<!--
-  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
-  - SPDX-License-Identifier: AGPL-3.0-or-later
--->
-<template>
-	<div class="container-timeline">
-		<div class="content-timeline">
-			<TopBar :sidebar-toggle="true">
-				<template #filter>
-					<div class="filtered">
-						<a :class="filesStore.filterActive === 'all' ? 'allFiles active' : 'allFiles'" @click="changeFilter('all')">
-							{{ t('libresign', 'All Files') }}
-						</a>
-						<a :class="filesStore.filterActive === 'pending' ? 'pending active': 'pending'" @click="changeFilter('pending')">
-							{{ t('libresign', 'Pending') }}
-						</a>
-						<a :class="filesStore.filterActive === 'signed' ? 'signed active' : 'signed'" @click="changeFilter('signed')">
-							{{ t('libresign', 'Signed') }}
-						</a>
-					</div>
-				</template>
-			</TopBar>
-			<ul v-if="emptyContentFile ===false">
-				<File v-for="file in fileList"
-					:key="file.nodeId"
-					:node-id="file.nodeId"
-					:class="{'file-details': true, 'active': file.nodeId === filesStore.file?.file?.nodeId}" />
-			</ul>
-			<NcEmptyContent v-else
-				:name="t('libresign', 'There are no documents')">
-				<template #icon>
-					<FolderIcon />
-				</template>
-			</NcEmptyContent>
-		</div>
-	</div>
-</template>
-
-<script>
-import FolderIcon from 'vue-material-design-icons/Folder.vue'
-
-import NcEmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent.js'
-
-import File from '../../Components/File/File.vue'
-import TopBar from '../../Components/TopBar/TopBar.vue'
-
-import { useFilesStore } from '../../store/files.js'
-
-export default {
-	name: 'Timeline',
-	components: {
-		TopBar,
-		File,
-		NcEmptyContent,
-		FolderIcon,
-	},
-	setup() {
-		const filesStore = useFilesStore()
-		return { filesStore }
-	},
-	data() {
-		return {
-			loading: false,
-			filesFiltered: [],
-		}
-	},
-	computed: {
-		fileList: {
-			get() {
-				return this.filesFiltered.slice().sort(
-					(a, b) => (a.request_date < b.request_date) ? 1 : -1,
-				)
-			},
-			set(value) {
-				this.filesFiltered = value
-			},
-		},
-		emptyContentFile() {
-			return this.fileList.length <= 0
-		},
-	},
-	async created() {
-		await this.filesStore.getAllFiles()
-		this.changeFilter('all')
-	},
-	methods: {
-		changeFilter(type) {
-			this.fileList = this.filesStore.filter(type)
-		},
-	},
-}
-</script>
-
-<style lang="scss" scoped>
-.container-timeline{
-	display: flex;
-	width: 100%;
-	justify-content: center;
-	flex-direction: row;
-
-	.content-timeline{
-		display: flex;
-		width: 100%;
-		flex-direction: column;
-
-		.filtered {
-			display: flex;
-			justify-content: flex-end;
-			padding: 5px;
-
-			a {
-				padding: 6px;
-				background: rgba(206, 206, 206, 0.3);
-			}
-
-			.signed{
-				border-radius: 0 10px 10px 0;
-			}
-
-			.allFiles{
-				border-radius: 10px 0 0 10px;
-			}
-
-			.active {
-				background: darken(rgba(206, 206, 206, 0.3), 20%)
-			}
-		}
-
-		.active {
-			// WCAG AA compliant
-			background-color: var(--color-background-hover);
-			// text-maxcontrast have been designed to pass WCAG AA over
-			// a white background, we need to adjust then.
-			--color-text-maxcontrast: var(--color-main-text);
-			> * {
-				--color-border: var(--color-border-dark);
-			}
-			& {
-				border-radius: 10px;
-			}
-		}
-
-		ul{
-			display: flex;
-			width: 100%;
-			flex-wrap: wrap;
-		}
-	}
-}
-</style>

From ddac8cf4a3a1fc16f62c39e52d0f64dd77c6f2e5 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 13:10:26 -0300
Subject: [PATCH 36/48] chore: phpcs fix

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 lib/Helper/Pagination.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/Helper/Pagination.php b/lib/Helper/Pagination.php
index d5a779918c..96d17ffe8a 100644
--- a/lib/Helper/Pagination.php
+++ b/lib/Helper/Pagination.php
@@ -9,8 +9,8 @@
 namespace OCA\Libresign\Helper;
 
 use OCA\Libresign\Db\PagerFantaQueryAdapter;
-use OCP\IURLGenerator;
 use OCP\DB\QueryBuilder\IQueryBuilder;
+use OCP\IURLGenerator;
 use Pagerfanta\Pagerfanta;
 
 class Pagination extends Pagerfanta {

From 7b20f2ca1e1be949c407aa34e1261df6698ae1df Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 13:50:31 -0300
Subject: [PATCH 37/48] fix: SPDX

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/views/FilesList/FileEntry/FileEntry.vue                  | 1 -
 src/views/FilesList/FileEntry/FileEntryActions.vue           | 4 ++++
 src/views/FilesList/FileEntry/FileEntryGrid.vue              | 1 -
 src/views/FilesList/FileEntry/FileEntryMixin.js              | 5 +++++
 src/views/FilesList/FileEntry/FileEntryName.vue              | 4 ++++
 src/views/FilesList/FileEntry/FileEntryPreview.vue           | 4 ++++
 src/views/FilesList/FileEntry/FileEntryStatus.vue            | 4 ++++
 src/views/FilesList/FileListFilter/FileListFilter.vue        | 4 ++++
 .../FilesList/FileListFilter/FileListFilterModified.vue      | 4 ++++
 src/views/FilesList/FileListFilter/FileListFilterStatus.vue  | 4 ++++
 src/views/FilesList/FileListFilters.vue                      | 4 ++++
 src/views/FilesList/FilesList.vue                            | 4 ++++
 src/views/FilesList/FilesListVirtual.vue                     | 4 ++++
 src/views/FilesList/VirtualList.vue                          | 4 ++++
 14 files changed, 49 insertions(+), 2 deletions(-)

diff --git a/src/views/FilesList/FileEntry/FileEntry.vue b/src/views/FilesList/FileEntry/FileEntry.vue
index 540c9b7b89..dc7512ba02 100644
--- a/src/views/FilesList/FileEntry/FileEntry.vue
+++ b/src/views/FilesList/FileEntry/FileEntry.vue
@@ -2,7 +2,6 @@
   - SPDX-FileCopyrightText: 2024 LibreCode coop and contributors
   - SPDX-License-Identifier: AGPL-3.0-or-later
 -->
-
 <template>
 	<tr class="files-list__row"
 		@contextmenu="onRightClick">
diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index 7258328636..6804ee45e6 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -1,3 +1,7 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
 <template>
 	<td class="files-list__row-actions">
 		<!-- Menu actions -->
diff --git a/src/views/FilesList/FileEntry/FileEntryGrid.vue b/src/views/FilesList/FileEntry/FileEntryGrid.vue
index 951f4e2b61..e810debe8f 100644
--- a/src/views/FilesList/FileEntry/FileEntryGrid.vue
+++ b/src/views/FilesList/FileEntry/FileEntryGrid.vue
@@ -2,7 +2,6 @@
   - SPDX-FileCopyrightText: 2024 LibreCode coop and contributors
   - SPDX-License-Identifier: AGPL-3.0-or-later
 -->
-
 <template>
 	<tr class="files-list__row"
 		@contextmenu="onRightClick">
diff --git a/src/views/FilesList/FileEntry/FileEntryMixin.js b/src/views/FilesList/FileEntry/FileEntryMixin.js
index 5eb1f78272..8cbcbd6985 100644
--- a/src/views/FilesList/FileEntry/FileEntryMixin.js
+++ b/src/views/FilesList/FileEntry/FileEntryMixin.js
@@ -1,3 +1,8 @@
+/**
+ * SPDX-FileCopyrightText: 2021 LibreCode coop and LibreCode contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
 export default {
 	props: {
 		source: {
diff --git a/src/views/FilesList/FileEntry/FileEntryName.vue b/src/views/FilesList/FileEntry/FileEntryName.vue
index 578a82f54e..bb2ddc4baa 100644
--- a/src/views/FilesList/FileEntry/FileEntryName.vue
+++ b/src/views/FilesList/FileEntry/FileEntryName.vue
@@ -1,3 +1,7 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
 <template>
 	<component :is="linkTo.is"
 		ref="basename"
diff --git a/src/views/FilesList/FileEntry/FileEntryPreview.vue b/src/views/FilesList/FileEntry/FileEntryPreview.vue
index 5ea56f7725..d9774d7820 100644
--- a/src/views/FilesList/FileEntry/FileEntryPreview.vue
+++ b/src/views/FilesList/FileEntry/FileEntryPreview.vue
@@ -1,3 +1,7 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
 <template>
 	<span class="files-list__row-icon">
 		<!-- Decorative images, should not be aria documented -->
diff --git a/src/views/FilesList/FileEntry/FileEntryStatus.vue b/src/views/FilesList/FileEntry/FileEntryStatus.vue
index 88a4ed6c66..349a445df1 100644
--- a/src/views/FilesList/FileEntry/FileEntryStatus.vue
+++ b/src/views/FilesList/FileEntry/FileEntryStatus.vue
@@ -1,3 +1,7 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
 <template>
 	<div class="enDot">
 		<div :class="statusText !== 'none' ? 'dot ' + statusToClass(status) : '' "
diff --git a/src/views/FilesList/FileListFilter/FileListFilter.vue b/src/views/FilesList/FileListFilter/FileListFilter.vue
index d235074b5e..9fe6ecd121 100644
--- a/src/views/FilesList/FileListFilter/FileListFilter.vue
+++ b/src/views/FilesList/FileListFilter/FileListFilter.vue
@@ -1,3 +1,7 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
 <template>
 	<NcActions force-menu
 		:type="isActive ? 'secondary' : 'tertiary'"
diff --git a/src/views/FilesList/FileListFilter/FileListFilterModified.vue b/src/views/FilesList/FileListFilter/FileListFilterModified.vue
index 1ec88dd242..2c6ef22cd3 100644
--- a/src/views/FilesList/FileListFilter/FileListFilterModified.vue
+++ b/src/views/FilesList/FileListFilter/FileListFilterModified.vue
@@ -1,3 +1,7 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
 <template>
 	<FileListFilter :is-active="isActive"
 		:filter-name="t('libresign', 'Modified')"
diff --git a/src/views/FilesList/FileListFilter/FileListFilterStatus.vue b/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
index 6af5c717ce..9e386ac571 100644
--- a/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
+++ b/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
@@ -1,3 +1,7 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
 <template>
 	<FileListFilter class="file-list-filter-status"
 		:is-active="isActive"
diff --git a/src/views/FilesList/FileListFilters.vue b/src/views/FilesList/FileListFilters.vue
index 1f24a1420f..4dab95821a 100644
--- a/src/views/FilesList/FileListFilters.vue
+++ b/src/views/FilesList/FileListFilters.vue
@@ -1,3 +1,7 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
 <template>
 	<div class="file-list-filters">
 		<div class="file-list-filters__filter">
diff --git a/src/views/FilesList/FilesList.vue b/src/views/FilesList/FilesList.vue
index f527c5f974..9fa200a825 100644
--- a/src/views/FilesList/FilesList.vue
+++ b/src/views/FilesList/FilesList.vue
@@ -1,3 +1,7 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
 <template>
 	<NcAppContent :page-heading="t('libresign', 'Files')">
 		<div class="files-list__header">
diff --git a/src/views/FilesList/FilesListVirtual.vue b/src/views/FilesList/FilesListVirtual.vue
index e4a53adb31..6d13924bc1 100644
--- a/src/views/FilesList/FilesListVirtual.vue
+++ b/src/views/FilesList/FilesListVirtual.vue
@@ -1,3 +1,7 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
 <template>
 	<VirtualList :data-component="userConfigStore.grid_view ? FileEntryGrid : FileEntry"
 		:loading="loading">
diff --git a/src/views/FilesList/VirtualList.vue b/src/views/FilesList/VirtualList.vue
index 49b51245b5..e42b5ac773 100644
--- a/src/views/FilesList/VirtualList.vue
+++ b/src/views/FilesList/VirtualList.vue
@@ -1,3 +1,7 @@
+<!--
+  - SPDX-FileCopyrightText: 2024 LibreCode coop and LibreCode contributors
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
 <template>
 	<div class="files-list">
 		<div class="files-list__filters">

From a070a09d18f0d2113ddf2333ec07df3b7fa3af1e Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 14:04:54 -0300
Subject: [PATCH 38/48] fix: prevent add duplicated element to array

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/store/files.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/store/files.js b/src/store/files.js
index 5514c9586a..b15d6a7ee3 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -37,7 +37,9 @@ export const useFilesStore = function(...args) {
 			addFile(file) {
 				set(this.files, file.nodeId, file)
 				this.hydrateFile(file.nodeId)
-				this.ordered.push(file.nodeId)
+				if (!this.ordered.includes(file.nodeId)) {
+					this.ordered.push(file.nodeId)
+				}
 			},
 			selectFile(nodeId) {
 				this.selectedNodeId = nodeId ?? 0

From 8a013ced564a6150bd8e25054ad3ec5a48e337e1 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 14:28:37 -0300
Subject: [PATCH 39/48] fix: copy pdfworker to LibreSign

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 package-lock.json | 237 +++++++++++++++++++---------------------------
 package.json      |   1 +
 webpack.config.js |  11 +++
 3 files changed, 110 insertions(+), 139 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index a88882e417..e5f1e4af7e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -28,6 +28,7 @@
         "@nextcloud/router": "^3.0.1",
         "@nextcloud/vue": "^8.19.0",
         "blueimp-md5": "^2.19.0",
+        "copy-webpack-plugin": "^12.0.2",
         "crypto-js": "^4.2.0",
         "js-confetti": "^0.12.0",
         "pinia": "^2.2.6",
@@ -2508,7 +2509,6 @@
       "version": "0.3.5",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz",
       "integrity": "sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/set-array": "^1.2.1",
@@ -2523,7 +2523,6 @@
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
       "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.0.0"
@@ -2533,7 +2532,6 @@
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
       "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.0.0"
@@ -2543,7 +2541,6 @@
       "version": "0.3.6",
       "resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.6.tgz",
       "integrity": "sha512-1ZJTZebgqllO79ue2bm3rIGud/bOe0pP5BjSRCRxxYkEZS8STV7zN84UBbiYu7jy+eCKSnVIUgoWWE/tt+shMQ==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -2555,14 +2552,12 @@
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
       "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/@jridgewell/trace-mapping": {
       "version": "0.3.25",
       "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
       "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/resolve-uri": "^3.1.0",
@@ -3321,9 +3316,7 @@
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
       "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@nodelib/fs.stat": "2.0.5",
         "run-parallel": "^1.1.9"
@@ -3336,9 +3329,7 @@
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz",
       "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">= 8"
       }
@@ -3347,9 +3338,7 @@
       "version": "1.2.8",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz",
       "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@nodelib/fs.scandir": "2.1.5",
         "fastq": "^1.6.0"
@@ -3832,6 +3821,18 @@
       "license": "MIT",
       "peer": true
     },
+    "node_modules/@sindresorhus/merge-streams": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@sindresorhus/merge-streams/-/merge-streams-2.3.0.tgz",
+      "integrity": "sha512-LtoMMhxAlorcGhmFYI+LhPgbPZCkgP6ra1YL604EeF6U98pLlQ3iWIGMdWSC+vWmPBWBNgmDBAhnAobLROJmwg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/@swc/helpers": {
       "version": "0.3.17",
       "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.3.17.tgz",
@@ -3915,7 +3916,6 @@
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz",
       "integrity": "sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -4002,9 +4002,7 @@
       "version": "7.0.15",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
       "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==",
-      "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/@types/json5": {
       "version": "0.0.29",
@@ -4723,7 +4721,6 @@
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.12.1.tgz",
       "integrity": "sha512-EKfMUOPRRUTy5UII4qJDGPpqfwjOmZ5jeGFwid9mnoqIFK+e0vqoi1qH56JpmZSzEL53jKnNzScdmftJyG5xWg==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -4735,7 +4732,6 @@
       "version": "1.11.6",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.11.6.tgz",
       "integrity": "sha512-ejAj9hfRJ2XMsNHk/v6Fu2dGS+i4UaXBXGemOfQ/JfQ6mdQg/WXtwleQRLLS4OvfDhv8rYnVwH27YJLMyYsxhw==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -4743,7 +4739,6 @@
       "version": "1.11.6",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-api-error/-/helper-api-error-1.11.6.tgz",
       "integrity": "sha512-o0YkoP4pVu4rN8aTJgAyj9hC2Sv5UlkzCHhxqWj8butaLvnpdc2jOwh4ewE6CX0txSfLn/UYaV/pheS2Txg//Q==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -4751,7 +4746,6 @@
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-buffer/-/helper-buffer-1.12.1.tgz",
       "integrity": "sha512-nzJwQw99DNDKr9BVCOZcLuJJUlqkJh+kVzVl6Fmq/tI5ZtEyWT1KZMyOXltXLZJmDtvLCDgwsyrkohEtopTXCw==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -4759,7 +4753,6 @@
       "version": "1.11.6",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-numbers/-/helper-numbers-1.11.6.tgz",
       "integrity": "sha512-vUIhZ8LZoIWHBohiEObxVm6hwP034jwmc9kuq5GdHZH0wiLVLIPcMCdpJzG4C11cHoQ25TFIQj9kaVADVX7N3g==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -4772,7 +4765,6 @@
       "version": "1.11.6",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.11.6.tgz",
       "integrity": "sha512-sFFHKwcmBprO9e7Icf0+gddyWYDViL8bpPjJJl0WHxCdETktXdmtWLGVzoHbqUcY4Be1LkNfwTmXOJUFZYSJdA==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -4780,7 +4772,6 @@
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.12.1.tgz",
       "integrity": "sha512-Jif4vfB6FJlUlSbgEMHUyk1j234GTNG9dBJ4XJdOySoj518Xj0oGsNi59cUQF4RRMS9ouBUxDDdyBVfPTypa5g==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -4794,7 +4785,6 @@
       "version": "1.11.6",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/ieee754/-/ieee754-1.11.6.tgz",
       "integrity": "sha512-LM4p2csPNvbij6U1f19v6WR56QZ8JcHg3QIJTlSwzFcmx6WSORicYj6I63f9yU1kEUtrpG+kjkiIAkevHpDXrg==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -4805,7 +4795,6 @@
       "version": "1.11.6",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/leb128/-/leb128-1.11.6.tgz",
       "integrity": "sha512-m7a0FhE67DQXgouf1tbN5XQcdWoNgaAuoULHIfGFIEVKA6tu/edls6XnIlkmS6FrXAquJRPni3ZZKjw6FSPjPQ==",
-      "dev": true,
       "license": "Apache-2.0",
       "peer": true,
       "dependencies": {
@@ -4816,7 +4805,6 @@
       "version": "1.11.6",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/utf8/-/utf8-1.11.6.tgz",
       "integrity": "sha512-vtXf2wTQ3+up9Zsg8sa2yWiQpzSsMyXj0qViVP6xKGCUT8p8YJ6HqI7l5eCnWx1T/FYdsv07HQs2wTFbbof/RA==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -4824,7 +4812,6 @@
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-edit/-/wasm-edit-1.12.1.tgz",
       "integrity": "sha512-1DuwbVvADvS5mGnXbE+c9NfA8QRcZ6iKquqjjmR10k6o+zzsRVesil54DKexiowcFCPdr/Q0qaMgB01+SQ1u6g==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -4842,7 +4829,6 @@
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-gen/-/wasm-gen-1.12.1.tgz",
       "integrity": "sha512-TDq4Ojh9fcohAw6OIMXqiIcTq5KUXTGRkVxbSo1hQnSy6lAM5GSdfwWeSxpAo0YzgsgF182E/U0mDNhuA0tW7w==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -4857,7 +4843,6 @@
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-opt/-/wasm-opt-1.12.1.tgz",
       "integrity": "sha512-Jg99j/2gG2iaz3hijw857AVYekZe2SAskcqlWIZXjji5WStnOpVoat3gQfT/Q5tb2djnCjBtMocY/Su1GfxPBg==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -4871,7 +4856,6 @@
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-parser/-/wasm-parser-1.12.1.tgz",
       "integrity": "sha512-xikIi7c2FHXysxXe3COrVUPSheuBtpcfhbpFj4gmu7KRLYOzANztwUU0IbsqvMqzuNK2+glRGWCEqZo1WCLyAQ==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -4887,7 +4871,6 @@
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/wast-printer/-/wast-printer-1.12.1.tgz",
       "integrity": "sha512-+X4WAlOisVWQMikjbcvY2e0rwPsKQ9F688lksZhBcPycBBuii3O7m8FACbDMWDojpAqvjIncrG8J0XHKyQfVeA==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -4949,7 +4932,6 @@
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
       "integrity": "sha512-DX8nKgqcGwsc0eJSqYt5lwP4DH5FlHnmuWWBRy7X0NcaGR0ZtuyeESgMwTYVEtxmsNGY+qit4QYT/MIYTOTPeA==",
-      "dev": true,
       "license": "BSD-3-Clause",
       "peer": true
     },
@@ -4957,7 +4939,6 @@
       "version": "4.2.2",
       "resolved": "https://registry.npmjs.org/@xtuc/long/-/long-4.2.2.tgz",
       "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==",
-      "dev": true,
       "license": "Apache-2.0",
       "peer": true
     },
@@ -5001,7 +4982,6 @@
       "version": "8.14.0",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.14.0.tgz",
       "integrity": "sha512-cl669nCJTZBsL97OF4kUQm5g5hC2uihk0NxY3WENAC0TYdILVkAyHymAntgxGkl7K+t0cXIrH5siy5S4XkFycA==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "bin": {
@@ -5015,7 +4995,6 @@
       "version": "1.9.5",
       "resolved": "https://registry.npmjs.org/acorn-import-attributes/-/acorn-import-attributes-1.9.5.tgz",
       "integrity": "sha512-n02Vykv5uA3eHGM/Z2dQrcD56kL8TyDb2p1+0P83PClMnC/nc+anbQRhIOWnSq4Ke/KvDPrY3C9hDtC/A3eHnQ==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "peerDependencies": {
@@ -5050,7 +5029,6 @@
       "version": "6.12.6",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
       "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -5068,9 +5046,7 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-2.1.1.tgz",
       "integrity": "sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "ajv": "^8.0.0"
       },
@@ -5087,9 +5063,7 @@
       "version": "8.17.1",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
       "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.3",
         "fast-uri": "^3.0.1",
@@ -5105,15 +5079,12 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
       "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
-      "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/ajv-keywords": {
       "version": "3.5.2",
       "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz",
       "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "peerDependencies": {
@@ -5735,9 +5706,7 @@
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
       "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "fill-range": "^7.1.1"
       },
@@ -5911,7 +5880,6 @@
       "version": "4.24.2",
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.24.2.tgz",
       "integrity": "sha512-ZIc+Q62revdMcqC6aChtW4jz3My3klmCO1fEmINZY/8J3EpBg5/A/D0AKmBveUh6pgoeycoMkVMko84tuYS+Gg==",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -5970,7 +5938,6 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
       "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -6103,7 +6070,6 @@
       "version": "1.0.30001674",
       "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001674.tgz",
       "integrity": "sha512-jOsKlZVRnzfhLojb+Ykb+gyUSp9Xb57So+fAiFlLzzTKpqg8xxSav0e40c8/4F/v9N8QSvrRRaLeVzQbLqomYw==",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -6252,7 +6218,6 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-1.0.4.tgz",
       "integrity": "sha512-rNjApaLzuwaOTjCiT8lSDdGN1APCiqkChLMJxJPWLunPAt5fy8xgU9/jNOchV84wfIxrA0lRQB7oCT8jrn/wrQ==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "engines": {
@@ -6414,7 +6379,6 @@
       "version": "2.20.3",
       "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
       "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -6604,6 +6568,74 @@
       "license": "MIT",
       "peer": true
     },
+    "node_modules/copy-webpack-plugin": {
+      "version": "12.0.2",
+      "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-12.0.2.tgz",
+      "integrity": "sha512-SNwdBeHyII+rWvee/bTnAYyO8vfVdcSTud4EIb6jcZ8inLeWucJE0DnxXQBjlQ5zlteuuvooGQy3LIyGxhvlOA==",
+      "license": "MIT",
+      "dependencies": {
+        "fast-glob": "^3.3.2",
+        "glob-parent": "^6.0.1",
+        "globby": "^14.0.0",
+        "normalize-path": "^3.0.0",
+        "schema-utils": "^4.2.0",
+        "serialize-javascript": "^6.0.2"
+      },
+      "engines": {
+        "node": ">= 18.12.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/webpack"
+      },
+      "peerDependencies": {
+        "webpack": "^5.1.0"
+      }
+    },
+    "node_modules/copy-webpack-plugin/node_modules/globby": {
+      "version": "14.0.2",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-14.0.2.tgz",
+      "integrity": "sha512-s3Fq41ZVh7vbbe2PN3nrW7yC7U7MFVc5c98/iTl9c2GawNMKx/J648KQRW6WKkuU8GIbbh2IXfIRQjOZnXcTnw==",
+      "license": "MIT",
+      "dependencies": {
+        "@sindresorhus/merge-streams": "^2.1.0",
+        "fast-glob": "^3.3.2",
+        "ignore": "^5.2.4",
+        "path-type": "^5.0.0",
+        "slash": "^5.1.0",
+        "unicorn-magic": "^0.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/copy-webpack-plugin/node_modules/path-type": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-5.0.0.tgz",
+      "integrity": "sha512-5HviZNaZcfqP95rwpv+1HDgUamezbqdSYTyzjTvwtJSnIH+3vnbmWsItli8OFEndS984VT55M3jduxZbX351gg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/copy-webpack-plugin/node_modules/slash": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/slash/-/slash-5.1.0.tgz",
+      "integrity": "sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/core-js": {
       "version": "3.38.1",
       "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.38.1.tgz",
@@ -7414,7 +7446,6 @@
       "version": "1.5.49",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.49.tgz",
       "integrity": "sha512-ZXfs1Of8fDb6z7WEYZjXpgIRF6MEu8JdeGA0A40aZq6OQbS+eJpnnV49epZRna2DU/YsEjSQuGtQPPtvt6J65A==",
-      "dev": true,
       "license": "ISC"
     },
     "node_modules/elliptic": {
@@ -7487,7 +7518,6 @@
       "version": "5.17.1",
       "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.17.1.tgz",
       "integrity": "sha512-LMHl3dXhTcfv8gM4kEzIUeTQ+7fpdA0l2tUf34BddXPkz2A5xJ5L/Pchd5BL6rdccM9QGvu0sWZzK1Z1t4wwyg==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -7662,7 +7692,6 @@
       "version": "1.5.4",
       "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.5.4.tgz",
       "integrity": "sha512-MVNK56NiMrOwitFB7cqDwq0CQutbw+0BvLshJSse0MUNU+y1FC3bUS/AQg7oUng+/wKrrki7JfmwtVHkVfPLlw==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -7788,7 +7817,6 @@
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
       "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6"
@@ -8389,7 +8417,6 @@
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
       "integrity": "sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==",
-      "dev": true,
       "license": "BSD-2-Clause",
       "peer": true,
       "dependencies": {
@@ -8587,7 +8614,6 @@
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
       "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
-      "dev": true,
       "license": "BSD-2-Clause",
       "peer": true,
       "dependencies": {
@@ -8601,7 +8627,6 @@
       "version": "5.3.0",
       "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
       "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
-      "dev": true,
       "license": "BSD-2-Clause",
       "peer": true,
       "engines": {
@@ -8612,7 +8637,6 @@
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.3.0.tgz",
       "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
-      "dev": true,
       "license": "BSD-2-Clause",
       "peer": true,
       "engines": {
@@ -8664,7 +8688,6 @@
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
       "integrity": "sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "engines": {
@@ -8756,16 +8779,13 @@
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
       "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/fast-glob": {
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
       "integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@nodelib/fs.stat": "^2.0.2",
         "@nodelib/fs.walk": "^1.2.3",
@@ -8781,9 +8801,7 @@
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
       "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
-      "dev": true,
       "license": "ISC",
-      "peer": true,
       "dependencies": {
         "is-glob": "^4.0.1"
       },
@@ -8795,7 +8813,6 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
       "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -8811,9 +8828,7 @@
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.0.3.tgz",
       "integrity": "sha512-aLrHthzCjH5He4Z2H9YZ+v6Ujb9ocRuW6ZzkJQOrTxleEijANq4v1TsaPaVG1PZcuurEzrLcWRyYBYXD5cEiaw==",
-      "dev": true,
-      "license": "BSD-3-Clause",
-      "peer": true
+      "license": "BSD-3-Clause"
     },
     "node_modules/fast-xml-parser": {
       "version": "4.5.0",
@@ -8852,9 +8867,7 @@
       "version": "1.17.1",
       "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz",
       "integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==",
-      "dev": true,
       "license": "ISC",
-      "peer": true,
       "dependencies": {
         "reusify": "^1.0.4"
       }
@@ -8914,9 +8927,7 @@
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
       "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "to-regex-range": "^5.0.1"
       },
@@ -9368,9 +9379,7 @@
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
       "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
-      "dev": true,
       "license": "ISC",
-      "peer": true,
       "dependencies": {
         "is-glob": "^4.0.3"
       },
@@ -9382,7 +9391,6 @@
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz",
       "integrity": "sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==",
-      "dev": true,
       "license": "BSD-2-Clause",
       "peer": true
     },
@@ -9528,7 +9536,6 @@
       "version": "4.2.11",
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
       "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",
-      "dev": true,
       "license": "ISC",
       "peer": true
     },
@@ -9561,7 +9568,6 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
       "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "engines": {
@@ -10090,9 +10096,7 @@
       "version": "5.3.2",
       "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
       "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">= 4"
       }
@@ -10533,9 +10537,7 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
       "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -10571,9 +10573,7 @@
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
       "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "is-extglob": "^2.1.1"
       },
@@ -10663,9 +10663,7 @@
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
       "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=0.12.0"
       }
@@ -10912,7 +10910,6 @@
       "version": "27.5.1",
       "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-27.5.1.tgz",
       "integrity": "sha512-7vuh85V5cdDofPyxn58nrPjBktZo0u9x1g8WtjQol+jZDaE+fhN+cIvTj11GndBnMnyfrUOG1sZQxCdjKh+DKg==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -10928,7 +10925,6 @@
       "version": "8.1.1",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
       "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -11019,7 +11015,6 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
       "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -11027,7 +11022,6 @@
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
       "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -11172,7 +11166,6 @@
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-4.3.0.tgz",
       "integrity": "sha512-3R/1M+yS3j5ou80Me59j7F9IMs4PXs3VqRrm0TU3AbKPxlmpoY1TNscJV/oGJXo8qCatFGTfDbY6W6ipGOYXfg==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "engines": {
@@ -11709,7 +11702,6 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
       "integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -11717,9 +11709,7 @@
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
       "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">= 8"
       }
@@ -12302,9 +12292,7 @@
       "version": "4.0.8",
       "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
       "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "braces": "^3.0.3",
         "picomatch": "^2.3.1"
@@ -12561,7 +12549,6 @@
       "version": "2.6.2",
       "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.2.tgz",
       "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==",
-      "dev": true,
       "license": "MIT",
       "peer": true
     },
@@ -12691,7 +12678,6 @@
       "version": "2.0.18",
       "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.18.tgz",
       "integrity": "sha512-d9VeXT4SJ7ZeOqGX6R5EM022wpL+eWPooLI+5UpWn2jCT1aosUQEhQP214x33Wkwx3JQMvIm+tIoVOdodFS40g==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/nopt": {
@@ -12714,9 +12700,7 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
       "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -13312,9 +13296,7 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
       "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=8.6"
       },
@@ -13837,7 +13819,6 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
       "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "engines": {
@@ -13891,7 +13872,6 @@
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
       "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==",
-      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -13906,16 +13886,13 @@
           "url": "https://feross.org/support"
         }
       ],
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/randombytes": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
       "integrity": "sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "safe-buffer": "^5.1.0"
       }
@@ -14346,7 +14323,6 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
       "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -14466,9 +14442,7 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz",
       "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "iojs": ">=1.0.0",
         "node": ">=0.10.0"
@@ -14521,7 +14495,6 @@
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
       "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==",
-      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -14537,7 +14510,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "queue-microtask": "^1.2.2"
       }
@@ -14566,7 +14538,6 @@
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
       "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
-      "devOptional": true,
       "funding": [
         {
           "type": "github",
@@ -14676,9 +14647,7 @@
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.2.0.tgz",
       "integrity": "sha512-L0jRsrPpjdckP3oPug3/VxNKt2trR8TcabrM6FOAAlvC/9Phcmm+cuAgTlxBqdBR1WJx7Naj9WHw+aOmheSVbw==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@types/json-schema": "^7.0.9",
         "ajv": "^8.9.0",
@@ -14697,9 +14666,7 @@
       "version": "8.17.1",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
       "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.3",
         "fast-uri": "^3.0.1",
@@ -14715,9 +14682,7 @@
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-5.1.0.tgz",
       "integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.3"
       },
@@ -14729,9 +14694,7 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
       "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
-      "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/select-hose": {
       "version": "2.0.0",
@@ -14826,9 +14789,7 @@
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz",
       "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==",
-      "dev": true,
       "license": "BSD-3-Clause",
-      "peer": true,
       "dependencies": {
         "randombytes": "^2.1.0"
       }
@@ -15220,7 +15181,6 @@
       "version": "0.5.21",
       "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
       "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -15232,7 +15192,6 @@
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
       "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-      "dev": true,
       "license": "BSD-3-Clause",
       "peer": true,
       "engines": {
@@ -16023,7 +15982,6 @@
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz",
       "integrity": "sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "engines": {
@@ -16059,7 +16017,6 @@
       "version": "5.36.0",
       "resolved": "https://registry.npmjs.org/terser/-/terser-5.36.0.tgz",
       "integrity": "sha512-IYV9eNMuFAV4THUspIRXkLakHnV6XO7FEdtKjf/mDyrnqUg9LnlOn6/RwRvM9SZjR4GUq8Nk8zj67FzVARr74w==",
-      "dev": true,
       "license": "BSD-2-Clause",
       "peer": true,
       "dependencies": {
@@ -16079,7 +16036,6 @@
       "version": "5.3.10",
       "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.3.10.tgz",
       "integrity": "sha512-BKFPWlPDndPs+NGGCr1U59t0XScL5317Y0UReNrHaw9/FwhPENlq6bfgs+4yPfyP51vqC1bQ4rp1EfXW5ZSH9w==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -16115,7 +16071,6 @@
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.3.0.tgz",
       "integrity": "sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -16191,9 +16146,7 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
       "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
-      "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "is-number": "^7.0.0"
       },
@@ -16640,6 +16593,18 @@
       "integrity": "sha512-NUcwaKxUxWrZLpDG+z/xZaCgQITkA/Dv4V/T6bw7VON6l1Xz/VnrBqrYjZQ12TamKHzITTfOEIYUj48y2KXImA==",
       "license": "MIT"
     },
+    "node_modules/unicorn-magic": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.1.0.tgz",
+      "integrity": "sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/unified": {
       "version": "11.0.5",
       "resolved": "https://registry.npmjs.org/unified/-/unified-11.0.5.tgz",
@@ -16755,7 +16720,6 @@
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.1.tgz",
       "integrity": "sha512-R8UzCaa9Az+38REPiJ1tXlImTJXlVfgHZsglwBD/k6nj76ctsH1E3q4doGrukiLQd3sGQYu56r5+lo5r94l29A==",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -16786,7 +16750,6 @@
       "version": "4.4.1",
       "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
       "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==",
-      "dev": true,
       "license": "BSD-2-Clause",
       "peer": true,
       "dependencies": {
@@ -17321,7 +17284,6 @@
       "version": "2.4.2",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.2.tgz",
       "integrity": "sha512-TnbFSbcOCcDgjZ4piURLCbJ3nJhznVh9kw6F6iokjiFPl8ONxe9A6nMDVXDiNbrSfLILs6vB07F7wLBrwPYzJw==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -17428,7 +17390,6 @@
       "version": "5.95.0",
       "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.95.0.tgz",
       "integrity": "sha512-2t3XstrKULz41MNMBF+cJ97TyHdyQ8HCt//pqErqDvNjU9YQBnZxIHa11VXsi7F3mb5/aO2tuDxdeTPdU7xu9Q==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -17739,7 +17700,6 @@
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.3.0.tgz",
       "integrity": "sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -17759,7 +17719,6 @@
       "version": "3.2.3",
       "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz",
       "integrity": "sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==",
-      "dev": true,
       "license": "MIT",
       "peer": true,
       "engines": {
diff --git a/package.json b/package.json
index a437d6112b..d65079d33e 100644
--- a/package.json
+++ b/package.json
@@ -39,6 +39,7 @@
     "@nextcloud/router": "^3.0.1",
     "@nextcloud/vue": "^8.19.0",
     "blueimp-md5": "^2.19.0",
+    "copy-webpack-plugin": "^12.0.2",
     "crypto-js": "^4.2.0",
     "js-confetti": "^0.12.0",
     "pinia": "^2.2.6",
diff --git a/webpack.config.js b/webpack.config.js
index a5aec7fbc6..c00c2aa84f 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -7,6 +7,7 @@ const path = require('path')
 const BabelLoaderExcludeNodeModulesExcept = require('babel-loader-exclude-node-modules-except')
 const { EsbuildPlugin } = require('esbuild-loader')
 const nextcloudWebpackConfig = require('@nextcloud/webpack-vue-config')
+const CopyPlugin = require('copy-webpack-plugin');
 
 module.exports = merge(nextcloudWebpackConfig, {
 	entry: {
@@ -70,4 +71,14 @@ module.exports = merge(nextcloudWebpackConfig, {
 		],
 	},
 	cache: true,
+	plugins: [
+		new CopyPlugin({
+			patterns: [
+				{
+					from: 'node_modules/@libresign/vue-pdf-editor/dist/pdf.worker.min.mjs',
+					to: '',
+				},
+			],
+		}),
+	],
 })

From 96e5f06695742c0c8be6f4e1acd267a9495196e0 Mon Sep 17 00:00:00 2001
From: Victor Bianchi <vbianchi@protonmail.com>
Date: Thu, 31 Oct 2024 18:42:23 -0300
Subject: [PATCH 40/48] feat: integrate files filtering and pagination, fix
 IntersectionObserver

Signed-off-by: Victor Bianchi <vbianchi@protonmail.com>
---
 lib/Helper/Pagination.php           |   2 +-
 package-lock.json                   | 640 ++--------------------------
 package.json                        |   1 +
 src/store/files.js                  |  20 +-
 src/views/FilesList/FilesList.vue   |   7 +-
 src/views/FilesList/VirtualList.vue |  36 +-
 6 files changed, 66 insertions(+), 640 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 e5f1e4af7e..659cf4befc 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",
         "pinia": "^2.2.6",
         "v-perfect-signature": "^1.4.0",
@@ -1878,278 +1879,6 @@
         "node": ">=16"
       }
     },
-    "node_modules/@esbuild/aix-ppc64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz",
-      "integrity": "sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==",
-      "cpu": [
-        "ppc64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "aix"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/android-arm": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.21.5.tgz",
-      "integrity": "sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==",
-      "cpu": [
-        "arm"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "android"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/android-arm64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.21.5.tgz",
-      "integrity": "sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "android"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/android-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.21.5.tgz",
-      "integrity": "sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "android"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/darwin-arm64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.21.5.tgz",
-      "integrity": "sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/darwin-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.21.5.tgz",
-      "integrity": "sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/freebsd-arm64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.21.5.tgz",
-      "integrity": "sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "freebsd"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/freebsd-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.21.5.tgz",
-      "integrity": "sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "freebsd"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/linux-arm": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.21.5.tgz",
-      "integrity": "sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==",
-      "cpu": [
-        "arm"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/linux-arm64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.21.5.tgz",
-      "integrity": "sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/linux-ia32": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.21.5.tgz",
-      "integrity": "sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==",
-      "cpu": [
-        "ia32"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/linux-loong64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.21.5.tgz",
-      "integrity": "sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==",
-      "cpu": [
-        "loong64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/linux-mips64el": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.21.5.tgz",
-      "integrity": "sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==",
-      "cpu": [
-        "mips64el"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/linux-ppc64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.21.5.tgz",
-      "integrity": "sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==",
-      "cpu": [
-        "ppc64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/linux-riscv64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.21.5.tgz",
-      "integrity": "sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==",
-      "cpu": [
-        "riscv64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/linux-s390x": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.21.5.tgz",
-      "integrity": "sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==",
-      "cpu": [
-        "s390x"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
     "node_modules/@esbuild/linux-x64": {
       "version": "0.21.5",
       "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.21.5.tgz",
@@ -2167,108 +1896,6 @@
         "node": ">=12"
       }
     },
-    "node_modules/@esbuild/netbsd-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.21.5.tgz",
-      "integrity": "sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "netbsd"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/openbsd-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz",
-      "integrity": "sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "openbsd"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/sunos-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.21.5.tgz",
-      "integrity": "sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "sunos"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/win32-arm64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.21.5.tgz",
-      "integrity": "sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/win32-ia32": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.21.5.tgz",
-      "integrity": "sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==",
-      "cpu": [
-        "ia32"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@esbuild/win32-x64": {
-      "version": "0.21.5",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.21.5.tgz",
-      "integrity": "sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": ">=12"
-      }
-    },
     "node_modules/@eslint-community/eslint-utils": {
       "version": "4.4.1",
       "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.1.tgz",
@@ -2883,6 +2510,7 @@
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/@nextcloud/dialogs/-/dialogs-6.0.1.tgz",
       "integrity": "sha512-TlzNUy0eFPIjnop2Wfom45xJdUjLOoUwd/E8V/6ehh+PifrgIWGy6jqBYMRoQfUASc/LKtSYUrCN3yDgVrK8Tw==",
+      "license": "AGPL-3.0-or-later",
       "dependencies": {
         "@mdi/js": "^7.4.47",
         "@nextcloud/auth": "^2.4.0",
@@ -3274,6 +2902,18 @@
         "vue": "2.x"
       }
     },
+    "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",
@@ -3393,160 +3033,6 @@
         "@parcel/watcher-win32-x64": "2.4.1"
       }
     },
-    "node_modules/@parcel/watcher-android-arm64": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.4.1.tgz",
-      "integrity": "sha512-LOi/WTbbh3aTn2RYddrO8pnapixAziFl6SMxHM69r3tvdSm94JtCenaKgk1GRg5FJ5wpMCpHeW+7yqPlvZv7kg==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "android"
-      ],
-      "peer": true,
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-darwin-arm64": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.4.1.tgz",
-      "integrity": "sha512-ln41eihm5YXIY043vBrrHfn94SIBlqOWmoROhsMVTSXGh0QahKGy77tfEywQ7v3NywyxBBkGIfrWRHm0hsKtzA==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "peer": true,
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-darwin-x64": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.4.1.tgz",
-      "integrity": "sha512-yrw81BRLjjtHyDu7J61oPuSoeYWR3lDElcPGJyOvIXmor6DEo7/G2u1o7I38cwlcoBHQFULqF6nesIX3tsEXMg==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "peer": true,
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-freebsd-x64": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.4.1.tgz",
-      "integrity": "sha512-TJa3Pex/gX3CWIx/Co8k+ykNdDCLx+TuZj3f3h7eOjgpdKM+Mnix37RYsYU4LHhiYJz3DK5nFCCra81p6g050w==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "freebsd"
-      ],
-      "peer": true,
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-arm-glibc": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.4.1.tgz",
-      "integrity": "sha512-4rVYDlsMEYfa537BRXxJ5UF4ddNwnr2/1O4MHM5PjI9cvV2qymvhwZSFgXqbS8YoTk5i/JR0L0JDs69BUn45YA==",
-      "cpu": [
-        "arm"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-arm64-glibc": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.4.1.tgz",
-      "integrity": "sha512-BJ7mH985OADVLpbrzCLgrJ3TOpiZggE9FMblfO65PlOCdG++xJpKUJ0Aol74ZUIYfb8WsRlUdgrZxKkz3zXWYA==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-arm64-musl": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.4.1.tgz",
-      "integrity": "sha512-p4Xb7JGq3MLgAfYhslU2SjoV9G0kI0Xry0kuxeG/41UfpjHGOhv7UoUDAz/jb1u2elbhazy4rRBL8PegPJFBhA==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
     "node_modules/@parcel/watcher-linux-x64-glibc": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-glibc/-/watcher-linux-x64-glibc-2.4.1.tgz",
@@ -3591,72 +3077,6 @@
         "url": "https://opencollective.com/parcel"
       }
     },
-    "node_modules/@parcel/watcher-win32-arm64": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.4.1.tgz",
-      "integrity": "sha512-Uq2BPp5GWhrq/lcuItCHoqxjULU1QYEcyjSO5jqqOK8RNFDBQnenMMx4gAl3v8GiWa59E9+uDM7yZ6LxwUIfRg==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "peer": true,
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-win32-ia32": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-ia32/-/watcher-win32-ia32-2.4.1.tgz",
-      "integrity": "sha512-maNRit5QQV2kgHFSYwftmPBxiuK5u4DXjbXx7q6eKjq5dsLXZ4FJiVvlcw35QXzk0KrUecJmuVFbj4uV9oYrcw==",
-      "cpu": [
-        "ia32"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "peer": true,
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-win32-x64": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.4.1.tgz",
-      "integrity": "sha512-+DvS92F9ezicfswqrvIRM2njcYJbd5mb9CUgtrHCHmvn7pPPa+nMDRu1o1bYYz/l5IB2NVGNJWiH7h1E58IF2A==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "peer": true,
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
     "node_modules/@parcel/watcher/node_modules/detect-libc": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
@@ -4625,6 +4045,7 @@
       "version": "11.2.0",
       "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-11.2.0.tgz",
       "integrity": "sha512-JIUwRcOqOWzcdu1dGlfW04kaJhW3EXnnjJJfLTtddJanymTL7lF1C0+dVVZ/siLfc73mWn+cGP1PE1PKPruRSA==",
+      "license": "MIT",
       "dependencies": {
         "@types/web-bluetooth": "^0.0.20",
         "@vueuse/metadata": "11.2.0",
@@ -4639,6 +4060,7 @@
       "version": "11.2.0",
       "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-11.2.0.tgz",
       "integrity": "sha512-VxFjie0EanOudYSgMErxXfq6fo8vhr5ICI+BuE3I9FnX7ePllEsVrRQ7O6Q1TLgApeLuPKcHQxAXpP+KnlrJsg==",
+      "license": "MIT",
       "dependencies": {
         "vue-demi": ">=0.14.10"
       },
@@ -4651,6 +4073,7 @@
       "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
       "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
       "hasInstallScript": true,
+      "license": "MIT",
       "bin": {
         "vue-demi-fix": "bin/vue-demi-fix.js",
         "vue-demi-switch": "bin/vue-demi-switch.js"
@@ -4675,6 +4098,7 @@
       "version": "11.2.0",
       "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-11.2.0.tgz",
       "integrity": "sha512-L0ZmtRmNx+ZW95DmrgD6vn484gSpVeRbgpWevFKXwqqQxW9hnSi2Ppuh2BzMjnbv4aJRiIw8tQatXT9uOB23dQ==",
+      "license": "MIT",
       "funding": {
         "url": "https://github.com/sponsors/antfu"
       }
@@ -7005,9 +6429,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"
@@ -9216,22 +8640,6 @@
       "devOptional": true,
       "license": "ISC"
     },
-    "node_modules/fsevents": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
-      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
-      "dev": true,
-      "hasInstallScript": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
-      }
-    },
     "node_modules/function-bind": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
@@ -13028,6 +12436,7 @@
       "version": "8.0.1",
       "resolved": "https://registry.npmjs.org/p-queue/-/p-queue-8.0.1.tgz",
       "integrity": "sha512-NXzu9aQJTAzbBqOt2hwsR63ea7yvxJc0PwN/zobNAudYfb1B7R08SzB4TsLeSbUCuG467NhnoT0oO6w1qRO+BA==",
+      "license": "MIT",
       "dependencies": {
         "eventemitter3": "^5.0.1",
         "p-timeout": "^6.1.2"
@@ -13042,7 +12451,8 @@
     "node_modules/p-queue/node_modules/eventemitter3": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.1.tgz",
-      "integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA=="
+      "integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==",
+      "license": "MIT"
     },
     "node_modules/p-retry": {
       "version": "6.2.0",
@@ -13067,6 +12477,7 @@
       "version": "6.1.3",
       "resolved": "https://registry.npmjs.org/p-timeout/-/p-timeout-6.1.3.tgz",
       "integrity": "sha512-UJUyfKbwvr/uZSV6btANfb+0t/mOhKV/KXcCUTp8FcQI+v/0d+wXqH4htrW0E4rR6WiEO/EPvUFiV9D5OI4vlw==",
+      "license": "MIT",
       "engines": {
         "node": ">=14.16"
       },
@@ -13308,6 +12719,7 @@
       "version": "2.2.6",
       "resolved": "https://registry.npmjs.org/pinia/-/pinia-2.2.6.tgz",
       "integrity": "sha512-vIsR8JkDN5Ga2vAxqOE2cJj4VtsHnzpR1Fz30kClxlh0yCHfec6uoMeM3e/ddqmwFUejK3NlrcQa/shnpyT4hA==",
+      "license": "MIT",
       "dependencies": {
         "@vue/devtools-api": "^6.6.3",
         "vue-demi": "^0.14.10"
diff --git a/package.json b/package.json
index d65079d33e..a2fbea5ad4 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",
     "pinia": "^2.2.6",
     "v-perfect-signature": "^1.4.0",
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" />
 			</tbody>
+			<tfoot ref="endOfList" />
 		</table>
 	</div>
 </template>
 
 <script>
+import debounce from 'debounce'
+
+import { subscribe, unsubscribe } from '@nextcloud/event-bus'
+
 import { useFilesStore } from '../../store/files.js'
 import { useUserConfigStore } from '../../store/userconfig.js'
 
@@ -57,24 +62,31 @@ export default {
 		}
 	},
 	mounted() {
-		this.observer = new IntersectionObserver(([entry]) => {
+		this.observer = new IntersectionObserver(debounce(([entry]) => {
 			if (entry && entry.isIntersecting) {
-				this.filesStore.getAllFiles()
+				this.getFilesIfNotLoading()
 			}
-		})
-		// Is there a better way to target the last tr element? Maybe something like useRef?
-		if (this.$el.querySelector('table tbody tr:last-child')) {
-			this.observer.observe(this.$el.querySelector('table tbody tr:last-child'))
-		}
+		}, 100, false))
+		subscribe('libresign:files:updated', this.updateObserver)
 	},
 	beforeDestroy() {
-		if (this.observer) this.observer.disconnect()
+		this.observer.disconnect()
+		unsubscribe('libresign:files:updated')
 	},
-	updated() {
-		if (this.observer) {
+	methods: {
+		getFilesIfNotLoading() {
+			if (this.filesStore.loading) {
+				setTimeout(this.getFilesIfNotLoading, 100)
+			} else {
+				this.filesStore.getAllFiles()
+			}
+		},
+		updateObserver() {
+			const endOfListElement = this.$refs?.endOfList
+			if (!endOfListElement) return
 			this.observer.disconnect()
-			this.observer.observe(this.$el.querySelector('table tbody tr:last-child'))
-		}
+			this.observer.observe(endOfListElement)
+		},
 	},
 }
 </script>

From 5284d783f778f41c8d43e476a1c66c10cbea599a Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 19:24:11 -0300
Subject: [PATCH 41/48] fix: integration tests

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 tests/integration/features/file/list.feature | 22 ++++++++++----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/tests/integration/features/file/list.feature b/tests/integration/features/file/list.feature
index 5ce67f8f59..8a6f4ee284 100644
--- a/tests/integration/features/file/list.feature
+++ b/tests/integration/features/file/list.feature
@@ -75,10 +75,10 @@ Feature: file-list
       | key                              | value                      |
       | (jq).ocs.data.data[0].name       | document                   |
       | (jq).ocs.data.pagination.total   | 5                          |
-      | (jq).ocs.data.pagination.current | /file/list?page=1&length=2 |
-      | (jq).ocs.data.pagination.next    | /file/list?page=2&length=2 |
+      | (jq).ocs.data.pagination.current | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=1&length=2 |
+      | (jq).ocs.data.pagination.next    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=2&length=2 |
       | (jq).ocs.data.pagination.prev    | null                       |
-      | (jq).ocs.data.pagination.last    | /file/list?page=3&length=2 |
+      | (jq).ocs.data.pagination.last    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=3 |
       | (jq).ocs.data.pagination.first   | null                       |
     # second page
     When sending "get" to ocs "/apps/libresign/api/v1/file/list?length=2&page=2"
@@ -86,19 +86,19 @@ Feature: file-list
       | key                              | value                      |
       | (jq).ocs.data.data[0].name       | document                   |
       | (jq).ocs.data.pagination.total   | 5                          |
-      | (jq).ocs.data.pagination.current | /file/list?page=2&length=2 |
-      | (jq).ocs.data.pagination.next    | /file/list?page=3&length=2 |
-      | (jq).ocs.data.pagination.prev    | /file/list?page=1&length=2 |
-      | (jq).ocs.data.pagination.last    | /file/list?page=3&length=2 |
-      | (jq).ocs.data.pagination.first   | /file/list?page=1&length=2 |
+      | (jq).ocs.data.pagination.current | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=2&length=2 |
+      | (jq).ocs.data.pagination.next    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=3 |
+      | (jq).ocs.data.pagination.prev    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=1&length=2 |
+      | (jq).ocs.data.pagination.last    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=3 |
+      | (jq).ocs.data.pagination.first   | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=1&length=2 |
     # last page
     When sending "get" to ocs "/apps/libresign/api/v1/file/list?length=2&page=3"
     Then the response should be a JSON array with the following mandatory values
       | key                              | value                      |
       | (jq).ocs.data.data[0].name       | document                   |
       | (jq).ocs.data.pagination.total   | 5                          |
-      | (jq).ocs.data.pagination.current | /file/list?page=3&length=2 |
+      | (jq).ocs.data.pagination.current | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=3 |
       | (jq).ocs.data.pagination.next    | null                       |
-      | (jq).ocs.data.pagination.prev    | /file/list?page=2&length=2 |
+      | (jq).ocs.data.pagination.prev    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=2&length=2 |
       | (jq).ocs.data.pagination.last    | null                       |
-      | (jq).ocs.data.pagination.first   | /file/list?page=1&length=2 |
+      | (jq).ocs.data.pagination.first   | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=1&length=2 |

From 3bb3e3e1476026e6c1489fdb34a0e97e4c51bd86 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 19:48:08 -0300
Subject: [PATCH 42/48] refactor: make more readdable

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 lib/Helper/Pagination.php | 48 +++++++++++++++++++++------------------
 1 file changed, 26 insertions(+), 22 deletions(-)

diff --git a/lib/Helper/Pagination.php b/lib/Helper/Pagination.php
index 1999e82ba3..8ce906b75d 100644
--- a/lib/Helper/Pagination.php
+++ b/lib/Helper/Pagination.php
@@ -33,29 +33,33 @@ public function setRouteName(string $routeName = ''): self {
 
 	public function getPagination(?int $page, ?int $length, array $filter = []): array {
 		$this->setMaxPerPage($length);
-		$pagination['total'] = $this->count();
-		if ($pagination['total'] > $length) {
-			$pagination['current'] = $this->linkToRoute($page, $length, $filter);
-			$pagination['next'] = $this->hasNextPage()
-				? $this->linkToRoute($this->getNextPage(), $length, $filter)
-				: null;
-			$pagination['prev'] = $this->hasPreviousPage()
-				? $this->linkToRoute($this->getPreviousPage(), $length, $filter)
-				: null;
-			$pagination['last'] = $this->hasNextPage()
-				? $this->linkToRoute($this->getNbPages(), $length, $filter)
-				: null;
-			$pagination['first'] = $this->hasPreviousPage()
-				? $this->linkToRoute(1, $length, $filter)
-				: null;
-		} else {
-			$pagination['current'] = null;
-			$pagination['next'] = null;
-			$pagination['prev'] = null;
-			$pagination['last'] = null;
-			$pagination['first'] = null;
+		$total = $this->count();
+		if ($total > $length) {
+			return [
+				'total' => $total,
+				'current' => $this->linkToRoute($page, $length, $filter),
+				'next' => $this->hasNextPage()
+					? $this->linkToRoute($this->getNextPage(), $length, $filter)
+					: null,
+				'prev' => $this->hasPreviousPage()
+					? $this->linkToRoute($this->getPreviousPage(), $length, $filter)
+					: null,
+				'last' => $this->hasNextPage()
+					? $this->linkToRoute($this->getNbPages(), $length, $filter)
+					: null,
+				'first' => $this->hasPreviousPage()
+					? $this->linkToRoute(1, $length, $filter)
+					: null,
+			];
 		}
-		return $pagination;
+		return [
+			'total' => $total,
+			'current' => null,
+			'next' => null,
+			'prev' => null,
+			'last' => null,
+			'first' => null,
+		];
 	}
 
 	private function linkToRoute(int $page, int $length, array $filter): string {

From b1ae210c55724c466528cf8ca389a63d9cc56e06 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 20:40:58 -0300
Subject: [PATCH 43/48] refactor: make more readdable

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 lib/Helper/Pagination.php | 31 +++++++++++++++----------------
 1 file changed, 15 insertions(+), 16 deletions(-)

diff --git a/lib/Helper/Pagination.php b/lib/Helper/Pagination.php
index 8ce906b75d..27add23cde 100644
--- a/lib/Helper/Pagination.php
+++ b/lib/Helper/Pagination.php
@@ -31,25 +31,17 @@ public function setRouteName(string $routeName = ''): self {
 		return $this;
 	}
 
-	public function getPagination(?int $page, ?int $length, array $filter = []): array {
+	public function getPagination(int $page, int $length, array $filter = []): array {
 		$this->setMaxPerPage($length);
 		$total = $this->count();
 		if ($total > $length) {
 			return [
 				'total' => $total,
-				'current' => $this->linkToRoute($page, $length, $filter),
-				'next' => $this->hasNextPage()
-					? $this->linkToRoute($this->getNextPage(), $length, $filter)
-					: null,
-				'prev' => $this->hasPreviousPage()
-					? $this->linkToRoute($this->getPreviousPage(), $length, $filter)
-					: null,
-				'last' => $this->hasNextPage()
-					? $this->linkToRoute($this->getNbPages(), $length, $filter)
-					: null,
-				'first' => $this->hasPreviousPage()
-					? $this->linkToRoute(1, $length, $filter)
-					: null,
+				'current' => $this->linkToRoute(true, $page, $length, $filter),
+				'next' => $this->linkToRoute($this->hasNextPage(), 'getNextPage', $length, $filter),
+				'prev' => $this->linkToRoute($this->hasPreviousPage(), 'getPreviousPage', $length, $filter),
+				'last' => $this->linkToRoute($this->hasNextPage(), 'getNbPages', $length, $filter),
+				'first' => $this->linkToRoute($this->hasPreviousPage(), 1, $length, $filter),
 			];
 		}
 		return [
@@ -62,10 +54,17 @@ public function getPagination(?int $page, ?int $length, array $filter = []): arr
 		];
 	}
 
-	private function linkToRoute(int $page, int $length, array $filter): string {
-		return $this->urlGenerator->linkToRouteAbsolute(
+	private function linkToRoute(bool $condition, int|string $page, int $length, array $filter): ?string {
+		if (!$condition) {
+			return null;
+		}
+		if (is_string($page)) {
+			$page = $this->$page();
+		}
+		$url = $this->urlGenerator->linkToRouteAbsolute(
 			$this->routeName,
 			array_merge(['page' => $page, 'length' => $length, 'apiVersion' => 'v1'], $filter)
 		);
+		return $url;
 	}
 }

From a417d3d6bef29b45367c3358c9ec65cd89347a65 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 20:41:12 -0300
Subject: [PATCH 44/48] fix: query string order

This asort change the order of parameters:

https://github.com/nextcloud/server/blob/bb1e2f9d9d51e83da6ee0da9ce5fb2e415542119/lib/private/Route/CachingRouter.php#L51

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 tests/integration/features/file/list.feature | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/tests/integration/features/file/list.feature b/tests/integration/features/file/list.feature
index 8a6f4ee284..b3524d238b 100644
--- a/tests/integration/features/file/list.feature
+++ b/tests/integration/features/file/list.feature
@@ -92,7 +92,7 @@ Feature: file-list
       | (jq).ocs.data.pagination.last    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=3 |
       | (jq).ocs.data.pagination.first   | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=1&length=2 |
     # last page
-    When sending "get" to ocs "/apps/libresign/api/v1/file/list?length=2&page=3"
+    When sending "get" to ocs "/apps/libresign/api/v1/file/list?page=3&length=2"
     Then the response should be a JSON array with the following mandatory values
       | key                              | value                      |
       | (jq).ocs.data.data[0].name       | document                   |

From 430b947ee0979b63359cdd98996216b4cde4c24a Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 20:55:46 -0300
Subject: [PATCH 45/48] chore: remove delete from filter

We haven't this status implemented yet

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 src/views/FilesList/FileListFilter/FileListFilterStatus.vue | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/src/views/FilesList/FileListFilter/FileListFilterStatus.vue b/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
index 9e386ac571..6f6b2c2443 100644
--- a/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
+++ b/src/views/FilesList/FileListFilter/FileListFilterStatus.vue
@@ -25,7 +25,6 @@
 
 <script>
 import { mdiListStatus } from '@mdi/js'
-import svgDelete from '@mdi/svg/svg/delete.svg?raw'
 import svgFile from '@mdi/svg/svg/file.svg?raw'
 import svgFractionOneHalf from '@mdi/svg/svg/fraction-one-half.svg?raw'
 import svgSignatureFreehand from '@mdi/svg/svg/signature-freehand.svg?raw'
@@ -80,11 +79,6 @@ export default {
 					icon: colorize(svgSignatureFreehand, '#A0C4FF'),
 					label: t('libresign', 'signed'),
 				},
-				{
-					id: 4,
-					icon: colorize(svgDelete, '#FFB2B2'),
-					label: t('libresign', 'deleted'),
-				},
 			],
 		}
 	},

From 940f018137c5aa4a4cc830e52a04549d7f3e1c4e Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Thu, 31 Oct 2024 21:45:01 -0300
Subject: [PATCH 46/48] fix: order url parameters of pagination

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 lib/Helper/Pagination.php                    | 14 ++++++++++++++
 tests/integration/features/file/list.feature | 14 +++++++-------
 2 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/lib/Helper/Pagination.php b/lib/Helper/Pagination.php
index 27add23cde..c0124b80b5 100644
--- a/lib/Helper/Pagination.php
+++ b/lib/Helper/Pagination.php
@@ -65,6 +65,20 @@ private function linkToRoute(bool $condition, int|string $page, int $length, arr
 			$this->routeName,
 			array_merge(['page' => $page, 'length' => $length, 'apiVersion' => 'v1'], $filter)
 		);
+		$url = $this->sortParameters($url);
+		return $url;
+	}
+
+	/**
+	 * This is necessary to fix problem at integration tests because the method linkToRoute change the order of parameters
+	 */
+	private function sortParameters(?string $url): ?string {
+		if (!$url) {
+			return $url;
+		}
+		parse_str(parse_url($url, PHP_URL_QUERY), $query);
+		ksort($query);
+		$url = strtok($url, '?') . '?' . http_build_query($query);
 		return $url;
 	}
 }
diff --git a/tests/integration/features/file/list.feature b/tests/integration/features/file/list.feature
index b3524d238b..8f59a45a16 100644
--- a/tests/integration/features/file/list.feature
+++ b/tests/integration/features/file/list.feature
@@ -75,8 +75,8 @@ Feature: file-list
       | key                              | value                      |
       | (jq).ocs.data.data[0].name       | document                   |
       | (jq).ocs.data.pagination.total   | 5                          |
-      | (jq).ocs.data.pagination.current | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=1&length=2 |
-      | (jq).ocs.data.pagination.next    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=2&length=2 |
+      | (jq).ocs.data.pagination.current | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=1 |
+      | (jq).ocs.data.pagination.next    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=2 |
       | (jq).ocs.data.pagination.prev    | null                       |
       | (jq).ocs.data.pagination.last    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=3 |
       | (jq).ocs.data.pagination.first   | null                       |
@@ -86,11 +86,11 @@ Feature: file-list
       | key                              | value                      |
       | (jq).ocs.data.data[0].name       | document                   |
       | (jq).ocs.data.pagination.total   | 5                          |
-      | (jq).ocs.data.pagination.current | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=2&length=2 |
+      | (jq).ocs.data.pagination.current | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=2 |
       | (jq).ocs.data.pagination.next    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=3 |
-      | (jq).ocs.data.pagination.prev    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=1&length=2 |
+      | (jq).ocs.data.pagination.prev    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=1 |
       | (jq).ocs.data.pagination.last    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=3 |
-      | (jq).ocs.data.pagination.first   | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=1&length=2 |
+      | (jq).ocs.data.pagination.first   | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=1 |
     # last page
     When sending "get" to ocs "/apps/libresign/api/v1/file/list?page=3&length=2"
     Then the response should be a JSON array with the following mandatory values
@@ -99,6 +99,6 @@ Feature: file-list
       | (jq).ocs.data.pagination.total   | 5                          |
       | (jq).ocs.data.pagination.current | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=3 |
       | (jq).ocs.data.pagination.next    | null                       |
-      | (jq).ocs.data.pagination.prev    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=2&length=2 |
+      | (jq).ocs.data.pagination.prev    | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=2 |
       | (jq).ocs.data.pagination.last    | null                       |
-      | (jq).ocs.data.pagination.first   | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?page=1&length=2 |
+      | (jq).ocs.data.pagination.first   | <BASE_URL>/ocsapp/apps/libresign/api/v1/file/list?length=2&page=1 |

From 454b8d3dbfcc18cc97021b02bd1e4867a331670e Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Tue, 5 Nov 2024 16:03:58 -0300
Subject: [PATCH 47/48] feat: make possible delete file too

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 lib/Controller/FileController.php             | 42 +++++++++++++++++++
 lib/Service/FileService.php                   | 16 +++++++
 src/store/files.js                            |  7 +++-
 .../FilesList/FileEntry/FileEntryActions.vue  | 27 ++++++++----
 4 files changed, 83 insertions(+), 9 deletions(-)

diff --git a/lib/Controller/FileController.php b/lib/Controller/FileController.php
index e9b2757375..b91f13e9f1 100644
--- a/lib/Controller/FileController.php
+++ b/lib/Controller/FileController.php
@@ -391,4 +391,46 @@ public function save(array $file, string $name = '', array $settings = []): Data
 			);
 		}
 	}
+
+	/**
+	 * Delete File
+	 *
+	 * This will delete the file and all data
+	 *
+	 * @param integer $fileId Node id of a Nextcloud file
+	 * @return DataResponse<Http::STATUS_OK, array{message: string}, array{}>|DataResponse<Http::STATUS_UNAUTHORIZED, array{message: string}, array{}>|DataResponse<Http::STATUS_UNPROCESSABLE_ENTITY, array{action: integer, errors: string[]}, array{}>
+	 *
+	 * 200: OK
+	 * 401: Failed
+	 * 422: Failed
+	 */
+	#[NoAdminRequired]
+	#[NoCSRFRequired]
+	#[RequireManager]
+	#[ApiRoute(verb: 'DELETE', url: '/api/{apiVersion}/file/file_id/{fileId}', requirements: ['apiVersion' => '(v1)'])]
+	public function deleteAllRequestSignatureUsingFileId(int $fileId): DataResponse {
+		try {
+			$data = [
+				'userManager' => $this->userSession->getUser(),
+				'file' => [
+					'fileId' => $fileId
+				]
+			];
+			$this->validateHelper->validateExistingFile($data);
+			$this->fileService->delete($fileId);
+		} catch (\Throwable $th) {
+			return new DataResponse(
+				[
+					'message' => $th->getMessage(),
+				],
+				Http::STATUS_UNAUTHORIZED
+			);
+		}
+		return new DataResponse(
+			[
+				'message' => $this->l10n->t('Success')
+			],
+			Http::STATUS_OK
+		);
+	}
 }
diff --git a/lib/Service/FileService.php b/lib/Service/FileService.php
index 57ce58d6cc..9d967d2774 100644
--- a/lib/Service/FileService.php
+++ b/lib/Service/FileService.php
@@ -591,4 +591,20 @@ public function getMyLibresignFile(int $nodeId): File {
 			],
 		);
 	}
+
+	public function delete(int $fileId): void {
+		$file = $this->fileMapper->getByFileId($fileId);
+		$this->fileElementService->deleteVisibleElements($file->getId());
+		$list = $this->signRequestMapper->getByFileId($file->getId());
+		foreach ($list as $signRequest) {
+			$this->signRequestMapper->delete($signRequest);
+		}
+		$this->fileMapper->delete($file);
+		if ($file->getSignedNodeId()) {
+			$signedNextcloudFile = $this->folderService->getFileById($file->getSignedNodeId());
+			$signedNextcloudFile->delete();
+		}
+		$nextcloudFile = $this->folderService->getFileById($fileId);
+		$nextcloudFile->delete();
+	}
 }
diff --git a/src/store/files.js b/src/store/files.js
index 82d05b32af..c4d983f5af 100644
--- a/src/store/files.js
+++ b/src/store/files.js
@@ -210,10 +210,13 @@ export const useFilesStore = function(...args) {
 					this.files[this.selectedNodeId].signers.filter((i) => i.identify !== signer.identify),
 				)
 			},
-			async delete(file) {
+			async delete(file, deleteFile) {
 				file = this.getFile(file)
 				if (file?.uuid !== undefined) {
-					await axios.delete(generateOcsUrl('/apps/libresign/api/v1/sign/file_id/{fileId}', {
+					const url = deleteFile
+						? '/apps/libresign/api/v1/file/file_id/{fileId}'
+						: '/apps/libresign/api/v1/sign/file_id/{fileId}'
+					await axios.delete(generateOcsUrl(url, {
 						fileId: file.nodeId,
 					}))
 				}
diff --git a/src/views/FilesList/FileEntry/FileEntryActions.vue b/src/views/FilesList/FileEntry/FileEntryActions.vue
index 6804ee45e6..744ab69d55 100644
--- a/src/views/FilesList/FileEntry/FileEntryActions.vue
+++ b/src/views/FilesList/FileEntry/FileEntryActions.vue
@@ -29,16 +29,23 @@
 		</NcActions>
 		<NcDialog v-if="confirmDelete"
 			:name="t('libresign', 'Confirm')"
-			@closing="confirmDelete = false">
+			:can-close="!deleting"
+			:open.sync="confirmDelete">
 			{{ t('libresign', 'The signature request will be deleted. Do you confirm this action?') }}
+			<NcCheckboxRadioSwitch :checked.sync="deleteFile" type="switch">
+				{{ t('libresign', 'Also delete the file.') }}
+			</NcCheckboxRadioSwitch>
 			<template #actions>
-				<NcButton type="error"
+				<NcButton type="primary"
 					@click="doDelete()">
-					{{ t('libresign', 'Yes') }}
+					<template #icon>
+						<NcLoadingIcon v-if="deleting" :size="20" />
+					</template>
+					{{ t('libresign', 'Ok') }}
 				</NcButton>
-				<NcButton type="primary"
+				<NcButton type="secondary"
 					@click="confirmDelete = false">
-					{{ t('libresign', 'No') }}
+					{{ t('libresign', 'Cancel') }}
 				</NcButton>
 			</template>
 		</NcDialog>
@@ -53,6 +60,7 @@ import svgTextBoxCheck from '@mdi/svg/svg/text-box-check.svg?raw'
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
+import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
 import NcDialog from '@nextcloud/vue/dist/Components/NcDialog.js'
 import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js'
 import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
@@ -68,6 +76,7 @@ export default {
 		NcActionButton,
 		NcActions,
 		NcButton,
+		NcCheckboxRadioSwitch,
 		NcDialog,
 		NcIconSvgWrapper,
 		NcLoadingIcon,
@@ -102,6 +111,8 @@ export default {
 		return {
 			enabledMenuActions: [],
 			confirmDelete: false,
+			deleteFile: true,
+			deleting: false,
 		}
 	},
 	computed: {
@@ -180,8 +191,10 @@ export default {
 		registerAction(action) {
 			this.enabledMenuActions = [...this.enabledMenuActions, action]
 		},
-		doDelete() {
-			this.filesStore.delete(this.source)
+		async doDelete() {
+			this.deleting = true
+			await this.filesStore.delete(this.source, this.deleteFile)
+			this.deleting = false
 		},
 	},
 }

From f46ee43d4cf6aa4804e9b5fd6932466d506e20d6 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <vitor@php.rio>
Date: Tue, 5 Nov 2024 16:48:48 -0300
Subject: [PATCH 48/48] feat: Save file to LibeSign every when a new file is
 uploaded

Signed-off-by: Vitor Mattos <vitor@php.rio>
---
 lib/Controller/FileController.php | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/lib/Controller/FileController.php b/lib/Controller/FileController.php
index b91f13e9f1..8b68dcee74 100644
--- a/lib/Controller/FileController.php
+++ b/lib/Controller/FileController.php
@@ -10,6 +10,7 @@
 
 use OCA\Files_Sharing\SharedStorage;
 use OCA\Libresign\AppInfo\Application;
+use OCA\Libresign\Db\File as FileEntity;
 use OCA\Libresign\Db\SignRequestMapper;
 use OCA\Libresign\Exception\LibresignException;
 use OCA\Libresign\Helper\JSActions;
@@ -19,6 +20,7 @@
 use OCA\Libresign\Service\AccountService;
 use OCA\Libresign\Service\FileService;
 use OCA\Libresign\Service\IdentifyMethodService;
+use OCA\Libresign\Service\RequestSignatureService;
 use OCA\Libresign\Service\SessionService;
 use OCP\AppFramework\Db\DoesNotExistException;
 use OCP\AppFramework\Http;
@@ -59,6 +61,7 @@ public function __construct(
 		private SessionService $sessionService,
 		private SignRequestMapper $signRequestMapper,
 		private IdentifyMethodService $identifyMethodService,
+		private RequestSignatureService $requestSignatureService,
 		private AccountService $accountService,
 		private IRootFolder $root,
 		private IPreview $preview,
@@ -370,6 +373,15 @@ public function save(array $file, string $name = '', array $settings = []): Data
 				'file' => $file,
 				'settings' => $settings
 			]);
+			$data = [
+				'file' => [
+					'fileNode' => $node,
+				],
+				'name' => $name,
+				'userManager' => $this->userSession->getUser(),
+				'status' => FileEntity::STATUS_DRAFT,
+			];
+			$file = $this->requestSignatureService->save($data);
 
 			return new DataResponse(
 				[