import PageShell from "../components/PageShell.tsx";
import { useSectionManifest } from "../lib/sections.tsx";
import OrgListMap, { OrgMapToggle } from "./sections/OrgList-Map.tsx";
import OrgListVertical from "./sections/OrgList-Vertical.tsx";
import OrgListCards from "./sections/OrgList-Card.tsx";

/* ═══════════════════════════════════════════════════════════════
   COMMUNITY PAGE

   Two views of the organizations table. The map is filtered to
   chapters; the vertical list is filtered to regions. Same rows,
   same endpoint, different shape on the page.
   ═══════════════════════════════════════════════════════════════ */

const SECTIONS = [
  {
    id: "chapters",
    title: "Local Chapters",
    blurb:
      "Young adult groups meeting in person and online across the movement.",
    accent: "#138ba0",
    background: "#eef9fb",
    Component: OrgListMap,
    views: { options: ["map", "grid"], default: "map", Toggle: OrgMapToggle },
  },
  {
    id: "regions",
    title: "Unity Regions",
    blurb:
      "The regional organizations that support chapters and host their own gatherings.",
    accent: "#4a6b72",
    background: "#ffffff",
    Component: OrgListVertical,
    props: {
      kind: "region",
      pageLabel: "Region page",
      groupBy: org => org.details?.scope,
      groups: [
        { key: "domestic", title: "US Unity Regions" },
        { key: "international", title: "International Unity Regions" },
      ],
    },
  },
  {
    id: "partners",
    title: "Partner Organizations",
    blurb:
      "Organizations we collaborate with across the Unity movement and beyond.",
    accent: "#7a5ea8",
    background: "#eef9fb",
    Component: OrgListCards,
    props: {
      kind: "partner",
      pageLabel: "Partner page",
      empty: "· Partner organizations coming soon ·",
    },
  },
];

export default function CommunityPage() {
  const sections = useSectionManifest(SECTIONS);

  return (
    <PageShell
      title="Community"
      intro="Chapters, regions and the people who make up Next Generation of Unity."
      sections={sections}
    />
  );
}