From 8c8c5abe88ef423ab81ad440306a07e8217291f7 Mon Sep 17 00:00:00 2001
From: SahilDahekar <dahekar30sahil@gmail.com>
Date: Mon, 16 Dec 2024 20:18:16 +0530
Subject: [PATCH 1/2] Fixed code highlighting bug

---
 components/editor/CodeBlock.tsx | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/components/editor/CodeBlock.tsx b/components/editor/CodeBlock.tsx
index e5bd4675e3ab..e758c9357a60 100644
--- a/components/editor/CodeBlock.tsx
+++ b/components/editor/CodeBlock.tsx
@@ -275,20 +275,32 @@ export default function CodeBlock({
             lineNumberStyle={(lineNumber: number) => {
               const isHighlighted = highlightedLines && highlightedLines.includes(lineNumber);
 
-              return {
+              const styles = {
                 display: 'inline-block',
                 marginLeft: '16px',
                 paddingRight: '16px',
-                background: isHighlighted ? '#252f3f' : 'inherit',
+                backgroundColor: isHighlighted ? '#3e4d64' : '#252f3f',
                 color: isHighlighted ? '#A3ACAD' : '#8B9394'
               };
+
+              return styles;
             }}
             wrapLines={true}
             lineProps={(lineNumber: number) => {
               const isHighlighted = highlightedLines && highlightedLines.includes(lineNumber);
 
+              const style: React.CSSProperties = {
+                paddingRight: '2rem'
+              };
+
+              if (isHighlighted) {
+                style.display = 'block';
+                style.width = '100%';
+                style.backgroundColor = '#3e4d64';
+              }
+
               return {
-                className: `${isHighlighted ? 'bg-code-editor-dark-highlight block ml-10 w-full' : ''} pr-8`
+                style
               };
             }}
             codeTagProps={{

From 8d30dd17601652f1281233b0e2ecdf9befd3902d Mon Sep 17 00:00:00 2001
From: SahilDahekar <dahekar30sahil@gmail.com>
Date: Mon, 16 Dec 2024 21:04:35 +0530
Subject: [PATCH 2/2] Added coderabbit recommendation

---
 components/editor/CodeBlock.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/editor/CodeBlock.tsx b/components/editor/CodeBlock.tsx
index e758c9357a60..26f8a75a2906 100644
--- a/components/editor/CodeBlock.tsx
+++ b/components/editor/CodeBlock.tsx
@@ -273,9 +273,9 @@ export default function CodeBlock({
               background: '#252f3f'
             }}
             lineNumberStyle={(lineNumber: number) => {
-              const isHighlighted = highlightedLines && highlightedLines.includes(lineNumber);
+              const isHighlighted = highlightedLines?.includes(lineNumber);
 
-              const styles = {
+              const styles: React.CSSProperties = {
                 display: 'inline-block',
                 marginLeft: '16px',
                 paddingRight: '16px',
@@ -287,7 +287,7 @@ export default function CodeBlock({
             }}
             wrapLines={true}
             lineProps={(lineNumber: number) => {
-              const isHighlighted = highlightedLines && highlightedLines.includes(lineNumber);
+              const isHighlighted = highlightedLines?.includes(lineNumber);
 
               const style: React.CSSProperties = {
                 paddingRight: '2rem'