From 130e2ea946ee52b9327fd37c76fc7cebfb15e64b Mon Sep 17 00:00:00 2001
From: Ty Dunn <ty@tydunn.com>
Date: Sun, 18 Jun 2023 16:28:52 -0700
Subject: initial code

---
 extension/react-app/src/components/CodeBlock.tsx  |  4 ++--
 extension/react-app/src/components/StyledCode.tsx | 14 ++++++++++++++
 2 files changed, 16 insertions(+), 2 deletions(-)
 create mode 100644 extension/react-app/src/components/StyledCode.tsx

(limited to 'extension/react-app/src')

diff --git a/extension/react-app/src/components/CodeBlock.tsx b/extension/react-app/src/components/CodeBlock.tsx
index c4524a51..a720a6ce 100644
--- a/extension/react-app/src/components/CodeBlock.tsx
+++ b/extension/react-app/src/components/CodeBlock.tsx
@@ -5,6 +5,8 @@ import { defaultBorderRadius, secondaryDark, vscBackground } from ".";
 
 import { Clipboard, CheckCircle } from "@styled-icons/heroicons-outline";
 
+import StyledCode from "./StyledCode";
+
 const StyledPre = styled.pre`
   overflow-y: scroll;
   word-wrap: normal;
@@ -16,8 +18,6 @@ const StyledPre = styled.pre`
   padding-bottom: 16px;
 `;
 
-const StyledCode = styled.code``;
-
 const StyledCopyButton = styled.button<{ visible: boolean }>`
   /* position: relative; */
   float: right;
diff --git a/extension/react-app/src/components/StyledCode.tsx b/extension/react-app/src/components/StyledCode.tsx
new file mode 100644
index 00000000..16183e7f
--- /dev/null
+++ b/extension/react-app/src/components/StyledCode.tsx
@@ -0,0 +1,14 @@
+import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
+import { synthwave84 } from "react-syntax-highlighter/dist/esm/styles/prism";
+
+interface StyledCodeProps {
+    children: string;
+}
+
+const StyledCode = (props: (StyledCodeProps)) => (
+  <SyntaxHighlighter language="auto" style={synthwave84}>
+    {props.children}
+  </SyntaxHighlighter>
+);
+
+export default StyledCode;
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2