From 881718c4c7f58837a8a208930e7d2c69b9433fd7 Mon Sep 17 00:00:00 2001
From: Nate Sesti <sestinj@gmail.com>
Date: Tue, 6 Jun 2023 17:50:50 -0400
Subject: trying to reliably capture terminal output in vsc

---
 .../react-app/src/components/ToggleErrorDiv.tsx    | 41 ++++++++++++++++++++++
 1 file changed, 41 insertions(+)
 create mode 100644 extension/react-app/src/components/ToggleErrorDiv.tsx

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

diff --git a/extension/react-app/src/components/ToggleErrorDiv.tsx b/extension/react-app/src/components/ToggleErrorDiv.tsx
new file mode 100644
index 00000000..69112ef7
--- /dev/null
+++ b/extension/react-app/src/components/ToggleErrorDiv.tsx
@@ -0,0 +1,41 @@
+import React, { useState } from "react";
+import styled from "styled-components";
+import { defaultBorderRadius } from ".";
+
+// Should be a toggleable div with red border and light red background that displays a main message and detail inside
+
+interface ToggleErrorDivProps {
+  title: string;
+  error: string;
+}
+
+const TopDiv = styled.div`
+  border: 1px solid red;
+  background-color: #ff000020;
+  padding: 8px;
+
+  border-radius: ${defaultBorderRadius};
+  cursor: pointer;
+`;
+
+const ToggleErrorDiv = (props: ToggleErrorDivProps) => {
+  const [open, setOpen] = useState(false);
+  return (
+    <TopDiv
+      onClick={() => {
+        setOpen(!open);
+      }}
+    >
+      <div className="flex flex-row">
+        <div className="flex-grow">
+          <p>
+            {open ? "▼" : "▶"} {props.title}
+          </p>
+        </div>
+      </div>
+      {open && <pre className="overflow-scroll">{props.error}</pre>}
+    </TopDiv>
+  );
+};
+
+export default ToggleErrorDiv;
-- 
cgit v1.2.3-70-g09d2