From 0b7bf89141d2f7eba035c06bd848034c6d55fce6 Mon Sep 17 00:00:00 2001
From: Nate Sesti <sestinj@gmail.com>
Date: Wed, 7 Jun 2023 01:08:34 -0400
Subject: dlt stuff

---
 .../react-app/src/components/StepContainer.tsx     | 22 ++++++++++++++--------
 1 file changed, 14 insertions(+), 8 deletions(-)

(limited to 'extension/react-app/src/components/StepContainer.tsx')

diff --git a/extension/react-app/src/components/StepContainer.tsx b/extension/react-app/src/components/StepContainer.tsx
index a150e370..8ea54325 100644
--- a/extension/react-app/src/components/StepContainer.tsx
+++ b/extension/react-app/src/components/StepContainer.tsx
@@ -50,8 +50,9 @@ const StepContainerDiv = styled.div<{ open: boolean }>`
   /* padding: 8px; */
 `;
 
-const HeaderDiv = styled.div`
-  background-color: ${vscBackgroundTransparent};
+const HeaderDiv = styled.div<{ error: boolean }>`
+  background-color: ${(props) =>
+    props.error ? "#522" : vscBackgroundTransparent};
   display: grid;
   grid-template-columns: 1fr auto;
   align-items: center;
@@ -124,17 +125,23 @@ function StepContainer(props: StepContainerProps) {
     >
       <StepContainerDiv open={open}>
         <GradientBorder
+          borderColor={
+            props.historyNode.observation?.error ? "#f00" : undefined
+          }
           className="overflow-hidden cursor-pointer"
           onClick={() => setOpen((prev) => !prev)}
         >
-          <HeaderDiv>
+          <HeaderDiv
+            error={props.historyNode.observation?.error ? true : false}
+          >
             <h4 className="m-2">
               {open ? (
                 <ChevronDown size="1.4em" />
               ) : (
                 <ChevronRight size="1.4em" />
               )}
-              {props.historyNode.step.name as any}
+              {props.historyNode.observation?.title ||
+                (props.historyNode.step.name as any)}
             </h4>
             {/* <HeaderButton
               onClick={(e) => {
@@ -171,10 +178,9 @@ function StepContainer(props: StepContainerProps) {
           )}
 
           {props.historyNode.observation?.error ? (
-            <ToggleErrorDiv
-              title={"Error while running step:"}
-              error={props.historyNode.observation.error as string}
-            />
+            <pre className="overflow-x-scroll">
+              {props.historyNode.observation.error as string}
+            </pre>
           ) : (
             <ReactMarkdown key={1} className="overflow-scroll">
               {props.historyNode.step.description as any}
-- 
cgit v1.2.3-70-g09d2