From 22cdc6da819e8e1e88da6f58737c085d849fb647 Mon Sep 17 00:00:00 2001
From: Arthur Schiwon <blizzz@arthur-schiwon.de>
Date: Thu, 27 Mar 2025 16:52:51 +0100
Subject: [PATCH] fix(workflowengine): adapt check operator RequestUserAgent to
 use web component

Signed-off-by: Arthur Schiwon <blizzz@arthur-schiwon.de>
---
 .../components/Checks/RequestUserAgent.vue    | 40 ++++++++++++-------
 .../src/components/Checks/request.js          |  2 +-
 2 files changed, 27 insertions(+), 15 deletions(-)

diff --git a/apps/workflowengine/src/components/Checks/RequestUserAgent.vue b/apps/workflowengine/src/components/Checks/RequestUserAgent.vue
index e089f0d2afa..8388eed821d 100644
--- a/apps/workflowengine/src/components/Checks/RequestUserAgent.vue
+++ b/apps/workflowengine/src/components/Checks/RequestUserAgent.vue
@@ -4,7 +4,7 @@
 -->
 <template>
 	<div>
-		<NcSelect :value="currentValue"
+		<NcSelect v-model="currentValue"
 			:placeholder="t('workflowengine', 'Select a user agent')"
 			label="label"
 			:options="options"
@@ -25,7 +25,7 @@
 		</NcSelect>
 		<input v-if="!isPredefined"
 			type="text"
-			:value="currentValue.id"
+			v-model="newValue"
 			@input="updateCustom">
 	</div>
 </template>
@@ -41,9 +41,16 @@ export default {
 		NcEllipsisedOption,
 		NcSelect,
 	},
+	emits: ['update:model-value'],
 	mixins: [
 		valueMixin,
 	],
+	props: {
+		modelValue: {
+			type: String,
+			default: '',
+		}
+	},
 	data() {
 		return {
 			newValue: '',
@@ -73,14 +80,19 @@ export default {
 				id: '',
 			}
 		},
-		currentValue() {
-			if (this.matchingPredefined) {
-				return this.matchingPredefined
-			}
-			return {
-				icon: 'icon-settings-dark',
-				label: t('workflowengine', 'Custom user agent'),
-				id: this.newValue,
+		currentValue: {
+			get: function() {
+				if (this.matchingPredefined) {
+					return this.matchingPredefined
+				}
+				return {
+					icon: 'icon-settings-dark',
+					label: t('workflowengine', 'Custom user agent'),
+					id: this.newValue,
+				}
+			},
+			set: function(value) {
+				this.newValue = value
 			}
 		},
 	},
@@ -94,12 +106,12 @@ export default {
 			// TODO: check if value requires a regex and set the check operator according to that
 			if (value !== null) {
 				this.newValue = value.id
-				this.$emit('input', this.newValue)
+				this.$emit('update:model-value', this.newValue)
 			}
 		},
-		updateCustom(event) {
-			this.newValue = event.target.value
-			this.$emit('input', this.newValue)
+		updateCustom() {
+			this.newValue = this.currentValue.id
+			this.$emit('update:model-value', this.newValue)
 		},
 	},
 }
diff --git a/apps/workflowengine/src/components/Checks/request.js b/apps/workflowengine/src/components/Checks/request.js
index e18eeb72687..fa5bbffca54 100644
--- a/apps/workflowengine/src/components/Checks/request.js
+++ b/apps/workflowengine/src/components/Checks/request.js
@@ -39,7 +39,7 @@ const RequestChecks = [
 			{ operator: 'matches', name: t('workflowengine', 'matches') },
 			{ operator: '!matches', name: t('workflowengine', 'does not match') },
 		],
-		component: RequestUserAgent,
+		element: registerCustomElement(RequestUserAgent, 'oca-workflowengine-checks-request_user_agent'),
 	},
 	{
 		class: 'OCA\\WorkflowEngine\\Check\\UserGroupMembership',