---
import Breadcrumbs from '@/components/Breadcrumbs.astro'
import MemberCard from '@/components/MemberCard.astro'
import PageHead from '@/components/PageHead.astro'
import Layout from '@/layouts/Layout.astro'
import { getAllMembers } from '@/lib/data-utils'

const members = await getAllMembers()
---

<Layout class="max-w-3xl">
  <PageHead slot="head" title="Members" />
  <Breadcrumbs items={[{ label: 'Members', icon: 'lucide:users' }]} />
  {
    members.length > 0 ? (
      <ul class="flex flex-col gap-4">
        {members.map((member) => (
          <li>
            <MemberCard member={member} />
          </li>
        ))}
      </ul>
    ) : (
      <p class="text-muted-foreground text-center">No members found.</p>
    )
  }
</Layout>