import { formatFileSize } from '@nextcloud/files'
import moment from '@nextcloud/moment'
-import { useNavigation } from '../composables/useNavigation'
+import { useNavigation } from '../composables/useNavigation.ts'
+import { useRouteParameters } from '../composables/useRouteParameters.ts'
import { useActionsMenuStore } from '../store/actionsmenu.ts'
import { useDragAndDropStore } from '../store/dragging.ts'
import { useFilesStore } from '../store/files.ts'
const renamingStore = useRenamingStore()
const selectionStore = useSelectionStore()
const { currentView } = useNavigation()
+ const {
+ directory: currentDir,
+ fileId: currentFileId,
+ } = useRouteParameters()
return {
actionsMenuStore,
renamingStore,
selectionStore,
+ currentDir,
+ currentFileId,
currentView,
}
},
import NcDateTime from '@nextcloud/vue/dist/Components/NcDateTime.js'
-import { useNavigation } from '../composables/useNavigation'
+import { useNavigation } from '../composables/useNavigation.ts'
+import { useRouteParameters } from '../composables/useRouteParameters.ts'
import { useActionsMenuStore } from '../store/actionsmenu.ts'
import { useDragAndDropStore } from '../store/dragging.ts'
import { useFilesStore } from '../store/files.ts'
const renamingStore = useRenamingStore()
const selectionStore = useSelectionStore()
const { currentView } = useNavigation()
+ const {
+ directory: currentDir,
+ fileId: currentFileId,
+ } = useRouteParameters()
return {
actionsMenuStore,
renamingStore,
selectionStore,
+ currentDir,
+ currentFileId,
currentView,
}
},
},
computed: {
- currentDir() {
- // Remove any trailing slash but leave root slash
- return (this.$route.query?.dir?.toString() || '/').replace(/^(.+)\/$/, '$1')
- },
- currentFileId() {
- return this.$route.params?.fileid || this.$route.query?.fileid || null
- },
-
fileid() {
return this.source.fileid ?? 0
},
+
uniqueId() {
return hashCode(this.source.source)
},
import { defineComponent } from 'vue'
import { action as sidebarAction } from '../actions/sidebarAction.ts'
+import { useRouteParameters } from '../composables/useRouteParameters.ts'
import { getSummaryFor } from '../utils/fileUtils'
import { useSelectionStore } from '../store/selection.js'
import { useUserConfigStore } from '../store/userconfig.ts'
setup() {
const userConfigStore = useUserConfigStore()
const selectionStore = useSelectionStore()
+ const { fileId, openFile } = useRouteParameters()
+
return {
+ fileId,
+ openFile,
+
userConfigStore,
selectionStore,
}
return this.userConfigStore.userConfig
},
- fileId() {
- return Number.parseInt(this.$route.params.fileid ?? '0') || null
- },
-
- /**
- * If the current `fileId` should be opened
- * The state of the `openfile` query param
- */
- openFile() {
- return !!this.$route.query.openfile
- },
-
summary() {
return getSummaryFor(this.nodes)
},
--- /dev/null
+/*!
+ * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+import { computed } from 'vue'
+import { useRoute } from 'vue-router/composables'
+
+/**
+ * Get information about the current route
+ */
+export function useRouteParameters() {
+
+ const route = useRoute()
+
+ /**
+ * Get the path of the current active directory
+ */
+ const directory = computed<string>(
+ () => String(route.query.dir || '/')
+ // Remove any trailing slash but leave root slash
+ .replace(/^(.+)\/$/, '$1')
+ )
+
+ /**
+ * Get the current fileId used on the route
+ */
+ const fileId = computed<number | null>(() => {
+ const fileId = Number.parseInt(route.params.fileid ?? '0') || null
+ return Number.isNaN(fileId) ? null : fileId
+ })
+
+ /**
+ * State of `openFile` route param
+ */
+ const openFile = computed<boolean>(() => 'openFile' in route.params && route.params.openFile.toLocaleLowerCase() !== 'false')
+
+ return {
+ /** Path of currently open directory */
+ directory,
+
+ /** Current active fileId */
+ fileId,
+
+ /** Should the active node should be opened (`openFile` route param) */
+ openFile,
+ }
+}
<NcAppContent :page-heading="pageHeading" data-cy-files-content>
<div class="files-list__header">
<!-- Current folder breadcrumbs -->
- <BreadCrumbs :path="dir" @reload="fetchContent">
+ <BreadCrumbs :path="directory" @reload="fetchContent">
<template #actions>
<!-- Sharing button -->
<NcButton v-if="canShare && filesListWidth >= 512"
:name="currentView?.emptyTitle || t('files', 'No files in here')"
:description="currentView?.emptyCaption || t('files', 'Upload some content or sync with your devices!')"
data-cy-files-content-empty>
- <template v-if="dir !== '/'" #action>
+ <template v-if="directory !== '/'" #action>
<!-- Uploader -->
<UploadPicker v-if="currentFolder && canUpload && !isQuotaExceeded"
allow-folders
import { action as sidebarAction } from '../actions/sidebarAction.ts'
import { useNavigation } from '../composables/useNavigation.ts'
+import { useRouteParameters } from '../composables/useRouteParameters.ts'
import { useFilesStore } from '../store/files.ts'
import { useFiltersStore } from '../store/filters.ts'
import { usePathsStore } from '../store/paths.ts'
const userConfigStore = useUserConfigStore()
const viewConfigStore = useViewConfigStore()
const { currentView } = useNavigation()
+ const { directory, fileId } = useRouteParameters()
const enableGridView = (loadState('core', 'config', [])['enable_non-accessible_features'] ?? true)
const forbiddenCharacters = loadState<string[]>('files', 'forbiddenCharacters', [])
return {
currentView,
+ directory,
+ fileId,
t,
filesStore,
return this.currentView?.name ?? t('files', 'Files')
},
- /**
- * The current directory query.
- */
- dir(): string {
- // Remove any trailing slash but leave root slash
- return (this.$route?.query?.dir?.toString() || '/').replace(/^(.+)\/$/, '$1')
- },
-
- /**
- * The current file id
- */
- fileId(): number | null {
- const number = Number.parseInt(this.$route?.params.fileid ?? '')
- return Number.isNaN(number) ? null : number
- },
-
/**
* The current folder.
*/
return
}
- if (this.dir === '/') {
+ if (this.directory === '/') {
return this.filesStore.getRoot(this.currentView.id)
}
- const source = this.pathsStore.getPath(this.currentView.id, this.dir)
+ const source = this.pathsStore.getPath(this.currentView.id, this.directory)
if (source === undefined) {
return
}
* Route to the previous directory.
*/
toPreviousDir(): Route {
- const dir = this.dir.split('/').slice(0, -1).join('/') || '/'
+ const dir = this.directory.split('/').slice(0, -1).join('/') || '/'
return { ...this.$route, query: { dir } }
},
this.fetchContent()
},
- dir(newDir, oldDir) {
+ directory(newDir, oldDir) {
logger.debug('Directory changed', { newDir, oldDir })
// TODO: preserve selection on browsing?
this.selectionStore.reset()
methods: {
async fetchContent() {
this.loading = true
- const dir = this.dir
+ const dir = this.directory
const currentView = this.currentView
if (!currentView) {
// in this case we need to keep the current view but move to the parent directory
window.OCP.Files.Router.goToRoute(
null,
- { view: this.$route.params.view },
+ { view: this.currentView!.id },
{ dir: this.currentFolder?.dirname ?? '/' },
)
} else {
projects / nextcloud-server.git / commitdiff