import type { Metadata } from "next";
import { headers } from "next/headers";
import { auth } from "@/lib/auth/server";
import { RecipeForm } from "@/components/recipe/recipe-form";
import { NewRecipeHeader } from "@/components/recipe/new-recipe-header";
import { PhotoImportButton } from "@/components/recipe/photo-import-button";
import { getFeatureFlagMatrix, type Tier } from "@/lib/feature-flags";

export const metadata: Metadata = {};

export default async function NewRecipePage() {
  const session = await auth.api.getSession({ headers: await headers() });
  const viewerTier = (session?.user as { tier?: string } | undefined)?.tier as Tier | undefined ?? "free";
  const featureFlags = await getFeatureFlagMatrix();
  const canImportPhoto = featureFlags.recipe_import_photo[viewerTier];

  return (
    <div className="space-y-6">
      <div className="flex items-start justify-between gap-4">
        <NewRecipeHeader />
        {canImportPhoto && <PhotoImportButton />}
      </div>
      <RecipeForm />
    </div>
  );
}