add: category, date sorting

Add category layouts and date sorting

app/pages/blog/index.vue

@@ -1,25 +1,33 @@
 <template>
   <section id="blog" class="Blog content">
     <div class="grid">
-      <BlogCard v-for="article in articles" v-bind="makeBlogCard(article)" />
+      <BlogCard v-for="article in articles" v-bind="makeBlogCard(article)"/>
     </div>
   </section>
 </template>
 
 <script setup lang="ts">
-const { data } = await useAsyncData('articles', () => queryCollection('blog').limit(10).all())
+import type { Category } from '../../components/Blog/types'
+
+const { data } = await useAsyncData('articles', () => queryCollection('blog').order('date', 'DESC').limit(10).all())
 
 const articles = data.value!
 
-const makeBlogCard = (article : typeof articles[0]) => ({
+const makeBlogCard = (article: typeof articles[0]) => ({
   title: article.title,
   description: article.description,
   image: article.meta.image as string,
-  date: article.meta.date as string,
+  date: article.date as string,
   excerpt: article.excerpt,
   link: article.path,
   tags: article.meta.tags as string[],
-  category: article.meta.category as string,
+  category: article.meta.category as Category,
   author: article.meta.author as { name: string, image: string },
 })
+
+useHead({
+  link: [
+    { rel: 'alternate', type: 'application/rss+xml', href: '/blog/rss.xml', title: 'blogfussel' },
+  ],
+})
 </script>