1 files changed, 46 insertions, 12 deletions

diff --git a/apps/files/src/components/FilesListTableHeader.vue b/apps/files/src/components/FilesListTableHeader.vue
index 7134c957fb8..23e631199eb 100644
--- a/apps/files/src/components/FilesListTableHeader.vue
+++ b/apps/files/src/components/FilesListTableHeader.vue
@@ -6,7 +6,7 @@
 	<tr class="files-list__row-head">
 		<th class="files-list__column files-list__row-checkbox"
 			@keyup.esc.exact="resetSelection">
-			<NcCheckboxRadioSwitch v-bind="selectAllBind" @update:checked="onToggleAll" />
+			<NcCheckboxRadioSwitch v-bind="selectAllBind" data-cy-files-list-selection-checkbox @update:checked="onToggleAll" />
 		</th>
 
 		<!-- Columns display -->
@@ -24,6 +24,14 @@
 		<!-- Actions -->
 		<th class="files-list__row-actions" />
 
+		<!-- Mime -->
+		<th v-if="isMimeAvailable"
+			class="files-list__column files-list__row-mime"
+			:class="{ 'files-list__column--sortable': isMimeAvailable }"
+			:aria-sort="ariaSortForMode('mime')">
+			<FilesListTableHeaderButton :name="t('files', 'File type')" mode="mime" />
+		</th>
+
 		<!-- Size -->
 		<th v-if="isSizeAvailable"
 			class="files-list__column files-list__row-size"
@@ -54,17 +62,21 @@
 </template>
 
 <script lang="ts">
+import type { Node } from '@nextcloud/files'
+import type { PropType } from 'vue'
+import type { FileSource } from '../types.ts'
+
 import { translate as t } from '@nextcloud/l10n'
-import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
-import { defineComponent, type PropType } from 'vue'
+import { useHotKey } from '@nextcloud/vue/composables/useHotKey'
+import { defineComponent } from 'vue'
+import NcCheckboxRadioSwitch from '@nextcloud/vue/components/NcCheckboxRadioSwitch'
 
 import { useFilesStore } from '../store/files.ts'
+import { useNavigation } from '../composables/useNavigation'
 import { useSelectionStore } from '../store/selection.ts'
 import FilesListTableHeaderButton from './FilesListTableHeaderButton.vue'
 import filesSortingMixin from '../mixins/filesSorting.ts'
-import logger from '../logger.js'
-import type { Node } from '@nextcloud/files'
-import type { FileSource } from '../types.ts'
+import logger from '../logger.ts'
 
 export default defineComponent({
 	name: 'FilesListTableHeader',
@@ -79,6 +91,10 @@ export default defineComponent({
 	],
 
 	props: {
+		isMimeAvailable: {
+			type: Boolean,
+			default: false,
+		},
 		isMtimeAvailable: {
 			type: Boolean,
 			default: false,
@@ -100,17 +116,17 @@ export default defineComponent({
 	setup() {
 		const filesStore = useFilesStore()
 		const selectionStore = useSelectionStore()
+		const { currentView } = useNavigation()
+
 		return {
 			filesStore,
 			selectionStore,
+
+			currentView,
 		}
 	},
 
 	computed: {
-		currentView() {
-			return this.$navigation.active
-		},
-
 		columns() {
 			// Hide columns if the list is too small
 			if (this.filesListWidth < 512) {
@@ -151,8 +167,23 @@ export default defineComponent({
 		},
 	},
 
+	created() {
+		// ctrl+a selects all
+		useHotKey('a', this.onToggleAll, {
+			ctrl: true,
+			stop: true,
+			prevent: true,
+		})
+
+		// Escape key cancels selection
+		useHotKey('Escape', this.resetSelection, {
+			stop: true,
+			prevent: true,
+		})
+	},
+
 	methods: {
-		ariaSortForMode(mode: string): ARIAMixin['ariaSort'] {
+		ariaSortForMode(mode: string): 'ascending'|'descending'|null {
 			if (this.sortingMode === mode) {
 				return this.isAscSorting ? 'ascending' : 'descending'
 			}
@@ -168,7 +199,7 @@ export default defineComponent({
 			}
 		},
 
-		onToggleAll(selected) {
+		onToggleAll(selected = true) {
 			if (selected) {
 				const selection = this.nodes.map(node => node.source).filter(Boolean) as FileSource[]
 				logger.debug('Added all nodes to selection', { selection })
@@ -181,6 +212,9 @@ export default defineComponent({
 		},
 
 		resetSelection() {
+			if (this.isNoneSelected) {
+				return
+			}
 			this.selectionStore.reset()
 		},