[stable32] refactor: Port away from OC.SystemTags

package.json

@@ -22,7 +22,8 @@
     "@nextcloud/vue": "^8.29.2",
     "vue": "^2.7.16",
     "vue-material-design-icons": "^5.3.1",
-    "vuex": "^3.6.2"
+    "vuex": "^3.6.2",
+    "webdav": "^5.8.0"
   },
   "engines": {
     "node": "^22.0.0",
@@ -36,7 +37,10 @@
     "@nextcloud/browserslist-config": "^3.0.1",
     "@nextcloud/eslint-config": "^8.4.2",
     "@nextcloud/stylelint-config": "^3.1.0",
+    "@nextcloud/typings": "^1.9.1",
     "@nextcloud/webpack-vue-config": "^6.3.0",
-    "vue-template-compiler": "^2.7.16"
+    "ts-loader": "^9.5.4",
+    "typescript": "^5.9.2",
+    "vue-loader": "^15.11.1"
   }
 }

src/AdminSettings.vue

@@ -18,12 +18,13 @@
 					<th class="retention-heading__after">
 						{{ t('files_retention','From date of') }}
 					</th>
-					<th class="retention-heading__action"></th>
+					<th class="retention-heading__action" />
 				</tr>
 			</thead>
 			<tbody>
 				<RetentionRule v-for="rule in retentionRules"
 					:key="rule.id"
+					:tags="tags"
 					v-bind="rule">
 					{{ rule.tagid }}
 				</RetentionRule>
@@ -99,6 +100,7 @@ import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection.
 import NcTextField from '@nextcloud/vue/dist/Components/NcTextField.js'
 
 import RetentionRule from './Components/RetentionRule.vue'
+import { fetchTags } from './services/api.ts'
 
 import { showError, showSuccess, showWarning } from '@nextcloud/dialogs'
 import { loadState } from '@nextcloud/initial-state'
@@ -145,6 +147,7 @@ export default {
 			filterAvailableTagList: (tag) => {
 				return !this.tagIdsWithRule.includes(tag.id)
 			},
+			tags: [],
 		}
 	},
 
@@ -172,7 +175,7 @@ export default {
 
 	async mounted() {
 		try {
-			await OC.SystemTags.collection.fetch({})
+			this.tags = await fetchTags()
 			await this.$store.dispatch('loadRetentionRules')
 
 			this.resetForm()
@@ -208,7 +211,7 @@ export default {
 						this.loadingNotifyBefore = false
 						showError(t('files_retention', 'An error occurred while changing the setting'))
 					}.bind(this),
-				}
+				},
 			)
 		},
 
@@ -225,7 +228,7 @@ export default {
 				return
 			}
 
