chore(upgrade): from OC.Files to nextcloud/files

Signed-off-by: Max <max@nextcloud.com>

Author: max-nextcloud

src/components/Menu/ActionInsertLink.vue

@@ -38,7 +38,7 @@
 			ref="buttonFile"
 			:disabled="!networkOnline"
 			:data-text-action-entry="`${actionEntry.key}-file`"
-			@click="linkFile">
+			@click="linkFileAndCloseMenu">
 			<template #icon>
 				<Document />
 			</template>
@@ -81,7 +81,6 @@
 
 <script>
 import { loadState } from '@nextcloud/initial-state'
-import { generateUrl } from '@nextcloud/router'
 import NcActionButton from '@nextcloud/vue/components/NcActionButton'
 import NcActionInput from '@nextcloud/vue/components/NcActionInput'
 import NcActions from '@nextcloud/vue/components/NcActions'
@@ -90,10 +89,9 @@ import { getLinkWithPicker } from '@nextcloud/vue/dist/Components/NcRichText.js'
 import { getMarkAttributes, isActive } from '@tiptap/core'
 
 import { t } from '@nextcloud/l10n'
-import { ref } from 'vue'
 import { useFileProps } from '../../composables/useFileProps.ts'
+import { useLinkFile } from '../../composables/useLinkFile.ts'
 import { useNetworkState } from '../../composables/useNetworkState.ts'
-import { buildFilePicker } from '../../helpers/filePicker.js'
 import { Document, LinkOff, Loading, Shape, Web } from '../icons.js'
 import { BaseActionEntry } from './BaseActionEntry.js'
 import { useMenuIDMixin } from './MenuBar.provider.js'
