From 33f58581d06fca5b187dfacd6fc28f3eb2e3e087 Mon Sep 17 00:00:00 2001
From: Erick Zhao <ezhao@slack-corp.com>
Date: Thu, 1 May 2025 15:10:56 -0700
Subject: [PATCH 1/4] fix(compare): support for Windows newlines and improve
 formatting

---
 app/data/markdown-renderer.ts  | 12 ++++++------
 app/data/markdown.ts           |  2 +-
 app/routes/release/compare.tsx | 35 +++++++++++++++++-----------------
 3 files changed, 24 insertions(+), 25 deletions(-)

diff --git a/app/data/markdown-renderer.ts b/app/data/markdown-renderer.ts
index de10209..d1b9250 100644
--- a/app/data/markdown-renderer.ts
+++ b/app/data/markdown-renderer.ts
@@ -18,12 +18,12 @@ export const makeMD = (opts: {
 
   // Headings
   const headingSizes = {
-    '1': 'text-xl font-bold mb-3',
-    '2': 'text-xl font-semibold mb-3',
-    '3': 'text-xl font-semibold mb-3',
-    '4': 'text-xl font-semibold mb-3',
-    '5': 'text-lg font-medium mb-2',
-    '6': 'text-base font-medium mb-1',
+    '1': 'font-bold my-3',
+    '2': 'font-semibold my-3',
+    '3': 'font-semibold my-3',
+    '4': 'font-semibold my-3',
+    '5': 'font-medium my-2',
+    '6': 'text-base font-medium my-1',
   } as const;
   md.renderer.rules.heading_open = (tokens, idx) => {
     const level = tokens[idx].tag.slice(1) as '1' | '2' | '3' | '4' | '5' | '6';
diff --git a/app/data/markdown.ts b/app/data/markdown.ts
index 655eb0e..58fc95e 100644
--- a/app/data/markdown.ts
+++ b/app/data/markdown.ts
@@ -50,7 +50,7 @@ export const renderGroupedReleaseNotes = (versions: { version: string; content:
     groups[key] = [];
   }
   for (const { version, content } of versions) {
-    const headers = content.split(/^## ([A-Za-z ]+)\n/gm).slice(1);
+    const headers = content.split(/^## ([A-Za-z ]+)(?:\r\n|\n)/gm).slice(1);
     for (let i = 0; i < headers.length; i += 2) {
       const groupName = headers[i];
       const groupContent = headers[i + 1];
diff --git a/app/routes/release/compare.tsx b/app/routes/release/compare.tsx
index 246976e..13b14b1 100644
--- a/app/routes/release/compare.tsx
+++ b/app/routes/release/compare.tsx
@@ -72,22 +72,21 @@ export const loader = async (args: LoaderFunctionArgs) => {
     return redirect('/release');
   }
 
-  const grouped = renderGroupedReleaseNotes(
-    versionsForNotes.map((version, i) => {
-      let releaseNotes = githubReleaseNotes[i]!;
-      const parsed = semverParse(version);
-      if (parsed?.prerelease.length) {
-        releaseNotes = releaseNotes?.split(new RegExp(`@${escapeRegExp(version)}\`?.`))[1];
-      }
-      releaseNotes =
-        releaseNotes?.replace(/# Release Notes for [^\r\n]+(?:(?:\n)|(?:\r\n))/i, '') ||
-        'Missing...';
-      return {
-        version,
-        content: releaseNotes,
-      };
-    }),
-  );
+  const rawGroupedNotes = versionsForNotes.map((version, i) => {
+    let releaseNotes = githubReleaseNotes[i]!;
+    const parsed = semverParse(version);
+    if (parsed?.prerelease.length) {
+      releaseNotes = releaseNotes?.split(new RegExp(`@${escapeRegExp(version)}\`?.`))[1];
+    }
+    releaseNotes =
+      releaseNotes?.replace(/# Release Notes for [^\r\n]+(?:(?:\n)|(?:\r\n))/i, '') || 'Missing...';
+    return {
+      version,
+      content: releaseNotes,
+    };
+  });
+
+  const grouped = renderGroupedReleaseNotes(rawGroupedNotes);
 
   return {
     fromElectronRelease,
@@ -234,9 +233,9 @@ export default function CompareReleases() {
               {Object.keys(grouped).map((groupName) => {
                 return (
                   <div key={groupName}>
-                    <h4 className="text-lg font-semibold text-[#2f3241] dark:text-white mb-4">
+                    <h2 className="text-lg font-semibold text-[#2f3241] dark:text-white mb-4">
                       {groupName}
-                    </h4>
+                    </h2>
                     <ul className="space-y-6">
                       {grouped[groupName].map(({ version, content }) => {
                         const color = version === toElectronRelease.version ? 'green' : 'purple';

From 1d9a4087b337e2151519266869f044e5f026f914 Mon Sep 17 00:00:00 2001
From: Erick Zhao <ezhao@slack-corp.com>
Date: Thu, 1 May 2025 15:10:56 -0700
Subject: [PATCH 2/4] fix tests

---
 app/data/markdown.test.ts | 38 ++++++++++++++++++++++++++++++++++++--
 1 file changed, 36 insertions(+), 2 deletions(-)

diff --git a/app/data/markdown.test.ts b/app/data/markdown.test.ts
index 8487f65..0c79f65 100644
--- a/app/data/markdown.test.ts
+++ b/app/data/markdown.test.ts
@@ -8,14 +8,14 @@ import {
 describe('renderMarkdownSafely', () => {
   test('renders headers correctly', () => {
     expect(renderMarkdownSafely('# Foo')).toMatchInlineSnapshot(`
-      "<h1 class="text-xl font-bold mb-3 text-gray-900 dark:text-gray-100">Foo</h1>
+      "<h1 class="font-bold my-3 text-gray-900 dark:text-gray-100">Foo</h1>
       "
     `);
   });
 
   test('renders absurd headers correctly', () => {
     expect(renderMarkdownSafely('###### Foo')).toMatchInlineSnapshot(`
-      "<h6 class="text-base font-medium mb-1 text-gray-900 dark:text-gray-100">Foo</h6>
+      "<h6 class="text-base font-medium my-1 text-gray-900 dark:text-gray-100">Foo</h6>
       "
     `);
   });
@@ -192,4 +192,38 @@ describe('renderGroupedReleaseNotes', () => {
       }
     `);
   });
+
+  test('renders version grouped release notes correctly (Windows newlines)', () => {
+    const releaseNotes = [
+      {
+        version: 'v1.0.0',
+        content: '## New Feature\r\n\r\n* Added new feature',
+      },
+      {
+        version: 'v1.1.0',
+        content: '## New Feature\r\n\r\n* Added another feature',
+      },
+    ];
+
+    expect(renderGroupedReleaseNotes(releaseNotes)).toMatchInlineSnapshot(`
+      {
+        "New Feature": [
+          {
+            "content": "<ul>
+      <li><p class="mb-2 text-base text-gray-800 dark:text-gray-200">Added another feature</p></li>
+      </ul>
+      ",
+            "version": "v1.1.0",
+          },
+          {
+            "content": "<ul>
+      <li><p class="mb-2 text-base text-gray-800 dark:text-gray-200">Added new feature</p></li>
+      </ul>
+      ",
+            "version": "v1.0.0",
+          },
+        ],
+      }
+    `);
+  });
 });

From 9eb23f3466658a2693381f6af6bb37f29a0a8d34 Mon Sep 17 00:00:00 2001
From: Erick Zhao <ezhao@slack-corp.com>
Date: Thu, 1 May 2025 15:10:56 -0700
Subject: [PATCH 3/4] upshift levels in rendered markdown

---
 app/data/markdown-renderer.ts  | 7 ++++++-
 app/data/markdown.ts           | 2 +-
 app/routes/release/compare.tsx | 4 ++--
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/app/data/markdown-renderer.ts b/app/data/markdown-renderer.ts
index d1b9250..e6dac29 100644
--- a/app/data/markdown-renderer.ts
+++ b/app/data/markdown-renderer.ts
@@ -4,6 +4,7 @@ export const makeMD = (opts: {
   tailwindLists: boolean;
   md?: MarkdownIt;
   inlineCodeSmall?: boolean;
+  levelShift?: number;
 }) => {
   const md =
     opts.md ||
@@ -26,7 +27,11 @@ export const makeMD = (opts: {
     '6': 'text-base font-medium my-1',
   } as const;
   md.renderer.rules.heading_open = (tokens, idx) => {
-    const level = tokens[idx].tag.slice(1) as '1' | '2' | '3' | '4' | '5' | '6';
+    let level = tokens[idx].tag.slice(1) as '1' | '2' | '3' | '4' | '5' | '6';
+    if (opts.levelShift) {
+      const newLevel = Math.min(Math.max(parseInt(level) + opts.levelShift, 1), 6);
+      level = newLevel.toString() as '1' | '2' | '3' | '4' | '5' | '6';
+    }
     return `<h${level} class="${headingSizes[level]} text-gray-900 dark:text-gray-100">`;
   };
 
diff --git a/app/data/markdown.ts b/app/data/markdown.ts
index 58fc95e..5c85baf 100644
--- a/app/data/markdown.ts
+++ b/app/data/markdown.ts
@@ -13,7 +13,7 @@ const titleMdIt = new MarkdownIt('zero', {
 });
 titleMdIt.inline.ruler.enable(['backticks']);
 const listMD = makeMD({ tailwindLists: true, inlineCodeSmall: true });
-const noListMD = makeMD({ tailwindLists: false, inlineCodeSmall: true });
+const noListMD = makeMD({ tailwindLists: false, inlineCodeSmall: true, levelShift: 2 });
 const titleMD = makeMD({
   tailwindLists: false,
   md: titleMdIt,
diff --git a/app/routes/release/compare.tsx b/app/routes/release/compare.tsx
index 13b14b1..07b9783 100644
--- a/app/routes/release/compare.tsx
+++ b/app/routes/release/compare.tsx
@@ -233,9 +233,9 @@ export default function CompareReleases() {
               {Object.keys(grouped).map((groupName) => {
                 return (
                   <div key={groupName}>
-                    <h2 className="text-lg font-semibold text-[#2f3241] dark:text-white mb-4">
+                    <h4 className="text-lg font-semibold text-[#2f3241] dark:text-white mb-4">
                       {groupName}
-                    </h2>
+                    </h4>
                     <ul className="space-y-6">
                       {grouped[groupName].map(({ version, content }) => {
                         const color = version === toElectronRelease.version ? 'green' : 'purple';

From 457021e72a97b18c5fda5b009129bf029b8e96dd Mon Sep 17 00:00:00 2001
From: Erick Zhao <ezhao@slack-corp.com>
Date: Thu, 1 May 2025 15:10:56 -0700
Subject: [PATCH 4/4] tweak heading sizes

---
 app/data/markdown-renderer.ts | 10 +++++-----
 app/data/markdown.test.ts     |  2 +-
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/app/data/markdown-renderer.ts b/app/data/markdown-renderer.ts
index e6dac29..83e4c86 100644
--- a/app/data/markdown-renderer.ts
+++ b/app/data/markdown-renderer.ts
@@ -19,11 +19,11 @@ export const makeMD = (opts: {
 
   // Headings
   const headingSizes = {
-    '1': 'font-bold my-3',
-    '2': 'font-semibold my-3',
-    '3': 'font-semibold my-3',
-    '4': 'font-semibold my-3',
-    '5': 'font-medium my-2',
+    '1': 'text-xl font-bold my-3',
+    '2': 'text-xl font-semibold my-3',
+    '3': 'text-lg font-semibold my-3',
+    '4': 'text-lg font-semibold my-3',
+    '5': 'text-base font-medium my-2',
     '6': 'text-base font-medium my-1',
   } as const;
   md.renderer.rules.heading_open = (tokens, idx) => {
diff --git a/app/data/markdown.test.ts b/app/data/markdown.test.ts
index 0c79f65..1d6115b 100644
--- a/app/data/markdown.test.ts
+++ b/app/data/markdown.test.ts
@@ -8,7 +8,7 @@ import {
 describe('renderMarkdownSafely', () => {
   test('renders headers correctly', () => {
     expect(renderMarkdownSafely('# Foo')).toMatchInlineSnapshot(`
-      "<h1 class="font-bold my-3 text-gray-900 dark:text-gray-100">Foo</h1>
+      "<h1 class="text-xl font-bold my-3 text-gray-900 dark:text-gray-100">Foo</h1>
       "
     `);
   });