From 686d52ee16558da57379ac3c3dd13f46ce17156e Mon Sep 17 00:00:00 2001
From: Arthur Schiwon <blizzz@arthur-schiwon.de>
Date: Thu, 13 Mar 2025 18:45:37 +0100
Subject: [PATCH] fix(workflowengine): adapt check operator FileSystemTag to
 use web component

Signed-off-by: Arthur Schiwon <blizzz@arthur-schiwon.de>
---
 .../src/components/Checks/FileSystemTag.vue   | 13 ++++++++-----
 .../src/components/Checks/file.js             | 19 ++++++++++++++++++-
 package-lock.json                             |  7 +++++++
 package.json                                  |  1 +
 4 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/apps/workflowengine/src/components/Checks/FileSystemTag.vue b/apps/workflowengine/src/components/Checks/FileSystemTag.vue
index f932fd9c699..8c383505279 100644
--- a/apps/workflowengine/src/components/Checks/FileSystemTag.vue
+++ b/apps/workflowengine/src/components/Checks/FileSystemTag.vue
@@ -17,18 +17,21 @@ export default {
 		NcSelectTags,
 	},
 	props: {
-		value: {
+		modelValue: {
 			type: String,
 			default: '',
 		},
 	},
+
+	emits: ['update:model-value'],
+
 	data() {
 		return {
 			newValue: [],
 		}
 	},
 	watch: {
-		value() {
+		modelValue() {
 			this.updateValue()
 		},
 	},
@@ -37,14 +40,14 @@ export default {
 	},
 	methods: {
 		updateValue() {
-			if (this.value !== '') {
-				this.newValue = parseInt(this.value)
+			if (this.modelValue !== '') {
+				this.newValue = parseInt(this.modelValue)
 			} else {
 				this.newValue = null
 			}
 		},
 		update() {
-			this.$emit('input', this.newValue || '')
+			this.$emit('update:model-value', this.newValue || '')
 		},
 	},
 }
diff --git a/apps/workflowengine/src/components/Checks/file.js b/apps/workflowengine/src/components/Checks/file.js
index 246f46ff55b..5a5b5d22b41 100644
--- a/apps/workflowengine/src/components/Checks/file.js
+++ b/apps/workflowengine/src/components/Checks/file.js
@@ -80,8 +80,25 @@ const FileChecks = [
 			{ operator: 'is', name: t('workflowengine', 'is tagged with') },
 			{ operator: '!is', name: t('workflowengine', 'is not tagged with') },
 		],
-		component: FileSystemTag,
+		webComponent: registerWebComponent(FileSystemTag, 'oca-workflowengine-file_system_tag'),
 	},
 ]
 
+/**
+ *
+ * @param VueComponent
+ * @param webComponentId
+ */
+function registerWebComponent(VueComponent, webComponentId) {
+	const WrappedComponent = wrap(Vue, VueComponent)
+	window.customElements.define(webComponentId, WrappedComponent)
+
+	// In Vue 2, wrap doesn't support disabling shadow :(
+	// Disable with a hack
+	Object.defineProperty(WrappedComponent.prototype, 'attachShadow', { value() { return this } })
+	Object.defineProperty(WrappedComponent.prototype, 'shadowRoot', { get() { return this } })
+
+	return webComponentId
+}
+
 export default FileChecks
diff --git a/package-lock.json b/package-lock.json
index d4b1ca2b73b..6c44c4d2d3f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -33,6 +33,7 @@
         "@nextcloud/vue": "^8.23.1",
         "@simplewebauthn/browser": "^10.0.0",
         "@skjnldsv/sanitize-svg": "^1.0.2",
+        "@vue/web-component-wrapper": "^1.3.0",
         "@vueuse/components": "^11.0.0",
         "@vueuse/core": "^11.0.0",
         "@vueuse/integrations": "^11.0.0",
@@ -7312,6 +7313,12 @@
         }
       }
     },
+    "node_modules/@vue/web-component-wrapper": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/@vue/web-component-wrapper/-/web-component-wrapper-1.3.0.tgz",
+      "integrity": "sha512-Iu8Tbg3f+emIIMmI2ycSI8QcEuAUgPTgHwesDU1eKMLE4YC/c/sFbGc70QgMq31ijRftV0R7vCm9co6rldCeOA==",
+      "license": "MIT"
+    },
     "node_modules/@vueuse/components": {
       "version": "11.3.0",
       "resolved": "https://registry.npmjs.org/@vueuse/components/-/components-11.3.0.tgz",
diff --git a/package.json b/package.json
index f6fca85e2c4..5998e1b78f2 100644
--- a/package.json
+++ b/package.json
@@ -61,6 +61,7 @@
     "@nextcloud/vue": "^8.23.1",
     "@simplewebauthn/browser": "^10.0.0",
     "@skjnldsv/sanitize-svg": "^1.0.2",
+    "@vue/web-component-wrapper": "^1.3.0",
     "@vueuse/components": "^11.0.0",
     "@vueuse/core": "^11.0.0",
     "@vueuse/integrations": "^11.0.0",