chore(deps): upgrade to Vue 3 and replace Vue 2-only packages

package.json

@@ -23,7 +23,7 @@
     "extends @nextcloud/browserslist-config"
   ],
   "dependencies": {
-    "@ckeditor/ckeditor5-vue2": "^3.0.1",
+    "@ckeditor/ckeditor5-vue": "^8.2.0",
     "@iframe-resizer/child": "^5.5.9",
     "@iframe-resizer/parent": "^5.5.9",
     "@mdi/svg": "^7.4.47",
@@ -40,7 +40,7 @@
     "@nextcloud/router": "^3.1.0",
     "@nextcloud/sharing": "^0.4.0",
     "@nextcloud/timezones": "^1.0.2",
-    "@nextcloud/vue": "^8.39.0",
+    "@nextcloud/vue": "^9.9.0",
     "@pinia/testing": "^0.1.7",
     "@riophae/vue-treeselect": "^0.4.0",
     "address-rfc2822": "^2.2.4",
@@ -50,6 +50,7 @@
     "debounce-promise": "^3.1.2",
     "dompurify": "^3.4.11",
     "escape-html": "^1.0.3",
+    "floating-vue": "^5.2.2",
     "html-to-text": "^10.0.0",
     "ical.js": "^2.2.1",
     "js-base64": "^3.8.0",
@@ -66,15 +67,13 @@
     "raw-loader": "^4.0.2",
     "stylelint": "^17.14.0",
     "uuid": "^14.0.1",
-    "v-tooltip": "^2.1.3",
-    "vue": "^2.7.16",
+    "vue": "^3.5.0",
     "vue-autosize": "^1.0.2",
     "vue-dndrop": "^1.3.4",
-    "vue-frag": "^1.4.3",
     "vue-material-design-icons": "^5.3.1",
-    "vue-router": "^3.6.5",
-    "vue-shortkey": "^3.1.7",
+    "vue-router": "^4.5.0",
     "vue-tabs-component": "^1.5.0",
+    "vue3-shortkey": "^4.0.0",
     "webdav": "5.10.0"
   },
   "devDependencies": {
@@ -83,8 +82,8 @@
     "@nextcloud/eslint-config": "^9.0.0-rc.8",
     "@nextcloud/stylelint-config": "^3.2.2",
     "@playwright/test": "^1.61.1",
-    "@vitejs/plugin-vue2": "^2.3.4",
-    "@vue/test-utils": "^1.3.6",
+    "@vitejs/plugin-vue": "^6.0.8",
+    "@vue/test-utils": "^2.4.11",
     "autoprefixer": "^10.5.2",
     "babel-loader": "^10.1.1",
     "babel-loader-exclude-node-modules-except": "^1.2.4",
@@ -105,8 +104,7 @@
     "typescript": "^5.9.3",
     "url-loader": "^4.1.1",
     "vitest": "^4.1.9",
-    "vue-loader": "^15.11.1",
-    "vue-template-compiler": "^2.7.16",
+    "vue-loader": "^17.0.0",
     "webpack": "^5.108.3",
     "webpack-cli": "^7.1.0",
     "webpack-merge": "^6.0.1"

src/components/NavigationAccount.vue

@@ -4,8 +4,7 @@
 -->
 
 <template>
-	<Fragment>
-		<NcAppNavigationCaption
+	<NcAppNavigationCaption
 			v-if="visible"
 			:id="id"
 			:key="id"
@@ -102,7 +101,6 @@
 			:scroll-to-section="showSettingsSection"
 			@update:open="showAccountSettings($event)" />
 		<DelegationModal v-if="showDelegationModal" :account="account" @close="showDelegationModal = false" />
-	</Fragment>
 </template>
 
 <script>
@@ -111,7 +109,6 @@ import { formatFileSize } from '@nextcloud/files'
 import { generateUrl } from '@nextcloud/router'
 import { NcActionButton as ActionButton, NcActionCheckbox as ActionCheckbox, NcActionInput as ActionInput, NcActionText as ActionText, NcLoadingIcon as IconLoading, NcAppNavigationCaption, NcIconSvgWrapper } from '@nextcloud/vue'
 import { mapStores } from 'pinia'
-import { Fragment } from 'vue-frag'
 import MenuDown from 'vue-material-design-icons/ChevronDown.vue'
 import MenuUp from 'vue-material-design-icons/ChevronUp.vue'
 import IconSettings from 'vue-material-design-icons/CogOutline.vue'
@@ -127,7 +124,6 @@ export default {
 	name: 'NavigationAccount',
 	components: {
 		NcAppNavigationCaption,
-		Fragment,
 		ActionButton,
 		ActionCheckbox,
 		ActionInput,

vitest.config.js

@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
-import vue from '@vitejs/plugin-vue2'
+import vue from '@vitejs/plugin-vue'
 import { defineConfig } from 'vitest/config'
 
 export default defineConfig({