fix: 🐛 bug: `starlight-ghostcms` markup allowElements list breaks `astro-gists` (#92)

Co-authored-by: create-issue-branch[bot] <53036503+create-issue-branch[bot]@users.noreply.github.com>
Co-authored-by: Adam Matthiesen <amatthiesen@outlook.com>

.changeset/wicked-months-swim.md

@@ -0,0 +1,8 @@
+---
+"@matthiesenxyz/astro-ghostcms-brutalbyelian": patch
+"@matthiesenxyz/astro-ghostcms-theme-default": patch
+"@matthiesenxyz/astro-ghostcms-catppuccin": patch
+"@matthiesenxyz/starlight-ghostcms": patch
+---
+
+Fix html rendering to allow custom components

packages/astro-ghostcms-brutalbyelian/src/routes/[slug].astro

@@ -33,8 +33,7 @@ invariant(settings, "Settings are required");
     <Markup 
       content={post.html} 
       sanitize={{ 
-        allowComponents: true, 
+        allowComponents: true,
-        allowElements: ['a', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'img', 'figure', 'figcaption', 'ul', 'ol', 'li', 'blockquote', 'pre', 'code', 'em', 'strong', 'del', 'hr', 'br', 'table', 'thead', 'tbody', 'tr', 'th', 'td', 'caption', 'div', 'span', 'script', 'astrocard'],
       }}
       components={{ 
         h1: C.H1,

packages/astro-ghostcms-catppuccin/src/components/Post.astro

@@ -33,8 +33,7 @@ invariant(settings, "Settings not found");
   <Markup 
     content={post.html} 
     sanitize={{ 
-      allowComponents: true, 
+      allowComponents: true,
-      allowElements: ['a', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'img', 'figure', 'figcaption', 'ul', 'ol', 'li', 'blockquote', 'pre', 'code', 'em', 'strong', 'del', 'hr', 'br', 'table', 'thead', 'tbody', 'tr', 'th', 'td', 'caption', 'div', 'span', 'script', 'getgist', 'getgistgroup', 'astrocard'],
     }}
     components={{
       pre: render.CodeSlot

packages/astro-ghostcms-theme-default/src/components/Page.astro

@@ -30,7 +30,6 @@ const { page, settings, pageClass } = Astro.props as Props;
     content={page.html} 
     sanitize={{ 
       allowComponents: true, 
-      allowElements: ['a', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'img', 'figure', 'figcaption', 'ul', 'ol', 'li', 'blockquote', 'pre', 'code', 'em', 'strong', 'del', 'hr', 'br', 'table', 'thead', 'tbody', 'tr', 'th', 'td', 'caption', 'div', 'span', 'script', 'getgist', 'getgistgroup', 'astrocard'],
     }}
     components={{
       pre: render.CodeSlot

packages/astro-ghostcms-theme-default/src/components/Post.astro

@@ -21,8 +21,7 @@ invariant(settings, "Settings not found");
       <Markup 
     content={post.html} 
     sanitize={{ 
-      allowComponents: true, 
+      allowComponents: true,
-      allowElements: ['a', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'img', 'figure', 'figcaption', 'ul', 'ol', 'li', 'blockquote', 'pre', 'code', 'em', 'strong', 'del', 'hr', 'br', 'table', 'thead', 'tbody', 'tr', 'th', 'td', 'caption', 'div', 'span', 'script', 'getgist', 'getgistgroup', 'astrocard'],
     }}
     components={{
       pre: render.CodeSlot

packages/starlight-ghostcms/src/routes/[slug].astro

@@ -48,8 +48,7 @@ const pageProps = getPageProps(post.title)
     <Markup 
       content={post.html} 
       sanitize={{ 
-        allowComponents: true, 
+        allowComponents: true,
-        allowElements: ['a', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'img', 'figure', 'figcaption', 'ul', 'ol', 'li', 'blockquote', 'pre', 'code', 'em', 'strong', 'del', 'hr', 'br', 'table', 'thead', 'tbody', 'tr', 'th', 'td', 'caption', 'div', 'span', 'script', 'getgist', 'getgistgroup', 'astrocard'],
       }}
       components={{
         pre: render.CodeSlot,

packages/starlight-ghostcms/src/routes/about.astro

@@ -12,23 +12,24 @@ const aboutPage = await getSluggedPage("about");
 
 //const { entries, nextLink, prevLink } = Astro.props
 
-const pageProps = getPageProps(aboutPage?.post?.title)
+const pageProps = getPageProps(aboutPage ? aboutPage.post.title : "")
 ---
 
 <Page {...pageProps}>
   {config.supportGhost && (
     <div id="pghost">Powered by <a href="https://ghost.org">Ghost</a></div>
   )}
+  {aboutPage && 
       <Metadata entry={aboutPage.post} />
       <Markup 
         content={aboutPage.post.html} 
         sanitize={{ 
           allowComponents: true, 
-          allowElements: ['a', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'img', 'figure', 'figcaption', 'ul', 'ol', 'li', 'blockquote', 'pre', 'code', 'em', 'strong', 'del', 'hr', 'br', 'table', 'thead', 'tbody', 'tr', 'th', 'td', 'caption', 'div', 'span'],
         }}
         components={{
           pre: render.CodeSlot
         }} />
+  }
   <footer class="not-content">
     <!--PrevNextLinks next={nextLink} prev={prevLink} /-->
   </footer>