From 87928d2600efb1e9252023b04338c0c10044a90c Mon Sep 17 00:00:00 2001
From: CrabHo <CrabHo@users.noreply.github.com>
Date: Thu, 11 Mar 2021 13:50:37 +0800
Subject: [PATCH 1/2] fix: non multi pipline steps is not display

---
 .../repo/screens/build/components/procs.js    | 35 ++++++++-----------
 1 file changed, 15 insertions(+), 20 deletions(-)

diff --git a/web/src/screens/repo/screens/build/components/procs.js b/web/src/screens/repo/screens/build/components/procs.js
index 8e8e398c1..3f3b6e2d4 100644
--- a/web/src/screens/repo/screens/build/components/procs.js
+++ b/web/src/screens/repo/screens/build/components/procs.js
@@ -18,7 +18,7 @@ const renderEnviron = data => {
 class ProcListHolder extends Component {
   constructor(props, context) {
     super(props, context);
-    this.state = { open: false };
+    this.state = { open: !this.props.vars.environ };
   }
 
   toggleOpen = () => {
@@ -30,27 +30,22 @@ class ProcListHolder extends Component {
     const groupExpandStatus = this.state.open
       ? styles.collapsed
       : styles.expanded;
+
+    let name = "default";
+    if (vars.environ) {
+      name = Object.entries(vars.environ).map(renderEnviron);
+    } else if (renderName && vars.name !== "woodpecker") {
+      name = vars.name;
+    }
+
     return (
       <div className={styles.list}>
-        {renderName && vars.name !== "drone" ? (
-          <div
-            onClick={this.toggleOpen}
-            className={`${styles.group} ${groupExpandStatus}`}
-          >
-            <StatusText status={vars.state} text={vars.name} />
-          </div>
-        ) : null}
-        {vars.environ ? (
-          <div
-            onClick={this.toggleOpen}
-            className={`${styles.group} ${groupExpandStatus}`}
-          >
-            <StatusText
-              status={vars.state}
-              text={Object.entries(vars.environ).map(renderEnviron)}
-            />
-          </div>
-        ) : null}
+        <div
+          onClick={this.toggleOpen}
+          className={`${styles.group} ${groupExpandStatus}`}
+        >
+          <StatusText status={vars.state} text={name} />
+        </div>
         <div className={!this.state.open ? styles.hide : ""}>{children}</div>
       </div>
     );

From b558e0b429ab1a5de059297148ee1d9db23e4de1 Mon Sep 17 00:00:00 2001
From: CrabHo <CrabHo@users.noreply.github.com>
Date: Fri, 12 Mar 2021 13:52:08 +0800
Subject: [PATCH 2/2] feat: improve ProvListHolder UI

---
 .../repo/screens/build/components/procs.js       | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/web/src/screens/repo/screens/build/components/procs.js b/web/src/screens/repo/screens/build/components/procs.js
index 3f3b6e2d4..89eb07404 100644
--- a/web/src/screens/repo/screens/build/components/procs.js
+++ b/web/src/screens/repo/screens/build/components/procs.js
@@ -18,7 +18,7 @@ const renderEnviron = data => {
 class ProcListHolder extends Component {
   constructor(props, context) {
     super(props, context);
-    this.state = { open: !this.props.vars.environ };
+    this.state = { open: !this.props.renderName };
   }
 
   toggleOpen = () => {
@@ -26,17 +26,17 @@ class ProcListHolder extends Component {
   };
 
   render() {
-    const { vars, renderName, children } = this.props;
+    const { vars, children } = this.props;
     const groupExpandStatus = this.state.open
       ? styles.collapsed
       : styles.expanded;
 
-    let name = "default";
-    if (vars.environ) {
-      name = Object.entries(vars.environ).map(renderEnviron);
-    } else if (renderName && vars.name !== "woodpecker") {
-      name = vars.name;
-    }
+    let name = (
+      <div>
+        <div>{vars.name === "woodpecker" ? "default" : vars.name}</div>
+        {vars.environ ? Object.entries(vars.environ).map(renderEnviron) : ""}
+      </div>
+    );
 
     return (
       <div className={styles.list}>