change trigger flow interface to dropdown using the local store (#15764)

app/src/lang/translations/en-US.yaml

@@ -2081,7 +2081,7 @@ triggers:
     collection_and_item: Collection & Item Pages
     collection_only: Collection Page Only
     item_only: Item Page Only
-a_flow_uuid: A Flow's Primary Key UUID...
+a_flow_uuid: Select a Flow to trigger...
 any_string_or_json: Any string or JSON...
 item_payload_placeholder: This is the JSON used to update the item's field values...
 operation_variables_note: You can access flow data with variables such as **{'{'}{'{'}$last{'}'}{'}'}**, **{'{'}{'{'}$trigger{'}'}{'}'}** and **{'{'}{'{'}$accountability{'}'}{'}'}**, or reference previous operations using **{'{'}{'{'}operation_key{'}'}{'}'}**.'

app/src/operations/trigger/index.ts

@@ -1,4 +1,5 @@
 import { defineOperationApp } from '@directus/shared/utils';
+import { useFlowsStore } from '@/stores/flows';
 
 export default defineOperationApp({
 	id: 'trigger',
@@ -11,51 +12,56 @@ export default defineOperationApp({
 			text: flow,
 		},
 	],
-	options: [
-		{
-			field: 'flow',
-			name: '$t:operations.trigger.flow',
-			type: 'string',
-			meta: {
-				width: 'full',
-				interface: 'input-autocomplete-api',
-				options: {
-					url: '/flows?search={{value}}&filter[trigger]=operation',
-					resultsPath: 'data',
-					textPath: 'name',
-					valuePath: 'id',
-					iconRight: 'bolt',
-					placeholder: '$t:a_flow_uuid',
+	options: () => {
+		const flowStore = useFlowsStore();
+		const flowChoices = flowStore.flows
+			.filter((flow) => flow.trigger === 'operation')
+			.map((flow) => {
+				return { text: flow.name, value: flow.id };
+			});
+		return [
+			{
+				field: 'flow',
+				name: '$t:operations.trigger.flow',
+				type: 'string',
+				meta: {
+					width: 'full',
+					interface: 'select-dropdown',
+					options: {
+						choices: flowChoices,
+						iconRight: 'bolt',
+						placeholder: '$t:a_flow_uuid',
+					},
 				},
 			},
-		},
-		{
-			field: 'payload',
-			name: '$t:payload',
-			type: 'json',
-			meta: {
-				width: 'full',
-				interface: 'input-code',
-				options: {
-					language: 'json',
-					placeholder: JSON.stringify(
-						{
-							user: '{{ $accountability.user }}',
-							data: '{{ $last }}',
-						},
-						null,
-						2
-					),
-					template: JSON.stringify(
-						{
-							user: '{{ $accountability.user }}',
-							data: '{{ $last }}',
-						},
-						null,
-						2
-					),
+			{
+				field: 'payload',
+				name: '$t:payload',
+				type: 'json',
+				meta: {
+					width: 'full',
+					interface: 'input-code',
+					options: {
+						language: 'json',
+						placeholder: JSON.stringify(
+							{
+								user: '{{ $accountability.user }}',
+								data: '{{ $last }}',
+							},
+							null,
+							2
+						),
+						template: JSON.stringify(
+							{
+								user: '{{ $accountability.user }}',
+								data: '{{ $last }}',
+							},
+							null,
+							2
+						),
+					},
 				},
 			},
-		},
-	],
+		];
+	},
 });