From d7c99fcc6917adcd30f5b996e93a32afb34b69a3 Mon Sep 17 00:00:00 2001
From: Chris Coutinho <chris@coutinho.io>
Date: Tue, 23 Dec 2025 00:47:21 +0100
Subject: [PATCH] feat(astrolabe): upgrade to Vue 3 and @nextcloud/vue 9
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Merge renovate/major-vue-monorepo: Vue 2.7.16 → 3.5.26
- Merge renovate/nextcloud-vue-9.x: @nextcloud/vue 8.29.2 → 9.3.1
- Update component imports to new @nextcloud/vue v9 paths
- Replace .sync modifiers with v-model:prop (Vue 3 syntax)
- Replace beforeDestroy with beforeUnmount lifecycle hook
- Remove Vue.() usage (automatic reactivity in Vue 3)
- Update main.js to use createApp() instead of Vue.extend()
- Add @vitejs/plugin-vue and configure Vite for Vue 3
- All builds passing, ready for admin UX improvements
---
 third_party/astrolabe/package-lock.json       | 25 +++++++++++++++
 third_party/astrolabe/package.json            |  3 +-
 third_party/astrolabe/src/App.vue             | 32 +++++++++----------
 .../astrolabe/src/components/PDFViewer.vue    |  2 +-
 third_party/astrolabe/src/main.js             | 11 ++++---
 third_party/astrolabe/vite.config.js          | 28 +++++++++++++---
 6 files changed, 74 insertions(+), 27 deletions(-)

diff --git a/third_party/astrolabe/package-lock.json b/third_party/astrolabe/package-lock.json
index d051863..62b4e52 100644
--- a/third_party/astrolabe/package-lock.json
+++ b/third_party/astrolabe/package-lock.json
@@ -24,6 +24,7 @@
         "@nextcloud/eslint-config": "8.4.2",
         "@nextcloud/stylelint-config": "3.1.1",
         "@nextcloud/vite-config": "1.7.2",
+        "@vitejs/plugin-vue": "^6.0.3",
         "terser": "5.44.1",
         "vite": "7.2.7"
       },
@@ -2249,6 +2250,13 @@
         "url": "https://opencollective.com/parcel"
       }
     },
+    "node_modules/@rolldown/pluginutils": {
+      "version": "1.0.0-beta.53",
+      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-beta.53.tgz",
+      "integrity": "sha512-vENRlFU4YbrwVqNDZ7fLvy+JR1CRkyr01jhSiDpE1u6py3OMzQfztQU2jxykW3ALNxO4kSlqIDeYyD0Y9RcQeQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@rollup/plugin-inject": {
       "version": "5.0.5",
       "dev": true,
@@ -3374,6 +3382,23 @@
       ],
       "peer": true
     },
+    "node_modules/@vitejs/plugin-vue": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-6.0.3.tgz",
+      "integrity": "sha512-TlGPkLFLVOY3T7fZrwdvKpjprR3s4fxRln0ORDo1VQ7HHyxJwTlrjKU3kpVWTlaAjIEuCTokmjkZnr8Tpc925w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@rolldown/pluginutils": "1.0.0-beta.53"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "peerDependencies": {
+        "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0",
+        "vue": "^3.2.25"
+      }
+    },
     "node_modules/@volar/language-core": {
       "version": "2.4.27",
       "dev": true,
diff --git a/third_party/astrolabe/package.json b/third_party/astrolabe/package.json
index 572dd73..a92c553 100644
--- a/third_party/astrolabe/package.json
+++ b/third_party/astrolabe/package.json
@@ -23,8 +23,8 @@
     "@nextcloud/router": "^3.0.1",
     "@nextcloud/vue": "^9.0.0",
     "markdown-it": "^14.1.0",
-    "plotly.js-dist-min": "^2.35.3",
     "pdfjs-dist": "^4.0.379",
+    "plotly.js-dist-min": "^2.35.3",
     "vue": "^3.0.0",
     "vue-material-design-icons": "^5.3.1"
   },
@@ -33,6 +33,7 @@
     "@nextcloud/eslint-config": "8.4.2",
     "@nextcloud/stylelint-config": "3.1.1",
     "@nextcloud/vite-config": "1.7.2",
+    "@vitejs/plugin-vue": "^6.0.3",
     "terser": "5.44.1",
     "vite": "7.2.7"
   }
diff --git a/third_party/astrolabe/src/App.vue b/third_party/astrolabe/src/App.vue
index 6a94da7..f073912 100644
--- a/third_party/astrolabe/src/App.vue
+++ b/third_party/astrolabe/src/App.vue
@@ -48,7 +48,7 @@
 				<div class="mcp-search-card">
 					<div class="mcp-search-row">
 						<NcTextField
-							:value.sync="query"
+							v-model:value="query"
 							:label="t('astrolabe', 'Search query')"
 							:placeholder="t('astrolabe', 'Enter your search query...')"
 							class="mcp-search-input"
@@ -104,7 +104,7 @@
 							<div class="mcp-option-group">
 								<label>{{ t('astrolabe', 'Result Limit') }}</label>
 								<NcTextField
-									:value.sync="limit"
+									v-model:value="limit"
 									type="number"
 									:min="1"
 									:max="100" />
@@ -152,7 +152,7 @@
 						<div class="mcp-viz-header">
 							<h3>{{ t('astrolabe', 'Vector Space Visualization') }}</h3>
 							<NcCheckboxRadioSwitch
