rename variables and add comments

vercel · Jan 27, 2024 · 9c00d5f · 9c00d5f
1 parent b6a6a28
commit 9c00d5f
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 6 deletions.
diff --git a/.../next/src/client/components/react-dev-overlay/internal/components/CodeFrame/CodeFrame.tsx b/.../next/src/client/components/react-dev-overlay/internal/components/CodeFrame/CodeFrame.tsx
@@ -14,7 +14,9 @@ export const CodeFrame: React.FC<CodeFrameProps> = function CodeFrame({
   // Strip leading spaces out of the code frame:
   const formattedFrame = React.useMemo<string>(() => {
     const lines = codeFrame.split(/\r?\n/g)
-    const prefixLength = lines
+
+    // Find the minimum length of leading spaces after `|` in the code frame
+    const miniLeadingSpacesLength = lines
       .map((line) =>
         /^>? +\d+ +\| [ ]+/.exec(stripAnsi(line)) === null
           ? null
@@ -24,12 +26,14 @@ export const CodeFrame: React.FC<CodeFrameProps> = function CodeFrame({
       .map((v) => v!.pop()!)
       .reduce((c, n) => (isNaN(c) ? n.length : Math.min(c, n.length)), NaN)
 
-    if (prefixLength > 1) {
+    // When the minimum length of leading spaces is greater than 1, remove them
+    // from the code frame to help the indentation looks better when there's a lot leading spaces.
+    if (miniLeadingSpacesLength > 1) {
       return lines
         .map((line, a) =>
           ~(a = line.indexOf('|'))
             ? line.substring(0, a) +
-              line.substring(a).replace(`^\\ {${prefixLength}}`, '')
+              line.substring(a).replace(`^\\ {${miniLeadingSpacesLength}}`, '')
             : line
         )
         .join('\n')

diff --git a/packages/react-dev-overlay/src/internal/components/CodeFrame/CodeFrame.tsx b/packages/react-dev-overlay/src/internal/components/CodeFrame/CodeFrame.tsx
@@ -16,7 +16,9 @@ export const CodeFrame: React.FC<CodeFrameProps> = function CodeFrame({
   // Strip leading spaces out of the code frame:
   const formattedFrame = React.useMemo<string>(() => {
     const lines = codeFrame.split(/\r?\n/g)
-    const prefixLength = lines
+
+    // Find the minimum length of leading spaces after `|` in the code frame
+    const miniLeadingSpacesLength = lines
       .map((line) =>
         /^>? +\d+ +\| [ ]+/.exec(stripAnsi(line)) === null
           ? null
@@ -26,12 +28,16 @@ export const CodeFrame: React.FC<CodeFrameProps> = function CodeFrame({
       .map((v) => v!.pop()!)
       .reduce((c, n) => (isNaN(c) ? n.length : Math.min(c, n.length)), NaN)
 
-    if (prefixLength > 1) {
+    // When the minimum length of leading spaces is greater than 1, remove them
+    // from the code frame to help the indentation looks better when there's a lot leading spaces.
+    if (miniLeadingSpacesLength > 1) {
       return lines
         .map((line, a) =>
           ~(a = line.indexOf('|'))
             ? line.substring(0, a) +
-              line.substring(a).replace(new RegExp(`^\\ {${prefixLength}}`), '')
+              line
+                .substring(a)
+                .replace(new RegExp(`^\\ {${miniLeadingSpacesLength}}`), '')
             : line
         )
         .join('\n')