fix(files): router and fileid sidebar open

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

apps/files/src/actions/openFolderAction.ts

@@ -59,7 +59,7 @@ export const action = new FileAction({
 
 		window.OCP.Files.Router.goToRoute(
 			null,
-			{ fileid: undefined },
+			{ view: view.id, fileid: undefined },
 			{ dir: join(dir, node.basename), fileid: undefined },
 		)
 		return null

apps/files/src/actions/sidebarAction.ts

@@ -19,9 +19,11 @@
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
  *
  */
+import type { Navigation } from '../services/Navigation'
+
+import { Permission, type Node } from '@nextcloud/files'
 import { translate as t } from '@nextcloud/l10n'
 import InformationSvg from '@mdi/svg/svg/information-variant.svg?raw'
-import { Permission, type Node } from '@nextcloud/files'
 
 import { registerFileAction, FileAction } from '../services/FileAction'
 import logger from '../logger.js'
@@ -48,11 +50,19 @@ export const action = new FileAction({
 		return (nodes[0].root?.startsWith('/files/') && nodes[0].permissions !== Permission.NONE) ?? false
 	},
 
-	async exec(node: Node) {
+	async exec(node: Node, view: Navigation) {
 		try {
 			// TODO: migrate Sidebar to use a Node instead
 			window?.OCA?.Files?.Sidebar?.open?.(node.path)
 
+			// Silently update current fileid
+			window.OCP.Files.Router.goToRoute(
+				null,
+				{ view: view.id, fileid: node.fileid },
+				{ dir: node.dirname },
+				true,
+			)
+
 			return null
 		} catch (error) {
 			logger.error('Error while opening sidebar', { error })

apps/files/src/actions/viewInFolderAction.ts

@@ -61,7 +61,7 @@ export const action = new FileAction({
 		window.OCP.Files.Router.goToRoute(
 			null,
 			{ view: 'files', fileid: node.fileid },
-			{ dir: node.dirname, fileid: node.fileid },
+			{ dir: node.dirname },
 		)
 		return null
 	},

apps/files/src/components/FileEntry.vue

@@ -377,7 +377,7 @@ export default Vue.extend({
 			return this.selectionStore.selected
 		},
 		isSelected() {
-			return this.selectedFiles.includes(this.source?.fileid?.toString?.())
+			return this.selectedFiles.includes(this.fileid)
 		},
 
 		cropPreviews() {
@@ -481,7 +481,7 @@ export default Vue.extend({
 		},
 
 		isActive() {
-			return this.fileid === this.currentFileId
+			return this.fileid === this.currentFileId?.toString?.()
 		},
 	},
 
@@ -502,16 +502,6 @@ export default Vue.extend({
 		isRenaming() {
 			this.startRenaming()
 		},
-
-		/**
-		 * Open the sidebar if the file is active
-		 */
-		isActive(active) {
-			const Sidebar = window?.OCA?.Files?.Sidebar
-			if (active && Sidebar && Sidebar.file !== this.source.path) {
-				Sidebar.open(this.source.path)
-			}
-		},
 	},
 
 	/**

apps/files/src/components/FilesListVirtual.vue

@@ -68,7 +68,7 @@
 
 <script lang="ts">
 import { translate, translatePlural } from '@nextcloud/l10n'
-import { getFileListHeaders } from '@nextcloud/files'
+import { getFileListHeaders, type Node } from '@nextcloud/files'
 import Vue from 'vue'
 import VirtualList from './VirtualList.vue'
 
@@ -112,6 +112,7 @@ export default Vue.extend({
 		return {
 			FileEntry,
 			headers: getFileListHeaders(),
+			scrollToIndex: 0,
 		}
 	},
 
@@ -124,17 +125,6 @@ export default Vue.extend({
 			return parseInt(this.$route.params.fileid || this.$route.query.fileid) || null
 		},
 
-		scrollToIndex() {
-			if (!this.fileId) {
-				return
-			}
-			const index = this.nodes.findIndex(node => node.fileid === this.fileId)
-			if (index === -1) {
-				showError(this.t('files', 'File not found'))
-			}
-			return Math.max(0, index)
-		},
-
 		summaryFile() {
 			const count = this.files.length
 			return translatePlural('files', '{count} file', '{count} files', count, { count })
@@ -171,12 +161,24 @@ export default Vue.extend({
 	},
 
 	mounted() {
-		// Open the sidebar on the file if it's in the url and
-		// we're just loaded the app for the first time.
-		const Sidebar = window?.OCA?.Files?.Sidebar
-		const node = this.nodes.find(node => node.fileid === this.fileId)
-		if (Sidebar && node) {
-			Sidebar.open(node.path)
+		// Scroll to the file if it's in the url
+		if (this.fileId) {
+			const index = this.nodes.findIndex(node => node.fileid === this.fileId)
+			if (index === -1) {
+				showError(this.t('files', 'File not found'))
+			}
+			this.scrollToIndex = Math.max(0, index)
+		}
+
+		// Open the file sidebar if we have the room for it
+		if (document.documentElement.clientWidth > 1024) {
+			// Open the sidebar on the file if it's in the url and
+			// we're just loaded the app for the first time.
+			const Sidebar = window?.OCA?.Files?.Sidebar
+			const node = this.nodes.find(node => node.fileid === this.fileId) as Node
+			if (Sidebar && node) {
+				Sidebar.open(node.path)
+			}
 		}
 	},
 

apps/files/src/router/router.ts

@@ -38,7 +38,7 @@ const router = new Router({
 		{
 			path: '/',
 			// Pretending we're using the default view
-			alias: '/files',
+			redirect: { name: 'filelist' },
 		},
 		{
 			path: '/:view/:fileid?',

apps/files/src/services/RouterService.ts

@@ -31,6 +31,18 @@ export default class RouterService {
 		this._router = router
 	}
 
+	get name(): string | null | undefined {
+		return this._router.currentRoute.name
+	}
+
+	get query(): Dictionary<string | (string | null)[] | null | undefined> {
+		return this._router.currentRoute.query || {}
+	}
+
+	get params(): Dictionary<string> {
+		return this._router.currentRoute.params || {}
+	}
+
 	/**
 	 * Trigger a route change on the files app
 	 *