From 627f7ea4350e3658613280c70a3cbd047c37e67f Mon Sep 17 00:00:00 2001
From: Son Luong Ngoc <sluongng@gmail.com>
Date: Thu, 14 Nov 2024 12:40:26 +0100
Subject: [PATCH] workflows: add Action Names and Env to Run Workflow button
 (#7877)

Let user decide which action to run from our web UI.
The field accepts multiple action names separated by comma (`,`).

Custom input could be provided via environment variables.
The environment variables should be specified in comma-separated
key-value pairs.
For example: `VAR1=value1,VAR2=value2`.

---------

Co-authored-by: Brandon Duffany <brandon@buildbuddy.io>
---
 enterprise/app/workflows/BUILD         |  1 -
 enterprise/app/workflows/workflows.tsx | 28 +++++++++++++++++++++++++-
 2 files changed, 27 insertions(+), 2 deletions(-)

diff --git a/enterprise/app/workflows/BUILD b/enterprise/app/workflows/BUILD
index 0cc5cc739f6..66e91006c2f 100644
--- a/enterprise/app/workflows/BUILD
+++ b/enterprise/app/workflows/BUILD
@@ -13,7 +13,6 @@ ts_library(
         "//app/capabilities",
         "//app/components/button",
         "//app/components/button:link_button",
-        "//app/components/checkbox",
         "//app/components/dialog:simple_modal_dialog",
         "//app/components/input",
         "//app/components/link",
diff --git a/enterprise/app/workflows/workflows.tsx b/enterprise/app/workflows/workflows.tsx
index 1cfde9e5399..c977a058c30 100644
--- a/enterprise/app/workflows/workflows.tsx
+++ b/enterprise/app/workflows/workflows.tsx
@@ -23,7 +23,6 @@ import TextInput from "../../../app/components/input/input";
 import alert_service from "../../../app/alert/alert_service";
 import errorService from "../../../app/errors/error_service";
 import Spinner from "../../../app/components/spinner/spinner";
-import Checkbox from "../../../app/components/checkbox/checkbox";
 import ActionListComponent from "./action_list";
 
 type Workflow = workflow.GetWorkflowsResponse.Workflow;
@@ -359,6 +358,8 @@ type RepoItemState = {
   isMenuOpen: boolean;
 
   showRunWorkflowInput: boolean;
+  runWorkflowActionNames: string;
+  runWorkflowEnv: string;
   runWorkflowBranch: string;
   runWorkflowVisibility: string;
   isWorkflowRunning: boolean;
@@ -370,6 +371,8 @@ class RepoItem extends React.Component<RepoItemProps, RepoItemState> {
   state: RepoItemState = {
     isMenuOpen: false,
     showRunWorkflowInput: false,
+    runWorkflowActionNames: "",
+    runWorkflowEnv: "",
     runWorkflowBranch: "",
     runWorkflowVisibility: "",
     isWorkflowRunning: false,
@@ -415,6 +418,19 @@ class RepoItem extends React.Component<RepoItemProps, RepoItemState> {
       .executeWorkflow(
         new workflow.ExecuteWorkflowRequest({
           pushedRepoUrl: this.props.repoUrl,
+          // Parse "var1=val1,var2=val2" string from the input field to Record<string, string>
+          env: Object.fromEntries<string>(
+            this.state.runWorkflowEnv
+              .split(",")
+              .filter((n) => n.includes("="))
+              .map((n) => n.trim().split("="))
+              .filter((parts) => parts.length)
+              .map(([name, ...valueParts]) => [name, valueParts.join("=")])
+          ),
+          actionNames: this.state.runWorkflowActionNames
+            .split(",")
+            .map((n) => n.trim())
+            .filter((n) => n.length > 0),
           pushedBranch: this.state.runWorkflowBranch,
           targetRepoUrl: this.props.repoUrl,
           targetBranch: this.state.runWorkflowBranch,
@@ -529,6 +545,16 @@ class RepoItem extends React.Component<RepoItemProps, RepoItemState> {
                       placeholder={"e.g. PUBLIC (optional)"}
                       onChange={(e) => this.setState({ runWorkflowVisibility: e.target.value })}
                     />
+                    <div className="title">Action Names:</div>
+                    <TextInput
+                      placeholder={"e.g. Test,Build"}
+                      onChange={(e) => this.setState({ runWorkflowActionNames: e.target.value })}
+                    />
+                    <div className="title">Environment Variables:</div>
+                    <TextInput
+                      placeholder={"e.g. VAR1=value1,VAR2=value2"}
+                      onChange={(e) => this.setState({ runWorkflowEnv: e.target.value })}
+                    />
                     <FilledButton onClick={this.runWorkflow.bind(this)} disabled={this.state.runWorkflowBranch === ""}>
                       Run
                     </FilledButton>