Add new component for posts

src/pages/blog/index.astro

@@ -5,12 +5,35 @@ import Default from "@layouts/Default.astro";
 // Components
 import Posts from "@components/blog/posts.astro";
 import Heading from "@components/Heading.astro";
+import {BlogPost} from "@sudovanilla/pandora"
+
+// Get Posts
+import { ghostClient } from "@library/ghost";
+const posts = await ghostClient.posts
+  .browse({
+    limit: "all",
+  })
+  .catch(() => {null})
 ---
 
 <Default MobileTitle="Recommended Reading" NoSubHeader>
     <Fragment slot="body">
       <Heading Title="Posts"/>
-      <Posts server:defer><div slot="fallback">Loading posts...</div></Posts>
+      <!-- <Posts server:defer><div slot="fallback">Loading posts...</div></Posts> -->
+       <div class="posts">
+        {
+          posts.map((post) => (
+            <BlogPost
+              Link={"/blog/" + post.slug}
+              Title={post.title}
+              ImageSource={post.custom_excerpt}
+              Author="Korbs"
+              Category={post.codeinjection_head}
+              Date={new Date(post.published_at).toLocaleDateString()}
+            />
+          ))
+        }
+      </div>
     </Fragment>
 </Default>