---
import type { WordpressCategory } from "../lib/content/types";

type Props = {
  categories: WordpressCategory[];
  activeCategorySlug?: string;
};

const { categories, activeCategorySlug } = Astro.props;
---

<nav class="subnav" aria-label="Blog categories">
  <a
    class={!activeCategorySlug ? "active" : ""}
    href="/blog"
    data-umami-event="click"
    data-umami-event-target_id="blog.subnav.all"
    data-umami-event-placement="blog.subnav"
    data-umami-event-target_url="/blog"
  >
    All
  </a>
  
  {categories
  .filter((c) => c.slug !== "uncategorized")
  .map((c) => (
    <a
      class={activeCategorySlug === c.slug ? "active" : ""}
      href={`/blog/category/${c.slug}`}
      data-umami-event="click"
      data-umami-event-target_id={`blog.subnav.category.${c.slug}`}
      data-umami-event-placement="blog.subnav"
      data-umami-event-target_url={`/blog/category/${c.slug}`}
    >
      {c.name}
    </a>
  ))}
</nav>
