diff --git a/changelog/unreleased/enhancement-condensed-files-view b/changelog/unreleased/enhancement-condensed-files-view
new file mode 100644
index 00000000000..13d29f8b74a
--- /dev/null
+++ b/changelog/unreleased/enhancement-condensed-files-view
@@ -0,0 +1,7 @@
+Enhancement: Add switch to enable condensed resource table
+
+We've added a switch to have a more condensed resource table.
+The change gets saved to the route and persisted across resource navigation.
+
+https://github.com/owncloud/web/pull/7976
+https://github.com/owncloud/web/issues/6380
diff --git a/packages/design-system/changelog/unreleased/enhancement-condensed-menu-item b/packages/design-system/changelog/unreleased/enhancement-condensed-menu-item
new file mode 100644
index 00000000000..f08c2697deb
--- /dev/null
+++ b/packages/design-system/changelog/unreleased/enhancement-condensed-menu-item
@@ -0,0 +1,5 @@
+Enhancement: Add condensed menu icon
+
+We added a new menu icon for the switch between condensed and regular resource table.
+
+https://github.com/owncloud/web/pull/7976
diff --git a/packages/design-system/src/assets/icons/menu-line-condensed.svg b/packages/design-system/src/assets/icons/menu-line-condensed.svg
new file mode 100644
index 00000000000..b58809824ed
--- /dev/null
+++ b/packages/design-system/src/assets/icons/menu-line-condensed.svg
@@ -0,0 +1,6 @@
+
diff --git a/packages/web-app-files/src/components/AppBar/ViewOptions.vue b/packages/web-app-files/src/components/AppBar/ViewOptions.vue
index 1cc92330cb6..54689bfa853 100644
--- a/packages/web-app-files/src/components/AppBar/ViewOptions.vue
+++ b/packages/web-app-files/src/components/AppBar/ViewOptions.vue
@@ -1,5 +1,19 @@
-
+
+
+
+
+
+
+
+
+
import { mapMutations, mapState } from 'vuex'
import { useRouteQueryPersisted } from 'web-pkg/src/composables'
-import { PaginationConstants } from '../../composables'
+import { PaginationConstants, ViewModeConstants } from '../../composables'
export default {
setup() {
@@ -58,8 +72,14 @@ export default {
name: PaginationConstants.perPageQueryName,
defaultValue: PaginationConstants.perPageDefault
})
+ const viewModeQuery = useRouteQueryPersisted({
+ name: ViewModeConstants.queryName,
+ defaultValue: ViewModeConstants.default
+ })
return {
+ ViewModeConstants,
+ viewModeCurrent: viewModeQuery,
itemsPerPage: perPageQuery
}
},
@@ -90,7 +110,10 @@ export default {
}
},
methods: {
- ...mapMutations('Files', ['SET_HIDDEN_FILES_VISIBILITY', 'SET_FILE_EXTENSIONS_VISIBILITY'])
+ ...mapMutations('Files', ['SET_HIDDEN_FILES_VISIBILITY', 'SET_FILE_EXTENSIONS_VISIBILITY']),
+ setViewMode(mode) {
+ this.viewModeCurrent = mode
+ }
}
}
diff --git a/packages/web-app-files/src/components/FilesList/ResourceTable.vue b/packages/web-app-files/src/components/FilesList/ResourceTable.vue
index 5ed65dbba19..cf5238df7b7 100644
--- a/packages/web-app-files/src/components/FilesList/ResourceTable.vue
+++ b/packages/web-app-files/src/components/FilesList/ResourceTable.vue
@@ -1,6 +1,9 @@