Simplify the syntax highlighter

components/SyntaxHighlighter.tsx

@@ -2,19 +2,19 @@ import {LightAsync} from "react-syntax-highlighter";
 import {a11yDark} from "react-syntax-highlighter/dist/cjs/styles/hljs";
 
 function SyntaxHighlighter(props) {
-    const {children, className, node, ...rest} = props;
-    const match = /language-(\w+)/.exec(className || "");
-
+    const {children, className} = props;
     if (!children) {
         return null;
     }
 
+    // An example className is "language-python"
+    const languageMatch = /language-(\w+)/.exec(className || "");
+
     return (
         <LightAsync
-            {...rest}
             PreTag="div"
-            children={String(children).replace(/\n$/, "")}
-            language={match?.[1] ?? "txt"}
+            children={children}
+            language={languageMatch?.[1] ?? "txt"}
             style={a11yDark}
         />
     );

components/Template.tsx

@@ -3,7 +3,7 @@ import ReactMarkdown from "react-markdown";
 import TextareaAutosize from "react-textarea-autosize";
 import SyntaxHighlighter from "./SyntaxHighlighter";
 
-const initialTemplate = `# Foobar
+const INITIAL_TEMPLATE = `# Foobar
 
 Foobar is a Python library for dealing with word pluralization.
 
@@ -42,7 +42,7 @@ Please make sure to update tests as appropriate.
 [MIT](https://choosealicense.com/licenses/mit/)`;
 
 export function Template() {
-    const [template, setTemplate] = useState(initialTemplate);
+    const [template, setTemplate] = useState(INITIAL_TEMPLATE);
 
     return (
         <section id="template" className="bg-medium-gray pb-10">