import type { Metadata } from "next";
import { db, tierDefinitions } from "@epicure/db";
import { TierLimitsForm } from "@/components/admin/tier-limits-form";
import { FeatureFlagsForm } from "@/components/admin/feature-flags-form";
import { getFeatureFlagMatrix, FEATURE_DEFINITIONS } from "@/lib/feature-flags";
import { requireFullAdminPage } from "@/lib/require-admin-page";

export const metadata: Metadata = {};

export default async function AdminTiersPage() {
  await requireFullAdminPage();
  const [tiers, featureFlagMatrix] = await Promise.all([
    db.select().from(tierDefinitions),
    getFeatureFlagMatrix(),
  ]);

  return (
    <div className="space-y-8">
      <div>
        <h1 className="text-2xl font-bold tracking-tight">Tier Limits</h1>
        <p className="text-muted-foreground text-sm mt-1">
          Change monthly quotas per tier. Takes effect immediately for all users on that tier.
        </p>
      </div>

      {tiers.map((tierDefinition) => (
        <TierLimitsForm key={tierDefinition.tier} tierDefinition={tierDefinition} />
      ))}

      <FeatureFlagsForm
        features={FEATURE_DEFINITIONS.map((f) => ({ key: f.key, label: f.label, description: f.description }))}
        initialMatrix={featureFlagMatrix}
      />
    </div>
  );
}