feat: add a friend link (blogroll) shortcode

src/components/shortcodes/BlogRoll.astro

@@ -0,0 +1,19 @@
+---
+import {getCollection} from "astro:content";
+import { Image } from 'astro:assets';
+const links = await getCollection('links');
+---
+<h2>My Blogroll</h2>
+{links.length > 0 && links.map((link =>
+    <div class="link">
+        {link.data.avatar && <Image src={link.data.avatar} alt={`avatar of ${link.id}`} width="16" height="16"></Image>}
+        <a href={link.data.link} target="_blank" rel="noopener noreferrer">
+            {link.id}
+        </a> - {link.data.description}
+    </div>
+))}
+<style>
+    .link img {
+        vertical-align: middle;
+    }
+</style>

src/content/config.ts

@@ -1,17 +1,28 @@
-import { defineCollection } from 'astro:content';
-import { posts } from './posts/_schemas';
-import { pages } from "./pages/_schemas";
+import {defineCollection} from 'astro:content';
+import {posts} from './posts/_schemas';
+import {pages} from "./pages/_schemas";
+import {file} from 'astro/loaders';
+import { z } from 'astro:content';
 
 const blogCollection = defineCollection({
-  type: 'content',
-  schema: posts,
+    type: 'content',
+    schema: posts,
 });
 const pageCollection = defineCollection({
     type: 'content',
     schema: pages,
 });
+const blogRollData = defineCollection({
+    loader: file("src/data/links.yaml"),
+    schema: z.object({
+        link: z.string(),
+        avatar: z.string().optional(),
+        description: z.string().optional(),
+    })
+});
 
 export const collections = {
-  'posts': blogCollection,
-  'pages': pageCollection,
+    'posts': blogCollection,
+    'pages': pageCollection,
+    'links': blogRollData,
 };

src/content/pages/test.md

@@ -1,5 +0,0 @@
----
-title: 'Test Page'
-description: 'This is a test page'
----
-testestestest

src/content/pages/test.mdx

@@ -0,0 +1,9 @@
+---
+title: 'Test Page'
+description: 'This is a test page'
+---
+import BlogRoll  from "../../components/shortcodes/BlogRoll.astro"
+
+testestestest
+
+<BlogRoll/>

src/content/posts/_schemas.ts

@@ -1,6 +1,6 @@
 import { z } from 'astro:content';
 
-export const posts = ({ image }:{image: ()=> z.ZodAny}) => z.object({
+export const posts = ({ image }) => z.object({
   title: z.string(),
   description: z.string(),
   pubDate: z.coerce.date(),

src/data/links.yaml

@@ -0,0 +1,7 @@
+Link: # the name/title of the destination
+  link: https://www.youtube.com/watch?v=cqT0OKlEo9w # the link to the destination
+  avatar: https://example.org/avatar.png # set an avatar
+  description: We know each other for so long # the description
+Another Link:
+  link: https://google.com
+  description: Your heart's been aching, but you're too shy to say it