From f1fb46ef67628f634c00218b9e7158b3c5796640 Mon Sep 17 00:00:00 2001
From: Sumit Kumar <sumit76231@gmail.com>
Date: Wed, 3 Jun 2026 23:25:01 +0530
Subject: [PATCH] fix(home): escape HTML entities in CodeLine before injecting
 highlight spans

highlightCode() injected <span> tags via dangerouslySetInnerHTML without
first escaping HTML special characters in the source text. Any code line
containing '<', '>', or '&' (generics, JSX, comparison operators) would
be parsed as HTML by the browser, corrupting the rendered output.

Added escapeHtml() that replaces &, <, > with their entities before the
regex replacements run. Single and double quotes are intentionally left
unescaped because the string-literal highlight patterns depend on them.

Fixes #462
---
 modules/home/code-line.tsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/modules/home/code-line.tsx b/modules/home/code-line.tsx
index 06da7478..945ba826 100644
--- a/modules/home/code-line.tsx
+++ b/modules/home/code-line.tsx
@@ -21,8 +21,15 @@ export const CodeLine = ({ line }: { line: string }) => {
         return <span dangerouslySetInnerHTML={{ __html: highlightCode(highlighted) }} />;
     };
 
+    const escapeHtml = (code: string): string =>
+        code
+            .replace(/&/g, '&amp;')
+            .replace(/</g, '&lt;')
+            .replace(/>/g, '&gt;');
+
     const highlightCode = (code: string) => {
-        return code
+        const safe = escapeHtml(code);
+        return safe
             .replace(/import|from|export|default|return|const|new/g, '<span class="text-red-500 dark:text-red-400 font-semibold">$&</span>')
             .replace(/'[^']*'/g, '<span class="text-amber-600 dark:text-amber-400">$&</span>')
             .replace(/"[^"]*"/g, '<span class="text-amber-600 dark:text-amber-400">$&</span>')