From 8913a717ab288547f5ba7a93d715f301f6c64cc5 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <1079143+vitormattos@users.noreply.github.com>
Date: Thu, 26 Feb 2026 16:12:45 -0300
Subject: [PATCH 1/4] feat(request-picker): add variant prop to support primary
 button style

Signed-off-by: Vitor Mattos <1079143+vitormattos@users.noreply.github.com>
---
 src/components/Request/RequestPicker.vue | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/components/Request/RequestPicker.vue b/src/components/Request/RequestPicker.vue
index d7be334623..e472104779 100644
--- a/src/components/Request/RequestPicker.vue
+++ b/src/components/Request/RequestPicker.vue
@@ -8,6 +8,7 @@
 			:inline="inline ? 3 : 0"
 			:force-name="inline"
 			:class="{column: inline}"
+			:variant="variant"
 			v-model:open="openedMenu">
 			<template #icon>
 				<NcIconSvgWrapper :path="mdiPlus" :size="20" />
@@ -147,6 +148,10 @@ export default {
 			type: Boolean,
 			default: false,
 		},
+		variant: {
+			type: String,
+			default: 'tertiary',
+		},
 	},
 	setup() {
 		const actionsMenuStore = useActionsMenuStore()

From 7706303ee2f33e1cadb9a7a98d5151c61e952efc Mon Sep 17 00:00:00 2001
From: Vitor Mattos <1079143+vitormattos@users.noreply.github.com>
Date: Thu, 26 Feb 2026 16:12:45 -0300
Subject: [PATCH 2/4] feat(files-list): restructure header with primary
 RequestPicker and breadcrumb dropdown menu

Signed-off-by: Vitor Mattos <1079143+vitormattos@users.noreply.github.com>
---
 src/views/FilesList/FilesList.vue | 34 ++++++++++++++++++++++++++-----
 1 file changed, 29 insertions(+), 5 deletions(-)

diff --git a/src/views/FilesList/FilesList.vue b/src/views/FilesList/FilesList.vue
index 2c8a1a8d4f..478dd22f01 100644
--- a/src/views/FilesList/FilesList.vue
+++ b/src/views/FilesList/FilesList.vue
@@ -5,6 +5,10 @@
 <template>
 	<NcAppContent :page-heading="t('libresign', 'Files')">
 		<div class="files-list__header">
+			<!-- Request picker -->
+			<RequestPicker variant="primary" />
+
+			<!-- Current folder breadcrumbs -->
 			<NcBreadcrumbs class="files-list__breadcrumbs">
 				<NcBreadcrumb :name="t('libresign', 'Files')"
 					:title="t('libresign', 'Files')"
@@ -12,18 +16,29 @@
 					:to="{ name: 'fileslist' }"
 					:aria-description="t('libresign', 'Files')"
 					:disable-drop="true"
-					@click="refresh()">
+					force-menu
+					v-model:open="isMenuOpen">
 					<template #icon>
 						<NcIconSvgWrapper :size="20"
 							:svg="viewIcon" />
 					</template>
+					<template #menu-icon>
+						<NcIconSvgWrapper :path="isMenuOpen ? mdiChevronUp : mdiChevronDown" />
+					</template>
+					<!-- Reload button -->
+					<NcActionButton close-after-click @click="refresh()">
+						<template #icon>
+							<NcIconSvgWrapper :path="mdiReload" />
+						</template>
+						<!-- TRANSLATORS Button inside the breadcrumb dropdown menu that reloads the file list -->
+						{{ t('libresign', 'Reload content') }}
+					</NcActionButton>
 				</NcBreadcrumb>
-				<template #actions>
-					<RequestPicker />
-				</template>
 			</NcBreadcrumbs>
 
-			<NcLoadingIcon v-if="isRefreshing" class="files-list__refresh-icon" />
+			<NcLoadingIcon v-if="isRefreshing"
+				class="files-list__refresh-icon"
+				:name="t('libresign', 'File list is reloading')" />
 
 			<NcButton :aria-label="gridViewButtonLabel"
 				:title="gridViewButtonLabel"
@@ -75,11 +90,15 @@ import { t } from '@nextcloud/l10n'
 
 import HomeSvg from '@mdi/svg/svg/home.svg?raw'
 import {
+	mdiChevronDown,
+	mdiChevronUp,
 	mdiFolder,
+	mdiReload,
 	mdiViewGrid,
 	mdiViewList,
 } from '@mdi/js'
 
+import NcActionButton from '@nextcloud/vue/components/NcActionButton'
 import NcAppContent from '@nextcloud/vue/components/NcAppContent'
 import NcBreadcrumb from '@nextcloud/vue/components/NcBreadcrumb'
 import NcBreadcrumbs from '@nextcloud/vue/components/NcBreadcrumbs'
@@ -99,6 +118,7 @@ import { useSidebarStore } from '../../store/sidebar.js'
 export default {
 	name: 'FilesList',
 	components: {
+		NcActionButton,
 		NcAppContent,
 		NcButton,
 		NcBreadcrumb,
@@ -119,13 +139,17 @@ export default {
 			filtersStore,
 			userConfigStore,
 			sidebarStore,
+			mdiChevronDown,
+			mdiChevronUp,
 			mdiFolder,
+			mdiReload,
 			mdiViewGrid,
 			mdiViewList,
 		}
 	},
 	data() {
 		return {
+			isMenuOpen: false,
 			loading: true,
 			dirContentsFiltered: [],
 		}

From 43d93c838f180b8da4ece76d4145d89c078c914b Mon Sep 17 00:00:00 2001
From: Vitor Mattos <1079143+vitormattos@users.noreply.github.com>
Date: Thu, 26 Feb 2026 16:12:45 -0300
Subject: [PATCH 3/4] test(request-picker): add tests for variant prop

Signed-off-by: Vitor Mattos <1079143+vitormattos@users.noreply.github.com>
---
 .../components/Request/RequestPicker.spec.ts  | 33 +++++++++++++++++++
 1 file changed, 33 insertions(+)

diff --git a/src/tests/components/Request/RequestPicker.spec.ts b/src/tests/components/Request/RequestPicker.spec.ts
index ab929bc2c9..9dae0bb490 100644
--- a/src/tests/components/Request/RequestPicker.spec.ts
+++ b/src/tests/components/Request/RequestPicker.spec.ts
@@ -173,6 +173,39 @@ describe('RequestPicker component rules', () => {
 		})
 	})
 
+	describe('variant prop', () => {
+		const mountWithVariantStub = (props = {}) => mount(RequestPicker, {
+			props,
+			global: {
+				stubs: {
+					NcActions: {
+						name: 'NcActions',
+						props: ['variant'],
+						template: '<div class="nc-actions-stub" :data-variant="variant"><slot /></div>',
+					},
+					NcActionButton: true,
+					NcButton: true,
+					NcDialog: true,
+					NcTextField: true,
+					NcLoadingIcon: true,
+					NcNoteCard: true,
+					UploadProgress: true,
+				},
+				mocks: { t: tSimple },
+			},
+		})
+
+		it('defaults variant to tertiary', () => {
+			const w = mountWithVariantStub()
+			expect(w.find('.nc-actions-stub').attributes('data-variant')).toBe('tertiary')
+		})
+
+		it('passes custom variant to NcActions', () => {
+			const w = mountWithVariantStub({ variant: 'primary' })
+			expect(w.find('.nc-actions-stub').attributes('data-variant')).toBe('primary')
+		})
+	})
+
 	describe('envelope support', () => {
 		it('enables envelope mode when capabilities indicate is-available true', () => {
 			getCapabilitiesMock.mockReturnValue({

From 1dd48b2448a9103305fe3a6b1e392d87ae58bc53 Mon Sep 17 00:00:00 2001
From: Vitor Mattos <1079143+vitormattos@users.noreply.github.com>
Date: Thu, 26 Feb 2026 16:12:45 -0300
Subject: [PATCH 4/4] test(files-list): add tests for header restructure and
 reload button

Signed-off-by: Vitor Mattos <1079143+vitormattos@users.noreply.github.com>
---
 src/tests/views/FilesList/FilesList.spec.ts | 57 +++++++++++++++++++--
 1 file changed, 54 insertions(+), 3 deletions(-)

diff --git a/src/tests/views/FilesList/FilesList.spec.ts b/src/tests/views/FilesList/FilesList.spec.ts
index 0703bf671a..bec076cc02 100644
--- a/src/tests/views/FilesList/FilesList.spec.ts
+++ b/src/tests/views/FilesList/FilesList.spec.ts
@@ -74,7 +74,17 @@ vi.mock('@nextcloud/vue/components/NcAppContent', () => ({
 	default: { name: 'NcAppContent', template: '<div><slot /></div>' },
 }))
 vi.mock('@nextcloud/vue/components/NcBreadcrumb', () => ({
-	default: { name: 'NcBreadcrumb', template: '<div><slot name="icon" /></div>' },
+	default: {
+		name: 'NcBreadcrumb',
+		template: '<div><slot name="icon" /><slot name="menu-icon" /><slot /></div>',
+	},
+}))
+vi.mock('@nextcloud/vue/components/NcActionButton', () => ({
+	default: {
+		name: 'NcActionButton',
+		emits: ['click'],
+		template: '<button class="nc-action-button-stub" @click="$emit(\'click\')"><slot /></button>',
+	},
 }))
 vi.mock('@nextcloud/vue/components/NcBreadcrumbs', () => ({
 	default: { name: 'NcBreadcrumbs', template: '<div><slot /><slot name="actions" /></div>' },
@@ -141,6 +151,45 @@ describe('FilesList.vue rendering rules', () => {
 		expect(wrapper.vm.mdiFolder).toBeTruthy()
 		expect(wrapper.vm.mdiViewGrid).toBeTruthy()
 		expect(wrapper.vm.mdiViewList).toBeTruthy()
+		expect(wrapper.vm.mdiChevronDown).toBeTruthy()
+		expect(wrapper.vm.mdiChevronUp).toBeTruthy()
+		expect(wrapper.vm.mdiReload).toBeTruthy()
+	})
+
+	it('initialises isMenuOpen as false', async () => {
+		const filesStore = useFilesStore()
+		vi.spyOn(filesStore, 'getAllFiles').mockResolvedValue({})
+
+		const wrapper = mountComponent()
+		await flushPromises()
+
+		expect(wrapper.vm.isMenuOpen).toBe(false)
+	})
+
+	it('renders RequestPicker before the breadcrumbs in the header', async () => {
+		const filesStore = useFilesStore()
+		vi.spyOn(filesStore, 'getAllFiles').mockResolvedValue({})
+
+		const wrapper = mountComponent()
+		await flushPromises()
+
+		const header = wrapper.find('.files-list__header')
+		const firstChild = header.element.children[0]
+		expect(firstChild.classList.contains('request-picker-stub')).toBe(true)
+	})
+
+	it('calls filesStore.updateAllFiles once more when reload button is clicked', async () => {
+		const filesStore = useFilesStore()
+		vi.spyOn(filesStore, 'getAllFiles').mockResolvedValue({})
+		const updateSpy = vi.spyOn(filesStore, 'updateAllFiles').mockResolvedValue({})
+
+		const wrapper = mountComponent()
+		await flushPromises()
+
+		const callsBefore = updateSpy.mock.calls.length
+		await wrapper.find('.nc-action-button-stub').trigger('click')
+
+		expect(updateSpy.mock.calls.length).toBe(callsBefore + 1)
 	})
 
 	it('shows empty-state request action when user can request sign', async () => {
@@ -186,7 +235,8 @@ describe('FilesList.vue rendering rules', () => {
 		const wrapper = mountComponent()
 		await flushPromises()
 
-		const iconWithPath = wrapper.findAll('.nc-icon').find((node) => !!node.attributes('data-path'))
+		const gridButton = wrapper.find('.files-list__header-grid-button')
+		const iconWithPath = gridButton.findAll('.nc-icon').find((node) => !!node.attributes('data-path'))
 		expect(iconWithPath?.attributes('data-path')).toBe(wrapper.vm.mdiViewGrid)
 	})
 
@@ -199,7 +249,8 @@ describe('FilesList.vue rendering rules', () => {
 		const wrapper = mountComponent()
 		await flushPromises()
 
-		const iconWithPath = wrapper.findAll('.nc-icon').find((node) => !!node.attributes('data-path'))
+		const gridButton = wrapper.find('.files-list__header-grid-button')
+		const iconWithPath = gridButton.findAll('.nc-icon').find((node) => !!node.attributes('data-path'))
 		expect(iconWithPath?.attributes('data-path')).toBe(wrapper.vm.mdiViewList)
 	})
 })