From 03aac35a076caaa14eeeaf2115555cfcc65ea0e1 Mon Sep 17 00:00:00 2001
From: Nate Sesti <sestinj@gmail.com>
Date: Thu, 29 Jun 2023 17:32:03 -0700
Subject: small fixes
---
extension/react-app/src/components/CodeBlock.tsx | 91 +++++++++++++-----------
1 file changed, 48 insertions(+), 43 deletions(-)
(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 508dcc83..1624b986 100644
--- a/extension/react-app/src/components/CodeBlock.tsx
+++ b/extension/react-app/src/components/CodeBlock.tsx
@@ -65,51 +65,56 @@ function CodeBlock(props: { children: React.ReactNode }) {
const [result, setResult] = useState<AutoHighlightResult | undefined>(
undefined
);
+
+ const [highlightTimeout, setHighlightTimeout] = useState<
+ NodeJS.Timeout | undefined
+ >(undefined);
+
useEffect(() => {
- 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",
- ]
+ // Don't highlight more than once every 100ms
+ if (highlightTimeout) {
+ return;
+ }
+
+ setHighlightTimeout(
+ setTimeout(() => {
+ 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",
+ "julia",
+ "objectivec",
+ "ocaml",
+ ]
+ );
+ setResult(result);
+ setHighlightTimeout(undefined);
+ }, 100)
);
- console.log(result);
- setResult(result);
}, [props.children]);
const [hovered, setHovered] = useState<boolean>(false);
--
cgit v1.2.3-70-g09d2