From 458d2837163489ebaab0b21b3d6f3ab89c6a45d2 Mon Sep 17 00:00:00 2001 From: Ty Dunn Date: Tue, 4 Jul 2023 21:14:35 -0700 Subject: new stop --- extension/package-lock.json | 27 ++++++++++++++++++++++ extension/package.json | 1 + .../react-app/src/components/StepContainer.tsx | 5 +++- 3 files changed, 32 insertions(+), 1 deletion(-) (limited to 'extension') diff --git a/extension/package-lock.json b/extension/package-lock.json index c9b8b757..4a3e01f2 100644 --- a/extension/package-lock.json +++ b/extension/package-lock.json @@ -15,6 +15,7 @@ "@segment/analytics-node": "^0.0.1-beta.16", "@sentry/node": "^7.57.0", "@styled-icons/heroicons-outline": "^10.47.0", + "@styled-icons/heroicons-solid": "^10.47.0", "@vitejs/plugin-react-swc": "^3.3.2", "axios": "^1.2.5", "downshift": "^7.6.0", @@ -2238,6 +2239,23 @@ "styled-components": "*" } }, + "node_modules/@styled-icons/heroicons-solid": { + "version": "10.47.0", + "resolved": "https://registry.npmjs.org/@styled-icons/heroicons-solid/-/heroicons-solid-10.47.0.tgz", + "integrity": "sha512-j+tJx2NzLG2tc91IXJVwKNjsI/osxmak+wmLfnfBsB+49srpxMYjuLPMtl9ZY/xgbNsWO36O+/N5Zf5bkgiKcQ==", + "dependencies": { + "@babel/runtime": "^7.20.7", + "@styled-icons/styled-icon": "^10.7.0" + }, + "funding": { + "type": "GitHub", + "url": "https://github.com/sponsors/jacobwgillespie" + }, + "peerDependencies": { + "react": "*", + "styled-components": "*" + } + }, "node_modules/@styled-icons/styled-icon": { "version": "10.7.0", "resolved": "https://registry.npmjs.org/@styled-icons/styled-icon/-/styled-icon-10.7.0.tgz", @@ -13120,6 +13138,15 @@ "@styled-icons/styled-icon": "^10.7.0" } }, + "@styled-icons/heroicons-solid": { + "version": "10.47.0", + "resolved": "https://registry.npmjs.org/@styled-icons/heroicons-solid/-/heroicons-solid-10.47.0.tgz", + "integrity": "sha512-j+tJx2NzLG2tc91IXJVwKNjsI/osxmak+wmLfnfBsB+49srpxMYjuLPMtl9ZY/xgbNsWO36O+/N5Zf5bkgiKcQ==", + "requires": { + "@babel/runtime": "^7.20.7", + "@styled-icons/styled-icon": "^10.7.0" + } + }, "@styled-icons/styled-icon": { "version": "10.7.0", "resolved": "https://registry.npmjs.org/@styled-icons/styled-icon/-/styled-icon-10.7.0.tgz", diff --git a/extension/package.json b/extension/package.json index 184d16e2..f39e7bd7 100644 --- a/extension/package.json +++ b/extension/package.json @@ -242,6 +242,7 @@ "@segment/analytics-node": "^0.0.1-beta.16", "@sentry/node": "^7.57.0", "@styled-icons/heroicons-outline": "^10.47.0", + "@styled-icons/heroicons-solid": "^10.47.0", "@vitejs/plugin-react-swc": "^3.3.2", "axios": "^1.2.5", "downshift": "^7.6.0", diff --git a/extension/react-app/src/components/StepContainer.tsx b/extension/react-app/src/components/StepContainer.tsx index ab0d307f..492857b5 100644 --- a/extension/react-app/src/components/StepContainer.tsx +++ b/extension/react-app/src/components/StepContainer.tsx @@ -13,6 +13,9 @@ import { XMark, ArrowPath, } from "@styled-icons/heroicons-outline"; +import { + Stop, +} from "@styled-icons/heroicons-solid"; import { HistoryNode } from "../../../schema/HistoryNode"; import ReactMarkdown from "react-markdown"; import HeaderButtonWithText from "./HeaderButtonWithText"; @@ -208,7 +211,7 @@ function StepContainer(props: StepContainerProps) { }} text="Delete" > - + {props.historyNode.observation?.error ? ( Date: Tue, 4 Jul 2023 22:23:04 -0700 Subject: stop inside of circle --- extension/react-app/package-lock.json | 27 ++++++++++++++++++++++ extension/react-app/package.json | 1 + .../src/components/HeaderButtonWithText.tsx | 4 +++- .../react-app/src/components/StepContainer.tsx | 7 +++--- 4 files changed, 35 insertions(+), 4 deletions(-) (limited to 'extension') diff --git a/extension/react-app/package-lock.json b/extension/react-app/package-lock.json index 85b8633b..fb13dffd 100644 --- a/extension/react-app/package-lock.json +++ b/extension/react-app/package-lock.json @@ -9,6 +9,7 @@ "version": "0.0.0", "dependencies": { "@styled-icons/heroicons-outline": "^10.47.0", + "@styled-icons/heroicons-solid": "^10.47.0", "@types/vscode-webview": "^1.57.1", "downshift": "^7.6.0", "posthog-js": "^1.58.0", @@ -691,6 +692,23 @@ "styled-components": "*" } }, + "node_modules/@styled-icons/heroicons-solid": { + "version": "10.47.0", + "resolved": "https://registry.npmjs.org/@styled-icons/heroicons-solid/-/heroicons-solid-10.47.0.tgz", + "integrity": "sha512-j+tJx2NzLG2tc91IXJVwKNjsI/osxmak+wmLfnfBsB+49srpxMYjuLPMtl9ZY/xgbNsWO36O+/N5Zf5bkgiKcQ==", + "dependencies": { + "@babel/runtime": "^7.20.7", + "@styled-icons/styled-icon": "^10.7.0" + }, + "funding": { + "type": "GitHub", + "url": "https://github.com/sponsors/jacobwgillespie" + }, + "peerDependencies": { + "react": "*", + "styled-components": "*" + } + }, "node_modules/@styled-icons/styled-icon": { "version": "10.7.0", "resolved": "https://registry.npmjs.org/@styled-icons/styled-icon/-/styled-icon-10.7.0.tgz", @@ -3937,6 +3955,15 @@ "@styled-icons/styled-icon": "^10.7.0" } }, + "@styled-icons/heroicons-solid": { + "version": "10.47.0", + "resolved": "https://registry.npmjs.org/@styled-icons/heroicons-solid/-/heroicons-solid-10.47.0.tgz", + "integrity": "sha512-j+tJx2NzLG2tc91IXJVwKNjsI/osxmak+wmLfnfBsB+49srpxMYjuLPMtl9ZY/xgbNsWO36O+/N5Zf5bkgiKcQ==", + "requires": { + "@babel/runtime": "^7.20.7", + "@styled-icons/styled-icon": "^10.7.0" + } + }, "@styled-icons/styled-icon": { "version": "10.7.0", "resolved": "https://registry.npmjs.org/@styled-icons/styled-icon/-/styled-icon-10.7.0.tgz", diff --git a/extension/react-app/package.json b/extension/react-app/package.json index e46fdc8c..12701906 100644 --- a/extension/react-app/package.json +++ b/extension/react-app/package.json @@ -10,6 +10,7 @@ }, "dependencies": { "@styled-icons/heroicons-outline": "^10.47.0", + "@styled-icons/heroicons-solid": "^10.47.0", "@types/vscode-webview": "^1.57.1", "downshift": "^7.6.0", "posthog-js": "^1.58.0", diff --git a/extension/react-app/src/components/HeaderButtonWithText.tsx b/extension/react-app/src/components/HeaderButtonWithText.tsx index 3ddac93c..72a653c5 100644 --- a/extension/react-app/src/components/HeaderButtonWithText.tsx +++ b/extension/react-app/src/components/HeaderButtonWithText.tsx @@ -8,15 +8,17 @@ interface HeaderButtonWithTextProps { children: React.ReactNode; disabled?: boolean; inverted?: boolean; + active?: boolean; } const HeaderButtonWithText = (props: HeaderButtonWithTextProps) => { const [hover, setHover] = useState(false); + const paddingLeft = (props.disabled ? (props.active ? "3px" : "1px"): (hover ? "4px" : "1px")); return ( { if (!props.disabled) { setHover(true); 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} > - + {props.historyNode.active ? :} {props.historyNode.observation?.error ? (