From 4a293ae7da50936b1171661eb6f9c9c21460fc70 Mon Sep 17 00:00:00 2001
From: Hoan Luu Huu <110280845+xquanluu@users.noreply.github.com>
Date: Mon, 2 Jun 2025 18:41:18 +0700
Subject: [PATCH] appEnvs should support enum dropdown (#532)

---
 src/api/types.ts                              |  1 +
 .../internal/views/applications/form.tsx      | 22 ++++++++++++++++++-
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/src/api/types.ts b/src/api/types.ts
index 749826b..f29159a 100644
--- a/src/api/types.ts
+++ b/src/api/types.ts
@@ -810,6 +810,7 @@ export interface AppEnvProperty {
   default?: string | number | boolean;
   obscure?: boolean;
   uiHint?: "input" | "textarea" | "filepicker";
+  enum?: string[];
 }
 
 export interface AppEnv {
diff --git a/src/containers/internal/views/applications/form.tsx b/src/containers/internal/views/applications/form.tsx
index 378f1ba..dc8ee8a 100644
--- a/src/containers/internal/views/applications/form.tsx
+++ b/src/containers/internal/views/applications/form.tsx
@@ -845,7 +845,9 @@ export const ApplicationForm = ({ application }: ApplicationFormProps) => {
                                         ? String(defaultValue)
                                         : "",
                                   onChange: (
-                                    e: React.ChangeEvent<HTMLInputElement>,
+                                    e: React.ChangeEvent<
+                                      HTMLInputElement | HTMLSelectElement
+                                    >,
                                   ) => {
                                     // Convert to proper type based on schema
                                     let newValue;
@@ -870,6 +872,11 @@ export const ApplicationForm = ({ application }: ApplicationFormProps) => {
                                   type: isNumber ? "number" : "text",
                                 };
 
+                                const isDropdown =
+                                  webhook.webhookEnv![key].type === "string" &&
+                                  (webhook.webhookEnv![key].enum?.length || 0) >
+                                    0;
+
                                 const textAreaSpecificProps = {
                                   rows: 6,
                                   cols: 61,
@@ -880,6 +887,19 @@ export const ApplicationForm = ({ application }: ApplicationFormProps) => {
                                   .obscure
                                   ? ObscureInput
                                   : webhook.webhookEnv![key].uiHint || "input";
+                                if (isDropdown) {
+                                  return (
+                                    <Selector
+                                      {...commonProps}
+                                      options={webhook.webhookEnv![
+                                        key
+                                      ].enum!.map((option) => ({
+                                        name: option,
+                                        value: option,
+                                      }))}
+                                    />
+                                  );
+                                }
                                 if (componentType === "filepicker") {
                                   return (
                                     <>