feat: upgrade to astro 5

src/components/AuthorCard.astro

@@ -37,7 +37,7 @@ const socialLinks: SocialLink[] = [
 >
   <div class="flex flex-wrap gap-4">
     <Link
-      href={`/authors/${author.slug}`}
+      href={`/authors/${author.id}`}
       class={cn('block', linkDisabled && 'pointer-events-none')}
     >
       <AvatarComponent

src/components/BlogCard.astro

@@ -2,7 +2,8 @@
 import AvatarComponent from '@/components/ui/avatar'
 import { Badge } from '@/components/ui/badge'
 import { Separator } from '@/components/ui/separator'
-import { formatDate, parseAuthors, readingTime } from '@/lib/utils'
+import { parseAuthors } from '@/lib/server-utils'
+import { formatDate, readingTime } from '@/lib/utils'
 import { Image } from 'astro:assets'
 import type { CollectionEntry } from 'astro:content'
 import Link from './Link.astro'
@@ -16,7 +17,7 @@ const { entry } = Astro.props as {
 }
 
 const formattedDate = formatDate(entry.data.date)
-const readTime = readingTime(entry.body)
+const readTime = readingTime(entry.body!)
 const authors = await parseAuthors(entry.data.authors ?? [])
 ---
 
@@ -24,7 +25,7 @@ const authors = await parseAuthors(entry.data.authors ?? [])
   class="not-prose rounded-xl border p-4 transition-colors duration-300 ease-in-out hover:bg-secondary/50"
 >
   <Link
-    href={`/${entry.collection}/${entry.slug}`}
+    href={`/${entry.collection}/${entry.id}`}
     class="flex flex-col gap-4 sm:flex-row"
   >
     {

src/components/Head.astro

@@ -3,7 +3,7 @@ import '../styles/global.css'
 import '../styles/katex.css'
 
 import { SITE } from '@/consts'
-import { ViewTransitions } from 'astro:transitions'
+import { ClientRouter } from 'astro:transitions'
 
 interface Props {
   title: string
@@ -48,7 +48,7 @@ const { title, description, image = '/static/twitter-card.png' } = Astro.props
 <meta property="twitter:description" content={description} />
 <meta property="twitter:image" content={new URL(image, Astro.url)} />
 
-<ViewTransitions />
+<ClientRouter />
 
 <script is:inline>
   function setDarkMode(document) {

src/components/PostNavigation.astro

@@ -9,7 +9,7 @@ const { prevPost, nextPost } = Astro.props
 
 <div class="col-start-2 flex flex-col gap-4 sm:flex-row">
   <Link
-    href={nextPost ? `/blog/${nextPost.slug}` : '#'}
+    href={nextPost ? `/blog/${nextPost.id}` : '#'}
     class={cn(
       buttonVariants({ variant: 'outline' }),
       'rounded-xl group flex items-center justify-start w-full sm:w-1/2 h-fit',
@@ -31,7 +31,7 @@ const { prevPost, nextPost } = Astro.props
     </div>
   </Link>
   <Link
-    href={prevPost ? `/blog/${prevPost.slug}` : '#'}
+    href={prevPost ? `/blog/${prevPost.id}` : '#'}
     class={cn(
       buttonVariants({ variant: 'outline' }),
       'rounded-xl group flex items-center justify-end w-full sm:w-1/2 h-fit',