From 4ae3a13c9290cb7e8288d750d8e3e71367ce09ec Mon Sep 17 00:00:00 2001
From: Jannik Stehle <j.stehle@opencloud.eu>
Date: Thu, 24 Jul 2025 11:15:21 +0200
Subject: [PATCH 1/2] feat: improve tile sort menu drop and drawer design

---
 .../components/FilesList/ResourceTiles.vue    | 46 ++++++++-----------
 .../FilesList/ResourceTiles.spec.ts           |  4 +-
 2 files changed, 22 insertions(+), 28 deletions(-)

diff --git a/packages/web-pkg/src/components/FilesList/ResourceTiles.vue b/packages/web-pkg/src/components/FilesList/ResourceTiles.vue
index 8b81a1adc6..30f884ca88 100644
--- a/packages/web-pkg/src/components/FilesList/ResourceTiles.vue
+++ b/packages/web-pkg/src/components/FilesList/ResourceTiles.vue
@@ -15,30 +15,28 @@
       <div v-if="sortFields.length" class="oc-tiles-sort">
         <oc-filter-chip
           class="oc-tiles-sort-filter-chip"
-          :filter-label="currentSortField.label"
-          :selected-item-names="[]"
+          :filter-label="$gettext('Sort by')"
+          :selected-item-names="[currentSortField.label]"
+          :has-active-state="false"
           close-on-click
           raw
         >
           <template #default>
-            <oc-button
-              v-for="(option, index) in sortFields"
-              :key="index"
-              appearance="raw"
-              size="medium"
-              justify-content="space-between"
-              class="oc-tiles-sort-filter-chip-item oc-flex oc-flex-middle oc-width-1-1 oc-p-s"
-              :class="{
-                'oc-tiles-sort-filter-chip-item-active': currentSortField === option,
-                'oc-mt-xs': index > 0
-              }"
-              @click="selectSorting(option)"
-            >
-              <span>{{ option.label }}</span>
-              <div v-if="option === currentSortField" class="oc-flex">
-                <oc-icon name="check" />
-              </div>
-            </oc-button>
+            <oc-list>
+              <li v-for="(option, index) in sortFields" :key="index">
+                <oc-button
+                  appearance="raw"
+                  :class="{ 'oc-secondary-container': currentSortField === option }"
+                  class="oc-tiles-sort-filter-chip-item"
+                  @click="selectSorting(option)"
+                >
+                  <span>{{ option.label }}</span>
+                  <div v-if="option === currentSortField" class="oc-flex">
+                    <oc-icon name="check" />
+                  </div>
+                </oc-button>
+              </li>
+            </oc-list>
           </template>
         </oc-filter-chip>
       </div>
@@ -624,12 +622,8 @@ onBeforeUnmount(() => {
       font-size: var(--oc-font-size-default);
     }
 
-    &-item-active {
-      background-color: var(--oc-role-secondary-container) !important;
-    }
-
-    &-item:hover:not(&-item-active) {
-      background-color: var(--oc-role-surface-container) !important;
+    &-item {
+      justify-content: space-between !important;
     }
   }
 }
diff --git a/packages/web-pkg/tests/unit/components/FilesList/ResourceTiles.spec.ts b/packages/web-pkg/tests/unit/components/FilesList/ResourceTiles.spec.ts
index 5fe9595008..0d73c29bc8 100644
--- a/packages/web-pkg/tests/unit/components/FilesList/ResourceTiles.spec.ts
+++ b/packages/web-pkg/tests/unit/components/FilesList/ResourceTiles.spec.ts
@@ -185,8 +185,8 @@ describe('ResourceTiles component', () => {
       const { wrapper } = getWrapper({ props: { sortFields } })
       const filterChip = wrapper.findComponent<typeof OcFilterChip>({ name: 'oc-filter-chip' })
       await filterChip.trigger('click')
-      const sortItem = filterChip.find('.oc-tiles-sort-filter-chip-item:nth-child(2)')
-      await sortItem.trigger('click')
+      const sortItem = filterChip.findAll('.oc-tiles-sort-filter-chip-item')
+      await sortItem[1].trigger('click')
       expect(wrapper.emitted('sort')).toBeTruthy()
     })
   })

From c341039f0a63d226d0526587e60050f678dc3423 Mon Sep 17 00:00:00 2001
From: Jannik Stehle <j.stehle@opencloud.eu>
Date: Thu, 24 Jul 2025 11:19:26 +0200
Subject: [PATCH 2/2] fix: add missing file name to app-top-bar context menu

---
 packages/web-pkg/src/components/AppTopBar.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/web-pkg/src/components/AppTopBar.vue b/packages/web-pkg/src/components/AppTopBar.vue
index d2c4f2b047..27399495aa 100644
--- a/packages/web-pkg/src/components/AppTopBar.vue
+++ b/packages/web-pkg/src/components/AppTopBar.vue
@@ -36,6 +36,7 @@
               padding-size="small"
               toggle="#oc-openfile-contextmenu-trigger"
               close-on-click
+              :title="resource.name"
               @click.stop.prevent
             >
               <context-action-menu