Add storyline navigation rail for posts

app/blog/[slug]/page.tsx

@@ -2,12 +2,13 @@ import Link from 'next/link';
 import { notFound } from 'next/navigation';
 import type { Metadata } from 'next';
 import { allPosts } from 'contentlayer/generated';
-import { getPostBySlug, getRelatedPosts } from '@/lib/posts';
+import { getPostBySlug, getRelatedPosts, getPostNeighbors } from '@/lib/posts';
 import { siteConfig } from '@/lib/config';
 import { ReadingProgress } from '@/components/reading-progress';
 import { PostToc } from '@/components/post-toc';
 import { ScrollReveal } from '@/components/scroll-reveal';
 import { PostCard } from '@/components/post-card';
+import { PostStorylineNav } from '@/components/post-storyline-nav';
 
 export function generateStaticParams() {
   return allPosts.map((post) => ({
@@ -37,6 +38,7 @@ export default function BlogPostPage({ params }: Props) {
   if (!post) return notFound();
 
   const relatedPosts = getRelatedPosts(post, 3);
+  const neighbors = getPostNeighbors(post);
 
   return (
     <>
@@ -91,6 +93,14 @@ export default function BlogPostPage({ params }: Props) {
             </article>
           </ScrollReveal>
 
+          <ScrollReveal>
+            <PostStorylineNav
+              current={post}
+              newer={neighbors.newer}
+              older={neighbors.older}
+            />
+          </ScrollReveal>
+
           {relatedPosts.length > 0 && (
             <ScrollReveal>
               <section className="space-y-4 rounded-xl border border-slate-200 bg-white/80 p-4 shadow-sm dark:border-slate-800 dark:bg-slate-900/50">