From 0adac52b7733b32540b91e254244a08467c8650f Mon Sep 17 00:00:00 2001
From: Ty Dunn <ty@tydunn.com>
Date: Tue, 4 Jul 2023 22:23:04 -0700
Subject: stop inside of circle

---
 extension/react-app/src/components/StepContainer.tsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 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 311f68cf..183ffeef 100644
--- a/extension/react-app/src/components/StepContainer.tsx
+++ b/extension/react-app/src/components/StepContainer.tsx
@@ -10,8 +10,8 @@ import {
 import {
   ChevronDown,
   ChevronRight,
-  XMark,
   ArrowPath,
+  XMark
 } from "@styled-icons/heroicons-outline";
 import {
   Stop,
@@ -210,9 +210,10 @@ function StepContainer(props: StepContainerProps) {
                   e.stopPropagation();
                   props.onDelete();
                 }}
-                text="Delete"
+                text={props.historyNode.active ? "Stop" : "Delete"}
+                active={props.historyNode.active}
               >
-                <Stop size="1.6em" onClick={props.onDelete} />
+                {props.historyNode.active ? <Stop size="1.6em" onClick={props.onDelete} /> :<XMark size="1.6em" onClick={props.onDelete} />}
               </HeaderButtonWithText>
               {props.historyNode.observation?.error ? (
                 <HeaderButtonWithText
-- 
cgit v1.2.3-70-g09d2