4 files changed, 61 insertions, 12 deletions

diff --git a/apps/files/src/components/FileEntry/FavoriteIcon.vue b/apps/files/src/components/FileEntry/FavoriteIcon.vue
index 87684758b43..c66cb8fbd7f 100644
--- a/apps/files/src/components/FileEntry/FavoriteIcon.vue
+++ b/apps/files/src/components/FileEntry/FavoriteIcon.vue
@@ -56,8 +56,8 @@ export default defineComponent({
 	:deep() {
 		svg {
 			// We added a stroke for a11y so we must increase the size to include the stroke
-			width: 26px !important;
-			height: 26px !important;
+			width: 20px !important;
+			height: 20px !important;
 
 			// Override NcIconSvgWrapper defaults of 20px
 			max-width: unset !important;
diff --git a/apps/files/src/components/FileEntry/FileEntryActions.vue b/apps/files/src/components/FileEntry/FileEntryActions.vue
index c130ab49c0a..5c537d878fe 100644
--- a/apps/files/src/components/FileEntry/FileEntryActions.vue
+++ b/apps/files/src/components/FileEntry/FileEntryActions.vue
@@ -25,15 +25,16 @@
 			:open="openedMenu"
 			@close="onMenuClose"
 			@closed="onMenuClosed">
-			<!-- Default actions list-->
-			<NcActionButton v-for="action, index in enabledMenuActions"
+			<!-- Non-destructive actions list -->
+			<!-- Please keep this block in sync with the destructive actions block below -->
+			<NcActionButton v-for="action, index in renderedNonDestructiveActions"
 				:key="action.id"
 				:ref="`action-${action.id}`"
 				class="files-list__row-action"
 				:class="{
 					[`files-list__row-action-${action.id}`]: true,
 					'files-list__row-action--inline': index < enabledInlineActions.length,
-					'files-list__row-action--menu': isValidMenu(action)
+					'files-list__row-action--menu': isValidMenu(action),
 				}"
 				:close-after-click="!isValidMenu(action)"
 				:data-cy-files-list-row-action="action.id"
@@ -50,6 +51,35 @@
 				{{ actionDisplayName(action) }}
 			</NcActionButton>
 
+			<!-- Destructive actions list -->
+			<template v-if="renderedDestructiveActions.length > 0">
+				<NcActionSeparator />
+				<NcActionButton v-for="action, index in renderedDestructiveActions"
+					:key="action.id"
+					:ref="`action-${action.id}`"
+					class="files-list__row-action"
+					:class="{
+						[`files-list__row-action-${action.id}`]: true,
+						'files-list__row-action--inline': index < enabledInlineActions.length,
+						'files-list__row-action--menu': isValidMenu(action),
+						'files-list__row-action--destructive': true,
+					}"
+					:close-after-click="!isValidMenu(action)"
+					:data-cy-files-list-row-action="action.id"
+					:is-menu="isValidMenu(action)"
+					:aria-label="action.title?.([source], currentView)"
+					:title="action.title?.([source], currentView)"
+					@click="onActionClick(action)">
+					<template #icon>
+						<NcLoadingIcon v-if="isLoadingAction(action)" />
+						<NcIconSvgWrapper v-else
+							class="files-list__row-action-icon"
+							:svg="action.iconSvgInline([source], currentView)" />
+					</template>
+					{{ actionDisplayName(action) }}
+				</NcActionButton>
+			</template>
+
 			<!-- Submenu actions list-->
 			<template v-if="openedSubmenu && enabledSubmenuActions[openedSubmenu?.id]">
 				<!-- Back to top-level button -->
@@ -68,10 +98,11 @@
 					class="files-list__row-action--submenu"
 					close-after-click
 					:data-cy-files-list-row-action="action.id"
+					:aria-label="action.title?.([source], currentView)"
 					:title="action.title?.([source], currentView)"
 					@click="onActionClick(action)">
 					<template #icon>
-						<NcLoadingIcon v-if="isLoadingAction(action)" :size="18" />
+						<NcLoadingIcon v-if="isLoadingAction(action)" />
 						<NcIconSvgWrapper v-else :svg="action.iconSvgInline([source], currentView)" />
 					</template>
 					{{ actionDisplayName(action) }}
@@ -211,6 +242,14 @@ export default defineComponent({
 			return actions.filter(action => !(action.parent && topActionsIds.includes(action.parent)))
 		},
 
+		renderedNonDestructiveActions() {
+			return this.enabledMenuActions.filter(action => !action.destructive)
+		},
+
+		renderedDestructiveActions() {
+			return this.enabledMenuActions.filter(action => action.destructive)
+		},
+
 		openedMenu: {
 			get() {
 				return this.opened
@@ -281,7 +320,7 @@ export default defineComponent({
 			}
 
 			// Make sure we set the node as active
-			this.activeStore.setActiveNode(this.source)
+			this.activeStore.activeNode = this.source
 
 			// Execute the action
 			await executeAction(action)
@@ -349,5 +388,12 @@ main.app-content[style*="mouse-pos-x"] .v-popper__popper {
 		max-height: var(--max-icon-size) !important;
 		max-width: var(--max-icon-size) !important;
 	}
+
+	&.files-list__row-action--destructive {
+		::deep(button) {
+			color: var(--color-error) !important;
+		}
+	}
 }
+
 </style>
diff --git a/apps/files/src/components/FileEntry/FileEntryName.vue b/apps/files/src/components/FileEntry/FileEntryName.vue
index 2fec9e5d556..418f9581eb6 100644
--- a/apps/files/src/components/FileEntry/FileEntryName.vue
+++ b/apps/files/src/components/FileEntry/FileEntryName.vue
@@ -30,7 +30,7 @@
 		<span class="files-list__row-name-text" dir="auto">
 			<!-- 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 v-if="userConfigStore.userConfig.show_files_extensions" class="files-list__row-name-ext" v-text="extension" />
 		</span>
 	</component>
 </template>
@@ -46,11 +46,12 @@ import { defineComponent, inject } from 'vue'
 
 import NcTextField from '@nextcloud/vue/components/NcTextField'
 
-import { useNavigation } from '../../composables/useNavigation'
+import { getFilenameValidity } from '../../utils/filenameValidity.ts'
 import { useFileListWidth } from '../../composables/useFileListWidth.ts'
-import { useRouteParameters } from '../../composables/useRouteParameters.ts'
+import { useNavigation } from '../../composables/useNavigation.ts'
 import { useRenamingStore } from '../../store/renaming.ts'
-import { getFilenameValidity } from '../../utils/filenameValidity.ts'
+import { useRouteParameters } from '../../composables/useRouteParameters.ts'
+import { useUserConfigStore } from '../../store/userconfig.ts'
 import logger from '../../logger.ts'
 
 export default defineComponent({
@@ -95,6 +96,7 @@ export default defineComponent({
 		const { directory } = useRouteParameters()
 		const filesListWidth = useFileListWidth()
 		const renamingStore = useRenamingStore()
+		const userConfigStore = useUserConfigStore()
 
 		const defaultFileAction = inject<FileAction | undefined>('defaultFileAction')
 
@@ -105,6 +107,7 @@ export default defineComponent({
 			filesListWidth,
 
 			renamingStore,
+			userConfigStore,
 		}
 	},
 
diff --git a/apps/files/src/components/FileEntry/FileEntryPreview.vue b/apps/files/src/components/FileEntry/FileEntryPreview.vue
index 506677b49af..3d0fffe7584 100644
--- a/apps/files/src/components/FileEntry/FileEntryPreview.vue
+++ b/apps/files/src/components/FileEntry/FileEntryPreview.vue
@@ -64,7 +64,7 @@ import FolderIcon from 'vue-material-design-icons/Folder.vue'
 import FolderOpenIcon from 'vue-material-design-icons/FolderOpen.vue'
 import KeyIcon from 'vue-material-design-icons/Key.vue'
 import LinkIcon from 'vue-material-design-icons/Link.vue'
-import NetworkIcon from 'vue-material-design-icons/Network.vue'
+import NetworkIcon from 'vue-material-design-icons/NetworkOutline.vue'
 import TagIcon from 'vue-material-design-icons/Tag.vue'
 import PlayCircleIcon from 'vue-material-design-icons/PlayCircle.vue'