feat(files): add sidebar action

Signed-off-by: John Molakvoæ <skjnldsv@protonmail.com>

3 files changed, 68 insertions, 3 deletions

diff --git a/apps/files/src/actions/sidebarAction.ts b/apps/files/src/actions/sidebarAction.ts
new file mode 100644
index 00000000000..f56d3a9475f
--- /dev/null
+++ b/apps/files/src/actions/sidebarAction.ts
@@ -0,0 +1,54 @@
+/**
+ * @copyright Copyright (c) 2023 John Molakvoæ <skjnldsv@protonmail.com>
+ *
+ * @author John Molakvoæ <skjnldsv@protonmail.com>
+ *
+ * @license AGPL-3.0-or-later
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+import { translate as t } from '@nextcloud/l10n'
+import InformationSvg from '@mdi/svg/svg/information-variant.svg?raw'
+import type { Node } from '@nextcloud/files'
+
+import { registerFileAction, FileAction } from '../services/FileAction.ts'
+import logger from '../logger.js'
+
+export const ACTION_DETAILS = 'details'
+
+registerFileAction(new FileAction({
+	id: ACTION_DETAILS,
+	displayName: () => t('files', 'Details'),
+	iconSvgInline: () => InformationSvg,
+
+	// Sidebar currently supports user folder only, /files/USER
+	enabled: (files: Node[]) => !!window?.OCA?.Files?.Sidebar
+		&& files.some(node => node.root?.startsWith('/files/')),
+
+	async exec(node: Node) {
+		try {
+			// TODO: migrate Sidebar to use a Node instead
+			window?.OCA?.Files?.Sidebar?.open?.(node.path)
+
+			return null
+		} catch (error) {
+			logger.error('Error while opening sidebar', { error })
+			return false
+		}
+	},
+
+	default: true,
+	order: -50,
+}))
diff --git a/apps/files/src/components/FileEntry.vue b/apps/files/src/components/FileEntry.vue
index c42327e8821..215a8fdbbc7 100644
--- a/apps/files/src/components/FileEntry.vue
+++ b/apps/files/src/components/FileEntry.vue
@@ -95,7 +95,7 @@
 		<td v-if="isSizeAvailable"
 			:style="{ opacity: sizeOpacity }"
 			class="files-list__row-size"
-			@click="execDefaultAction">
+			@click="openDetailsIfAvailable">
 			<span>{{ size }}</span>
 		</td>
 
@@ -104,7 +104,7 @@
 			:key="column.id"
 			:class="`files-list__row-${currentView?.id}-${column.id}`"
 			class="files-list__row-column-custom"
-			@click="execDefaultAction">
+			@click="openDetailsIfAvailable">
 			<CustomElementRender v-if="active"
 				:current-view="currentView"
 				:render="column.render"
@@ -130,6 +130,7 @@ import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
 import StarIcon from 'vue-material-design-icons/Star.vue'
 import Vue from 'vue'
 
+import { ACTION_DETAILS } from '../actions/sidebarAction.ts'
 import { getFileActions } from '../services/FileAction.ts'
 import { hashCode } from '../utils/hashUtils.ts'
 import { isCachedPreview } from '../services/PreviewService.ts'
@@ -532,6 +533,15 @@ export default Vue.extend({
 			}
 		},
 
+		openDetailsIfAvailable(event) {
+			const detailsAction = this.enabledDefaultActions.find(action => action.id === ACTION_DETAILS)
+			if (detailsAction) {
+				event.preventDefault()
+				event.stopPropagation()
+				detailsAction.exec(this.source, this.currentView)
+			}
+		},
+
 		onSelectionChange(selection) {
 			const newSelectedIndex = this.index
 			const lastSelectedIndex = this.selectionStore.lastSelectedIndex
diff --git a/apps/files/src/main.ts b/apps/files/src/main.ts
index 976714a8f1f..195357d0e0a 100644
--- a/apps/files/src/main.ts
+++ b/apps/files/src/main.ts
@@ -1,6 +1,7 @@
 import './templates.js'
 import './legacy/filelistSearch.js'
 import './actions/deleteAction'
+import './actions/sidebarAction'
 
 import Vue from 'vue'
 import { createPinia, PiniaVuePlugin } from 'pinia'
@@ -11,9 +12,9 @@ import NavigationView from './views/Navigation.vue'
 import processLegacyFilesViews from './legacy/navigationMapper.js'
 import registerPreviewServiceWorker from './services/ServiceWorker.js'
 import router from './router/router.js'
+import RouterService from './services/RouterService'
 import SettingsModel from './models/Setting.js'
 import SettingsService from './services/Settings.js'
-import RouterService from './services/RouterService'
 
 declare global {
 	interface Window {