refactor(editor): Refactor workflowHelpers mixin to composable (no-changelog) (#8600)

packages/editor-ui/src/components/TriggerPanel.vue

@@ -46,7 +46,7 @@
 						</n8n-text>
 					</div>
 					<div v-if="displayChatButton">
-						<n8n-button @click="openWebhookUrl()" class="mb-xl">
+						<n8n-button class="mb-xl" @click="openWebhookUrl()">
 							{{ $locale.baseText('ndv.trigger.chatTrigger.openChat') }}
 						</n8n-button>
 					</div>
@@ -121,7 +121,6 @@ import type { INodeUi } from '@/Interface';
 import type { INodeTypeDescription } from 'n8n-workflow';
 import { getTriggerNodeServiceName } from '@/utils/nodeTypesUtils';
 import NodeExecuteButton from '@/components/NodeExecuteButton.vue';
-import { workflowHelpers } from '@/mixins/workflowHelpers';
 import CopyInput from '@/components/CopyInput.vue';
 import NodeIcon from '@/components/NodeIcon.vue';
 import { useUIStore } from '@/stores/ui.store';
@@ -129,6 +128,8 @@ import { useWorkflowsStore } from '@/stores/workflows.store';
 import { useNDVStore } from '@/stores/ndv.store';
 import { useNodeTypesStore } from '@/stores/nodeTypes.store';
 import { createEventBus } from 'n8n-design-system/utils';
+import { useRouter } from 'vue-router';
+import { useWorkflowHelpers } from '@/composables/useWorkflowHelpers';
 
 export default defineComponent({
 	name: 'TriggerPanel',
@@ -137,7 +138,6 @@ export default defineComponent({
 		CopyInput,
 		NodeIcon,
 	},
-	mixins: [workflowHelpers],
 	props: {
 		nodeName: {
 			type: String,
@@ -146,6 +146,14 @@ export default defineComponent({
 			type: String,
 		},
 	},
+	setup() {
+		const router = useRouter();
+		const workflowHelpers = useWorkflowHelpers(router);
+
+		return {
+			workflowHelpers,
+		};
+	},
 	data: () => {
 		return {
 			executionsHelpEventBus: createEventBus(),
@@ -178,12 +186,9 @@ export default defineComponent({
 				}
 
 				if (this.node) {
-					const hideContentValue = this.getCurrentWorkflow().expression.getSimpleParameterValue(
-						this.node,
-						hideContent,
-						'internal',
-						{},
-					);
+					const hideContentValue = this.workflowHelpers
+						.getCurrentWorkflow()
+						.expression.getSimpleParameterValue(this.node, hideContent, 'internal', {});
 
 					if (typeof hideContentValue === 'boolean') {
 						return hideContentValue;
@@ -220,14 +225,17 @@ export default defineComponent({
 				return undefined;
 			}
 
-			return this.getWebhookExpressionValue(this.nodeType.webhooks[0], 'httpMethod');
+			return this.workflowHelpers.getWebhookExpressionValue(
+				this.nodeType.webhooks[0],
+				'httpMethod',
+			);
 		},
 		webhookTestUrl(): string | undefined {
 			if (!this.node || !this.nodeType?.webhooks?.length) {
 				return undefined;
 			}
 
-			return this.getWebhookUrl(this.nodeType.webhooks[0], this.node, 'test');
+			return this.workflowHelpers.getWebhookUrl(this.nodeType.webhooks[0], this.node, 'test');
 		},
 		isWebhookBasedNode(): boolean {
 			return Boolean(this.nodeType?.webhooks?.length);