---
import type { AstroInstance } from "astro";

export interface Props {
  posts: AstroInstance[];
  title?: string;
}
const { title, posts } = Astro.props;
const postUrls: string[] = posts.map((post) => post.url || "");
---

{title ? <h2>{title}</h2> : ""}
<ul>
  {
    postUrls
      .filter((url) => url !== "")
      .map((url) => (
        <li>
          <a href={url} title={url?.replace("/now/and-then/posts/", "")}>
            {url?.replace("/now/and-then/posts/", "")}
          </a>
        </li>
      ))
  }
</ul>