refactor: prepare Vue 3 migration

.github/dependabot.yml

@@ -38,7 +38,10 @@ updates:
 
 # Main master npm frontend dependencies
 - package-ecosystem: npm
-  directory: "/"
+  directories:
+    - "/"
+    - "/build/frontend"
+    - "/build/frontend-legacy"
   schedule:
     interval: weekly
     day: saturday

.gitignore

@@ -11,7 +11,7 @@
 /apps/inc.php
 /assets
 /.htaccess
-/node_modules
+node_modules/
 /translationfiles
 /translationtool.phar
 
@@ -55,10 +55,6 @@
 /apps/files_external/3rdparty/irodsphp/prods/test*
 /apps/files_external/tests/config.*.php
 
-# apps modules
-/apps/*/node_modules
-
-
 # ignore themes except the example and the README
 /themes/*
 !/themes/example
@@ -131,9 +127,6 @@ nbproject
 # Tests
 /tests/phpunit.xml
 
-# Node Modules
-/build/node_modules/
-
 # nodejs
 /build/bin
 /build/lib/

apps/sharebymail/lib/Settings/Admin.php

@@ -26,6 +26,8 @@ public function getForm() {
 		$this->initialState->provideInitialState('sendPasswordMail', $this->settingsManager->sendPasswordByMail());
 		$this->initialState->provideInitialState('replyToInitiator', $this->settingsManager->replyToInitiator());
 
+		\OCP\Util::addStyle('sharebymail', 'admin-settings');
+		\OCP\Util::addScript('sharebymail', 'admin-settings');
 		return new TemplateResponse('sharebymail', 'settings-admin', [], '');
 	}
 

apps/sharebymail/src/components/AdminSettings.vue

@@ -7,17 +7,11 @@
 	<NcSettingsSection
 		:name="t('sharebymail', 'Share by mail')"
 		:description="t('sharebymail', 'Allows people to share a personalized link to a file or folder by putting in an email address.')">
-		<NcCheckboxRadioSwitch
-			type="switch"
-			:checked.sync="sendPasswordMail"
-			@update:checked="update('sendpasswordmail', sendPasswordMail)">
+		<NcCheckboxRadioSwitch v-model="sendPasswordMail" type="switch">
 			{{ t('sharebymail', 'Send password by mail') }}
 		</NcCheckboxRadioSwitch>
 
-		<NcCheckboxRadioSwitch
-			type="switch"
-			:checked.sync="replyToInitiator"
-			@update:checked="update('replyToInitiator', replyToInitiator)">
+		<NcCheckboxRadioSwitch v-model="replyToInitiator" type="switch">
 			{{ t('sharebymail', 'Reply to initiator') }}
 		</NcCheckboxRadioSwitch>
 	</NcSettingsSection>
@@ -27,13 +21,14 @@
 import axios from '@nextcloud/axios'
 import { showError } from '@nextcloud/dialogs'
 import { loadState } from '@nextcloud/initial-state'
+import { t } from '@nextcloud/l10n'
 import { confirmPassword } from '@nextcloud/password-confirmation'
 import { generateOcsUrl } from '@nextcloud/router'
 import NcCheckboxRadioSwitch from '@nextcloud/vue/components/NcCheckboxRadioSwitch'
 import NcSettingsSection from '@nextcloud/vue/components/NcSettingsSection'
 import { logger } from '../logger.ts'
 
-import '@nextcloud/password-confirmation/dist/style.css'
+import '@nextcloud/password-confirmation/style.css'
 
 export default {
 	name: 'AdminSettings',
@@ -42,13 +37,27 @@ export default {
 		NcSettingsSection,
 	},
 
+	setup() {
+		return { t }
+	},
+
 	data() {
 		return {
 			sendPasswordMail: loadState('sharebymail', 'sendPasswordMail'),
 			replyToInitiator: loadState('sharebymail', 'replyToInitiator'),
 		}
 	},
 
+	watch: {
+		sendPasswordMail(newValue) {
+			this.update('sendpasswordmail', newValue)
+		},
+
+		replyToInitiator(newValue) {
+			this.update('replyToInitiator', newValue)
+		},
+	},
+
 	methods: {
 		async update(key, value) {
 			await confirmPassword()

apps/sharebymail/src/settings-admin.ts

@@ -0,0 +1,10 @@
+/**
+ * SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { createApp } from 'vue'
+import AdminSettings from './components/AdminSettings.vue'
+
+const app = createApp(AdminSettings)
+app.mount('#vue-admin-sharebymail')

apps/sharebymail/templates/settings-admin.php

@@ -3,7 +3,6 @@
  * SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
-
-\OCP\Util::addScript('sharebymail', 'vue-settings-admin-sharebymail');
 ?>
+
 <div id="vue-admin-sharebymail"></div>

build/demi.sh

@@ -0,0 +1,27 @@
+#!/bin/bash
+
+# SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors
+# SPDX-License-Identifier: CC0-1.0
+
+# This is a simple helper to execute npm commands in two directories
+# we need this as we cannot use npm workspaces as they break with 2 versions of vue.
+
+if [ "run" = "$1" ]; then
+	command=$@
+elif [ "install" = "$1" ] || [ "ci" = "$1" ]; then
+	command=$@
+else
+	command="run $@"
+fi
+
+echo -e "\e[1;34m>> Running 'npm $command' for Vue 3 based frontend\e[0m"
+echo
+pushd $(dirname $0)/frontend
+npm $command
+popd
+
+echo -e "\e[1;34m>> Running 'npm $command' for Vue 2 based frontend\e[0m"
+echo
+pushd $(dirname $0)/frontend-legacy
+npm $command
+popd

build/files-checker.php

@@ -87,10 +87,8 @@
 	'tsconfig.json',
 	'vendor-bin',
 	'version.php',
+	'vite.config.mts',
 	'vitest.config.mts',
-	'webpack.common.cjs',
-	'webpack.config.js',
-	'webpack.modules.cjs',
 	'window.d.ts',
 ];
 $actualFiles = [];

build/frontend-legacy/REUSE.toml

@@ -0,0 +1,10 @@
+version = 1
+SPDX-PackageName = "nextcloud"
+SPDX-PackageSupplier = "Nextcloud <info@nextcloud.com>"
+SPDX-PackageDownloadLocation = "https://github.com/nextcloud/server"
+
+[[annotations]]
+path = ["package.json", "package-lock.json", "tsconfig.json"]
+precedence = "aggregate"
+SPDX-FileCopyrightText = "2025 Nextcloud GmbH and Nextcloud contributors"
+SPDX-License-Identifier = "AGPL-3.0-or-later"

build/frontend-legacy/__mocks__/@nextcloud/auth.ts

@@ -0,0 +1,18 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+export function getCurrentUser() {
+	return {
+		uid: 'test',
+		displayName: 'Test',
+		isAdmin: false,
+	}
+}
+
+export function getRequestToken() {
+	return 'test-token-1234'
+}
+
+export function onRequestTokenUpdate() {}

build/frontend-legacy/__mocks__/@nextcloud/axios.ts

@@ -0,0 +1,18 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+export default {
+	interceptors: {
+		response: {
+			use: () => {},
+		},
+		request: {
+			use: () => {},
+		},
+	},
+	get: async () => ({ status: 200, data: {} }),
+	delete: async () => ({ status: 200, data: {} }),
+	post: async () => ({ status: 200, data: {} }),
+	head: async () => ({ status: 200, data: {} }),
+}

build/frontend-legacy/__mocks__/@nextcloud/capabilities.ts

@@ -0,0 +1,23 @@
+/**
+ * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import type { Capabilities } from '../../apps/files/src/types.ts'
+
+export function getCapabilities(): Capabilities {
+	return {
+		files: {
+			bigfilechunking: true,
+			blacklisted_files: [],
+			forbidden_filename_basenames: [],
+			forbidden_filename_characters: [],
+			forbidden_filename_extensions: [],
+			forbidden_filenames: [],
+			undelete: true,
+			version_deletion: true,
+			version_labeling: true,
+			versioning: true,
+		},
+	}
+}

build/frontend-legacy/__mocks__/@nextcloud/dialogs.ts

@@ -0,0 +1,13 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { vi } from 'vitest'
+
+export const showMessage = vi.fn()
+export const showSuccess = vi.fn()
+export const showWarning = vi.fn()
+export const showInfo = vi.fn()
+export const showError = vi.fn()
+export const showUndo = vi.fn()

build/frontend-legacy/__mocks__/@nextcloud/initial-state.ts

@@ -0,0 +1,8 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+export function loadState(app: string, key: string, fallback?: any) {
+	return fallback
+}

build/frontend-legacy/__mocks__/css.js

@@ -0,0 +1,5 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+export default {}

build/frontend-legacy/__mocks__/svg.js

@@ -0,0 +1,5 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+export default '<svg>SvgMock</svg>'

build/frontend-legacy/__mocks__/webdav.ts

@@ -0,0 +1,11 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+export function createClient() {}
+export function getPatcher() {
+	return {
+		patch: () => {},
+	}
+}