From e43df2f5a78f487cb5a5cad4c2ad7ecb971c0b68 Mon Sep 17 00:00:00 2001
From: Duro <47304910+DuroCodes@users.noreply.github.com>
Date: Wed, 22 May 2024 20:15:07 -0400
Subject: [PATCH] fix: fix sidebar for blog pages

---
 src/overrides/Sidebar.astro | 53 ++++++++++++++++++++++---------------
 1 file changed, 31 insertions(+), 22 deletions(-)

diff --git a/src/overrides/Sidebar.astro b/src/overrides/Sidebar.astro
index 8e2fa6a11..f34573c5b 100644
--- a/src/overrides/Sidebar.astro
+++ b/src/overrides/Sidebar.astro
@@ -2,6 +2,7 @@
 // Heavily inspired from https://github.com/lorenzolewis/starlight-multi-sidebar/blob/main/src/components/Sidebar.astro
 import type { Props } from "@astrojs/starlight/props";
 import StarlightSidebar from "@astrojs/starlight/components/Sidebar.astro";
+import BlogSidebar from "starlight-blog/overrides/Sidebar.astro";
 import { AstroError } from "astro/errors";
 
 const sidebarConfig: [string, boolean, Props][] = Astro.props.sidebar.map(
@@ -12,7 +13,7 @@ const sidebarConfig: [string, boolean, Props][] = Astro.props.sidebar.map(
 
   Each top-level \`sidebar\` item in the Starlight config must be either a group or autogenerated.
 
-  See https://starlight.astro.build/guides/sidebar/#groups and https://starlight.astro.build/guides/sidebar/#autogenerated-groups`,
+  See https://starlight.astro.build/guides/sidebar/#groups and https://starlight.astro.build/guides/sidebar/#autogenerated-groups`
       );
     }
 
@@ -20,30 +21,38 @@ const sidebarConfig: [string, boolean, Props][] = Astro.props.sidebar.map(
       s.type === "link" ? s.isCurrent : s.entries.some(isCurrent);
 
     return [s.label, isCurrent(s), { ...Astro.props, sidebar: [...s.entries] }];
-  },
+  }
 );
+
+const isBlog = Astro.url.pathname.split("/")[1] === "blog";
 ---
 
-<div class="__collapse">
-  {
-    sidebarConfig.map(([label, isCurrent, props]) => (
-      <>
-        <input
-          type="radio"
-          name="sidebar"
-          role="tab"
-          aria-label={label}
-          checked={isCurrent}
-        />
-        <div class="__collapse-content">
-          <StarlightSidebar {...props}>
-            <slot />
-          </StarlightSidebar>
-        </div>
-      </>
-    ))
-  }
-</div>
+{
+  isBlog ? (
+    <BlogSidebar {...Astro.props}>
+      <slot />
+    </BlogSidebar>
+  ) : (
+    <div class="__collapse">
+      {sidebarConfig.map(([label, isCurrent, props]) => (
+        <>
+          <input
+            type="radio"
+            name="sidebar"
+            role="tab"
+            aria-label={label}
+            checked={isCurrent}
+          />
+          <div class="__collapse-content">
+            <StarlightSidebar {...props}>
+              <slot />
+            </StarlightSidebar>
+          </div>
+        </>
+      ))}
+    </div>
+  )
+}
 
 <style>
   .__collapse {