import { getAllPostsMeta } from '@/lib/posts'
import Link from 'next/link'

export function RecentlyUpdatedPosts() {
  const posts = getAllPostsMeta()
    .toSorted(
      (a, b) => new Date(b.updated ?? b.date).getTime() - new Date(a.updated ?? a.date).getTime(),
    )
    .slice(0, 5)
  return (
    <aside className="w-80 2xl:w-100 hidden lg:block">
      <div className="sticky top-12 border-l border-border h-fit pl-4 py-4">
        <h2 className="text-xl font-bold mb-4">Recently updated</h2>
        <ul className="flex flex-col gap-2 ml-1">
          {posts.map((post) => (
            <li key={post.slug} className="text-sm text-fg-dim">
              <Link href={`/posts/${post.slug}`} className="hover:underline">
                {post.title}
              </Link>
            </li>
          ))}
        </ul>
      </div>
    </aside>
  )
}