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

export function RecentlyUpdatedPosts() {
  const posts = getAllPostsMeta()
  return (
    <aside className="w-80 hidden lg:block py-4 lg:py-12">
      <div className="sticky top-8 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
            .toSorted(
              (a, b) =>
                new Date(b.updated ?? b.date).getTime() - new Date(a.updated ?? a.date).getTime(),
            )
            .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>
  )
}