-			const tagName = OC.SystemTags.collection.get(newTag)?.attributes?.name
+			const tagName = this.tags.find((tag) => tag.id === newTag)?.displayName
 
 			if (this.tagIdsWithRule.includes(newTag)) {
 				showError(t('files_retention', 'Tag {tagName} already has a retention rule', { tagName }))

src/Components/RetentionRule.vue

@@ -64,11 +64,15 @@ export default {
 			type: Boolean,
 			required: true,
 		},
+		tags: {
+			type: Array,
+			required: true,
+		},
 	},
 
 	computed: {
 		tagName() {
-			return OC.SystemTags.collection.get(this.tagid)?.attributes?.name
+			return this.tags.find((tag) => tag.id === this.tagid)?.displayName
 		},
 
 		getAmountAndUnit() {

src/logger.ts

@@ -0,0 +1,11 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { getLoggerBuilder } from '@nextcloud/logger'
+
+export default getLoggerBuilder()
+	.setApp('files_retention')
+	.detectUser()
+	.build()

src/services/api.ts

@@ -0,0 +1,41 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import type { FileStat, ResponseDataDetailed } from 'webdav'
+import type { TagWithId } from '../types'
+
+import { t } from '@nextcloud/l10n'
+
+import { davClient } from './davClient'
+import { parseTags } from '../utils'
+import logger from '../logger'
+
+export const fetchTagsPayload = `<?xml version="1.0"?>
+<d:propfind xmlns:d="DAV:" xmlns:oc="http://owncloud.org/ns" xmlns:nc="http://nextcloud.org/ns">
+	<d:prop>
+		<oc:id />
+		<oc:display-name />
+		<oc:user-visible />
+		<oc:user-assignable />
+		<oc:can-assign />
+		<d:getetag />
+		<nc:color />
+	</d:prop>
+</d:propfind>`
+
+export const fetchTags = async (): Promise<TagWithId[]> => {
+	const path = '/systemtags'
+	try {
+		const { data: tags } = await davClient.getDirectoryContents(path, {
+			data: fetchTagsPayload,
+			details: true,
+			glob: '/systemtags/*', // Filter out first empty tag
+		}) as ResponseDataDetailed<Required<FileStat>[]>
+		return parseTags(tags)
+	} catch (error) {
+		logger.error(t('files_retention', 'Failed to load tags'), { error })
+		throw new Error(t('files_retention', 'Failed to load tags'))
+	}
+}

src/services/davClient.ts

@@ -0,0 +1,26 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { createClient } from 'webdav'
+import { generateRemoteUrl } from '@nextcloud/router'
+import { getRequestToken, onRequestTokenUpdate } from '@nextcloud/auth'
+
+// init webdav client
+const rootUrl = generateRemoteUrl('dav')
+export const davClient = createClient(rootUrl)
+
+// set CSRF token header
+const setHeaders = (token: string | null) => {
+	davClient.setHeaders({
+		// Add this so the server knows it is an request from the browser
+		'X-Requested-With': 'XMLHttpRequest',
+		// Inject user auth
+		requesttoken: token ?? '',
+	})
+}
+
+// refresh headers when request token changes
+onRequestTokenUpdate(setHeaders)
+setHeaders(getRequestToken())

src/types.ts

@@ -0,0 +1,23 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+export interface BaseTag {
+	id?: number
+	userVisible: boolean
+	userAssignable: boolean
+	readonly canAssign: boolean // Computed server-side
+	etag?: string
+	color?: string
+}
+
+export type Tag = BaseTag & {
+	displayName: string
+}
+
+export type TagWithId = Required<Tag>
+
+export type ServerTag = BaseTag & {
+	name: string
+}

src/utils.ts

@@ -0,0 +1,23 @@
+/**
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import camelCase from 'camelcase'
+
+import type { DAVResultResponseProps } from 'webdav'
+
+import type { BaseTag, TagWithId } from './types.js'
+
+export const defaultBaseTag: BaseTag = {
+	userVisible: true,
+	userAssignable: true,
+	canAssign: true,
+}
+
+export const parseTags = (tags: { props: DAVResultResponseProps }[]): TagWithId[] => {
+	return tags.map(({ props }) => Object.fromEntries(
+		Object.entries(props)
+			.map(([key, value]) => [camelCase(key), camelCase(key) === 'displayName' ? String(value) : value]),
+	)) as TagWithId[]
+}

tsconfig.json

@@ -0,0 +1,19 @@
+{
+	"include": ["src/**/*.ts", "src/**/*.vue", "src/env.d.ts"],
+	"compilerOptions": {
+		"module": "ESNext",
+		"moduleResolution": "bundler",
+		"target": "ESNext",
+		"strictNullChecks": true,
+		"sourceMap": true,
+		"allowSyntheticDefaultImports": true,
+		"declaration": false,
+		"baseUrl": ".",
+		"paths": {
+			"@/*": ["src/*"]
+		}
+	},
+	"vueCompilerOptions": {
+		"target": "2.7"
+	}
+}

tsconfig.json.license

@@ -0,0 +1,2 @@
+SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors
+SPDX-License-Identifier: AGPL-3.0-or-later