From cf9d8c40f480be22c1cfd0493177b5a61adf8d0f Mon Sep 17 00:00:00 2001
From: Nate Sesti <sestinj@gmail.com>
Date: Mon, 26 Jun 2023 17:41:12 -0700
Subject: syntax highlighting lang auto detection
---
extension/react-app/src/components/CodeBlock.tsx | 54 +++++++++++++++++++++--
extension/react-app/src/components/StyledCode.tsx | 2 +-
2 files changed, 52 insertions(+), 4 deletions(-)
(limited to 'extension/react-app/src/components')
diff --git a/extension/react-app/src/components/CodeBlock.tsx b/extension/react-app/src/components/CodeBlock.tsx
index 98760fbd..b0de13ac 100644
--- a/extension/react-app/src/components/CodeBlock.tsx
+++ b/extension/react-app/src/components/CodeBlock.tsx
@@ -61,9 +61,55 @@ function CopyButton(props: { textToCopy: string; visible: boolean }) {
);
}
-function CodeBlock(props: { language?: string; children: string }) {
+function CodeBlock(props: { children: string }) {
+ const [result, setResult] = useState<AutoHighlightResult | undefined>(
+ undefined
+ );
useEffect(() => {
- hljs.highlightAll();
+ const result = hljs.highlightAuto(
+ (props.children as any).props.children[0],
+ [
+ "python",
+ "javascript",
+ "typescript",
+ "bash",
+ "html",
+ "css",
+ "json",
+ "yaml",
+ "markdown",
+ "sql",
+ "java",
+ "c",
+ "cpp",
+ "csharp",
+ "go",
+ "kotlin",
+ "php",
+ "ruby",
+ "rust",
+ "scala",
+ "swift",
+ "dart",
+ "haskell",
+ "perl",
+ "r",
+ "matlab",
+ "powershell",
+ "lua",
+ "elixir",
+ "clojure",
+ "groovy",
+ "julia",
+ "vbnet",
+ "objectivec",
+ "fsharp",
+ "erlang",
+ "ocaml",
+ ]
+ );
+ console.log(result);
+ setResult(result);
}, [props.children]);
const [hovered, setHovered] = useState<boolean>(false);
@@ -82,7 +128,9 @@ function CodeBlock(props: { language?: string; children: string }) {
textToCopy={(props.children as any).props.children[0]}
/>
</CopyButtonDiv>
- <StyledCode language={props.language}>{props.children}</StyledCode>
+ <StyledCode language={result?.language}>
+ {(props.children as any).props.children[0]}
+ </StyledCode>
</StyledPre>
);
}
diff --git a/extension/react-app/src/components/StyledCode.tsx b/extension/react-app/src/components/StyledCode.tsx
index 485c70b6..c5ed0101 100644
--- a/extension/react-app/src/components/StyledCode.tsx
+++ b/extension/react-app/src/components/StyledCode.tsx
@@ -12,7 +12,7 @@ const StyledCode = (props: StyledCodeProps) => (
style={highlightStyle}
language={props.language || "python"}
>
- {(props.children as any).props.children}
+ {props.children}
</SyntaxHighlighter>
);
--
cgit v1.2.3-70-g09d2