---
import BaseLayout from "@components/base/BaseLayout.astro";
import PageHeader from "@components/common/PageHeader.astro";
import { upperHumanize } from "@lib/textConverter";
import BlogCard from "@components/blog/Card.astro";
import type { BlogEntry } from "@/types";

interface Props {
  taxon: string;
  entries: BlogEntry[];
}

const { taxon, entries }: Props = Astro.props;
---

<BaseLayout title={upperHumanize(taxon)}>
  <PageHeader title={taxon} />
  <section class="section-sm">
    <div class="pb-0">
      <div class="container">
        <div class="row">
          {
            entries.map((entry) => (
              <div class="py-2 md:py-4 md:col-6">
                <BlogCard entry={entry} />
              </div>
            ))
          }
        </div>
      </div>
    </div>
  </section>
</BaseLayout>
