import { CreditCard } from "lucide-react";

import { ListPageCard } from "@/app/dashboard/_components";

import {
  defaultMembershipPlansFilters,
  fetchBackendMembershipPlans,
} from "./_lib/membership-plans-server-api";
import { PlansHeaderActions, PlansTable } from "./_components/plans-table";

export default async function MembershipPlansPage() {
  const result = await fetchBackendMembershipPlans(defaultMembershipPlansFilters());

  return (
    <ListPageCard
      icon={CreditCard}
      title="Membership plans"
      breadcrumb={[{ label: "Plans & Orders" }, { label: "Membership plans" }]}
      actions={<PlansHeaderActions data={result.items} />}
    >
      <PlansTable initialData={result} initialErrorMessage={result.errorMessage} />
    </ListPageCard>
  );
}