@@ -113,14 +111,14 @@ export default {
 	extends: BaseActionEntry,
 	mixins: [useMenuIDMixin],
 	setup() {
+		const base = BaseActionEntry.setup()
 		const { networkOnline } = useNetworkState()
 		const { relativePath } = useFileProps()
-		const parentPath = (relativePath ?? '/').split('/').slice(0, -1).join('/')
-		const startPath = ref(parentPath)
+		const { linkFile } = useLinkFile({ editor: base.editor, relativePath })
 		return {
-			...BaseActionEntry.setup(),
+			...base,
+			linkFile,
 			networkOnline,
-			startPath,
 		}
 	},
 	data: () => {
@@ -143,30 +141,11 @@ export default {
 		 * Open dialog and ask user which file to link to
 		 * Triggered by the "link file" button
 		 */
-		linkFile() {
-			const filePicker = buildFilePicker(this.startPath)
-
-			filePicker
-				.pick()
-				.then((file) => {
-					const client = OC.Files.getClient()
-					client.getFileInfo(file).then((_status, fileInfo) => {
-						const url = new URL(
-							generateUrl(`/f/${fileInfo.id}`),
-							window.origin,
-						)
-						this.setLink(url.href, fileInfo.name)
-						this.startPath =
-							fileInfo.path
-							+ (fileInfo.type === 'dir' ? `/${fileInfo.name}/` : '')
-					})
-					this.menuOpen = false
-				})
-				.catch(() => {
-					// do not close menu but keep focus
-					this.$refs.buttonFile?.$el.focus()
-				})
+		async linkFileAndCloseMenu() {
+			await this.linkFile()
+			this.menuOpen = false
 		},
+
 		/**
 		 * Allow user to enter an URL manually
 		 * Triggered when by the "link url" button

src/components/SuggestionsBar.vue

@@ -58,16 +58,14 @@
 
 <script>
 import { t } from '@nextcloud/l10n'
-import { generateUrl } from '@nextcloud/router'
 import NcButton from '@nextcloud/vue/components/NcButton'
 import { getLinkWithPicker } from '@nextcloud/vue/dist/Components/NcRichText.js'
-import { ref } from 'vue'
 import { Document, Shape, Table as TableIcon, Upload } from '../components/icons.js'
 import { useConnection } from '../composables/useConnection.ts'
 import { useEditor } from '../composables/useEditor.ts'
 import { useFileProps } from '../composables/useFileProps.ts'
+import { useLinkFile } from '../composables/useLinkFile.ts'
 import { useNetworkState } from '../composables/useNetworkState.ts'
-import { buildFilePicker } from '../helpers/filePicker.js'
 import { isMobileDevice } from '../helpers/isMobileDevice.js'
 import { useActionChooseLocalAttachmentMixin } from './Editor/MediaHandler.provider.js'
 
@@ -88,14 +86,13 @@ export default {
 		const { openData } = useConnection()
 		const { networkOnline } = useNetworkState()
 		const { relativePath } = useFileProps()
-		const parentPath = (relativePath ?? '/').split('/').slice(0, -1).join('/')
-		const startPath = ref(parentPath)
+		const { linkFile } = useLinkFile({ editor, relativePath })
 		return {
 			editor,
 			isMobileDevice,
+			linkFile,
 			networkOnline,
 			openData,
-			startPath,
 		}
 	},
 
@@ -106,9 +103,6 @@ export default {
 	},
 
 	computed: {
-		relativePath() {
-			return this.$file?.relativePath ?? '/'
-		},
 		isUploadDisabled() {
 			return !this.openData?.hasOwner || !this.networkOnline
 		},
@@ -163,45 +157,6 @@ export default {
 			this.editor.chain().focus().insertTable()?.run()
 		},
 
-		/**
-		 * Open dialog and ask user which file to link to
-		 * Triggered by the "link to file or folder" button
-		 */
-		linkFile() {
-			const filePicker = buildFilePicker(this.startPath)
-
-			filePicker
-				.pick()
-				.then((file) => {
-					const client = OC.Files.getClient()
-					client.getFileInfo(file).then((_status, fileInfo) => {
-						const url = new URL(
-							generateUrl(`/f/${fileInfo.id}`),
-							window.origin,
-						)
-						this.setLink(url.href, fileInfo.name)
-						this.startPath =
-							fileInfo.path
-							+ (fileInfo.type === 'dir' ? `/${fileInfo.name}/` : '')
-					})
-				})
-				.catch(() => {
-					// do not close menu but keep focus
-					this.$refs.linkFileOrFolder.$el.focus()
-				})
-		},
-
-		/**
-		 * Save user entered URL as a link markup
-		 * Triggered when the user submits the ActionInput
-		 *
-		 * @param {string} url href attribute of the link
-		 * @param {string} text Text part of the link
-		 */
-		setLink(url, text) {
-			this.editor.chain().insertOrSetLink(text, { href: url }).focus().run()
-		},
-
 		onUpdate({ editor }) {
 			/**
 			 *  Empty document has an empty document and an empty paragraph (open and close blocks)

src/composables/useLinkFile.ts

@@ -0,0 +1,64 @@
+/**
+ * SPDX-FileCopyrightText: 2026 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { generateUrl } from '@nextcloud/router'
+import type { Editor } from '@tiptap/core'
+import { ref } from 'vue'
+import { buildFilePicker } from '../helpers/filePicker.js'
+import {
+	getClient,
+	getDefaultPropfind,
+	resultToNode,
+	defaultRootPath,
+} from '@nextcloud/files/dav'
+import type { FileStat, ResponseDataDetailed } from 'webdav'
+
+export const useLinkFile = ({ editor, relativePath }: { editor: Editor, relativePath?: string }) => {
+	const parentPath = (relativePath ?? '/').split('/').slice(0, -1).join('/')
+	const startPath = ref(parentPath)
+	const setLink = (url: string, text: string) => {
+		editor.chain().insertOrSetLink(text, { href: url }).focus().run()
+	}
+
+	/**
+	 * Open dialog and ask user which file to link to
+	 * @param event click that triggered the call.
+	 */
+	const linkFile = async (event: MouseEvent) => {
+		const node = await pickFile(startPath.value)
+			.catch(() => {
+				// TODO: check if this works.
+				// return focus to the trigger.
+				if (event.target instanceof HTMLElement) {
+					event.target.focus()
+				}
+		})
+		if (!node) {
+			return
+		}
+		const url = new URL(generateUrl(`/f/${node.id}`), window.origin)
+		setLink(url.href, node.displayname)
+		startPath.value =
+			node.path
+			+ (node.type === 'folder' ? `/${node.basename}/` : '')
+	}
+
+	return { linkFile }
+}
+
+/**
+ * Pick a file with the file picker and return the node
+ * @param startPath path to start the file picker on
+ */
+async function pickFile(startPath: string) {
+	const filePicker = buildFilePicker(startPath)
+	const file = await filePicker.pick()
+	const client = getClient()
+	const result = await client.stat(`${defaultRootPath}${file}`, {
+		details: true,
+		data: getDefaultPropfind(),
+	}) as ResponseDataDetailed<FileStat>
+	return resultToNode(result.data)
+}