[stable33] refactor(systemtags): migrate to Vue 3 and script setup

apps/files/src/services/WebdavClient.ts

@@ -1,8 +1,9 @@
-import type { Node } from '@nextcloud/files'
-/**
+/*!
  * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
+
+import type { Node } from '@nextcloud/files'
 import type { FileStat, ResponseDataDetailed } from 'webdav'
 
 import { getClient, getDefaultPropfind, getRootPath, resultToNode } from '@nextcloud/files/dav'

apps/systemtags/lib/AppInfo/Application.php

@@ -24,7 +24,6 @@
 use OCP\EventDispatcher\IEventDispatcher;
 use OCP\SystemTag\ManagerEvent;
 use OCP\SystemTag\MapperEvent;
-use OCP\Util;
 
 class Application extends App implements IBootstrap {
 	public const APP_ID = 'systemtags';
@@ -43,16 +42,6 @@ public function register(IRegistrationContext $context): void {
 
 	public function boot(IBootContext $context): void {
 		$context->injectFn(function (IEventDispatcher $dispatcher) use ($context): void {
-			/*
-			 * @todo move the OCP events and then move the registration to `register`
-			 */
-			$dispatcher->addListener(
-				LoadAdditionalScriptsEvent::class,
-				function (): void {
-					Util::addInitScript(self::APP_ID, 'init');
-				}
-			);
-
 			$managerListener = function (ManagerEvent $event) use ($context): void {
 				/** @var Listener $listener */
 				$listener = $context->getServerContainer()->query(Listener::class);

apps/systemtags/lib/Listeners/BeforeTemplateRenderedListener.php

@@ -30,6 +30,7 @@ public function handle(Event $event): void {
 			return;
 		}
 		Util::addInitScript(Application::APP_ID, 'init');
+		Util::addStyle(Application::APP_ID, 'init');
 
 		$restrictSystemTagsCreationToAdmin = $this->appConfig->getValueBool(Application::APP_ID, 'restrict_creation_to_admin', false);
 		$this->initialState->provideInitialState('restrictSystemTagsCreationToAdmin', $restrictSystemTagsCreationToAdmin);

apps/systemtags/lib/Listeners/LoadAdditionalScriptsListener.php

@@ -30,6 +30,7 @@ public function handle(Event $event): void {
 			return;
 		}
 		Util::addInitScript(Application::APP_ID, 'init');
+		Util::addStyle(Application::APP_ID, 'init');
 
 		$restrictSystemTagsCreationToAdmin = $this->appConfig->getValueBool(Application::APP_ID, 'restrict_creation_to_admin', false);
 		$this->initialState->provideInitialState('restrictSystemTagsCreationToAdmin', $restrictSystemTagsCreationToAdmin);

apps/systemtags/lib/Settings/Admin.php

@@ -28,8 +28,9 @@ public function getForm() {
 		$restrictSystemTagsCreationToAdmin = $this->appConfig->getValueBool(Application::APP_ID, 'restrict_creation_to_admin', false);
 		$this->initialStateService->provideInitialState('restrictSystemTagsCreationToAdmin', $restrictSystemTagsCreationToAdmin);
 
-		Util::addScript('systemtags', 'admin');
-		return new TemplateResponse('systemtags', 'admin', [], '');
+		Util::addStyle(Application::APP_ID, 'admin');
+		Util::addScript(Application::APP_ID, 'admin');
+		return new TemplateResponse(Application::APP_ID, 'admin', [], '');
 	}
 
 	/**

apps/systemtags/src/admin.ts

@@ -1,13 +1,10 @@
-/**
+/*!
  * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
-import { getCSPNonce } from '@nextcloud/auth'
-import Vue from 'vue'
+import { createApp } from 'vue'
 import SystemTagsSection from './views/SystemTagsSection.vue'
 
-__webpack_nonce__ = getCSPNonce()
-
-const SystemTagsSectionView = Vue.extend(SystemTagsSection)
-new SystemTagsSectionView().$mount('#vue-admin-systemtags')
+const app = createApp(SystemTagsSection)
+app.mount('#vue-admin-systemtags')