-								:checked.sync="showQueryPoint"
+								v-model:checked="showQueryPoint"
 								type="switch"
 								@update:checked="updatePlot">
 								{{ t('astrolabe', 'Show query point') }}
@@ -364,17 +364,17 @@
 </template>
 
 <script>
-import NcContent from '@nextcloud/vue/dist/Components/NcContent.js'
-import NcAppNavigation from '@nextcloud/vue/dist/Components/NcAppNavigation.js'
-import NcAppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem.js'
-import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent.js'
-import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
-import NcTextField from '@nextcloud/vue/dist/Components/NcTextField.js'
-import NcSelect from '@nextcloud/vue/dist/Components/NcSelect.js'
-import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
-import NcNoteCard from '@nextcloud/vue/dist/Components/NcNoteCard.js'
-import NcEmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent.js'
-import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
+import NcContent from '@nextcloud/vue/components/NcContent'
+import NcAppNavigation from '@nextcloud/vue/components/NcAppNavigation'
+import NcAppNavigationItem from '@nextcloud/vue/components/NcAppNavigationItem'
+import NcAppContent from '@nextcloud/vue/components/NcAppContent'
+import NcButton from '@nextcloud/vue/components/NcButton'
+import NcTextField from '@nextcloud/vue/components/NcTextField'
+import NcSelect from '@nextcloud/vue/components/NcSelect'
+import NcLoadingIcon from '@nextcloud/vue/components/NcLoadingIcon'
+import NcNoteCard from '@nextcloud/vue/components/NcNoteCard'
+import NcEmptyContent from '@nextcloud/vue/components/NcEmptyContent'
+import NcCheckboxRadioSwitch from '@nextcloud/vue/components/NcCheckboxRadioSwitch'
 
 import Magnify from 'vue-material-design-icons/Magnify.vue'
 import ChartBox from 'vue-material-design-icons/ChartBox.vue'
@@ -505,7 +505,7 @@ export default {
 		// Check for URL parameters to open chunk viewer
 		this.handleUrlParameters()
 	},
-	beforeDestroy() {
+	beforeUnmount() {
 		// Clean up Plotly event handlers to prevent memory leaks
 		const plotDiv = document.getElementById('viz-plot')
 		if (plotDiv && plotDiv.on) {
@@ -648,7 +648,7 @@ export default {
 		},
 
 		toggleExcerpt(index) {
-			this.$set(this.expandedExcerpts, index, !this.expandedExcerpts[index])
+			this.expandedExcerpts[index] = !this.expandedExcerpts[index]
 		},
 
 		truncateExcerpt(text, maxLength = 150) {
diff --git a/third_party/astrolabe/src/components/PDFViewer.vue b/third_party/astrolabe/src/components/PDFViewer.vue
index 0f347cd..814a86c 100644
--- a/third_party/astrolabe/src/components/PDFViewer.vue
+++ b/third_party/astrolabe/src/components/PDFViewer.vue
@@ -18,7 +18,7 @@
 import * as pdfjsLib from 'pdfjs-dist'
 import { generateUrl } from '@nextcloud/router'
 import { translate as t } from '@nextcloud/l10n'
-import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
+import NcLoadingIcon from '@nextcloud/vue/components/NcLoadingIcon'
 import AlertCircle from 'vue-material-design-icons/AlertCircle.vue'
 
 export default {
diff --git a/third_party/astrolabe/src/main.js b/third_party/astrolabe/src/main.js
index 8ec36f3..f28d460 100644
--- a/third_party/astrolabe/src/main.js
+++ b/third_party/astrolabe/src/main.js
@@ -1,8 +1,11 @@
-import Vue from 'vue'
+import { createApp } from 'vue'
 import { translate as t, translatePlural as n } from '@nextcloud/l10n'
 import App from './App.vue'
 
-Vue.mixin({ methods: { t, n } })
+const app = createApp(App)
 
-const View = Vue.extend(App)
-new View().$mount('#astrolabe')
+// Add translation methods globally
+app.config.globalProperties.t = t
+app.config.globalProperties.n = n
+
+app.mount('#astrolabe')
diff --git a/third_party/astrolabe/vite.config.js b/third_party/astrolabe/vite.config.js
index e7db461..c294b43 100644
--- a/third_party/astrolabe/vite.config.js
+++ b/third_party/astrolabe/vite.config.js
@@ -1,7 +1,25 @@
-import { createAppConfig } from '@nextcloud/vite-config'
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import { resolve } from 'path'
 
-export default createAppConfig({
-  main: 'src/main.js',
-  adminSettings: 'src/adminSettings.js',
-  personalSettings: 'src/personalSettings.js',
+export default defineConfig({
+  plugins: [vue()],
+  build: {
+    outDir: 'js',
+    emptyOutDir: false,
+    rollupOptions: {
+      input: {
+        main: resolve(__dirname, 'src/main.js'),
+        'astrolabe-adminSettings': resolve(__dirname, 'src/adminSettings.js'),
+        'astrolabe-personalSettings': resolve(__dirname, 'src/personalSettings.js'),
+      },
+      output: {
+        entryFileNames: '[name].mjs',
+        chunkFileNames: '[name]-[hash].chunk.mjs',
+        assetFileNames: '[name][extname]',
+      },
+    },
+    sourcemap: true,
+    minify: 'terser',
+  },
 })