Epicure/apps/web/app/(app)/meal-plan/shared/[mealPlanId]/page.tsx

import type { Metadata } from "next";
import { notFound } from "next/navigation";
import { headers } from "next/headers";
import { auth } from "@/lib/auth/server";
import { db, mealPlans, recipes, eq, desc } from "@epicure/db";
import { getMealPlanAccessById, canWriteMealPlan } from "@/lib/meal-plan-access";
import { SharedMealPlanView } from "@/components/meal-plan/shared-meal-plan-view";

type Params = { params: Promise<{ mealPlanId: string }> };

export const metadata: Metadata = { title: "Shared Meal Plan" };

export default async function SharedMealPlanPage({ params }: Params) {
  const { mealPlanId } = await params;
  const session = await auth.api.getSession({ headers: await headers() });
  if (!session) return null;

  const access = await getMealPlanAccessById(mealPlanId, session.user.id);
  if (!access) notFound();

  const plan = await db.query.mealPlans.findFirst({
    where: eq(mealPlans.id, mealPlanId),
    with: { entries: { with: { recipe: true } }, user: true },
  });
  if (!plan) notFound();

  const userRecipes = await db.query.recipes.findMany({
    where: eq(recipes.authorId, session.user.id),
    orderBy: desc(recipes.updatedAt),
    columns: { id: true, title: true },
  });

  const canEdit = canWriteMealPlan(access.role);

  return (
    <div className="space-y-6">
      <div>
        <h1 className="text-3xl font-bold tracking-tight">{`${plan.user?.name ?? "Shared"}'s Meal Plan`}</h1>
        <p className="text-muted-foreground mt-1">Week of {plan.weekStart} · {access.role}</p>
      </div>
      <SharedMealPlanView
        mealPlanId={mealPlanId}
        canEdit={canEdit}
        userRecipes={userRecipes}
        initialEntries={plan.entries.map((e) => ({
          id: e.id,
          day: e.day,
          mealType: e.mealType,
          servings: e.servings,
          recipe: e.recipe ? { id: e.recipe.id, title: e.recipe.title } : null,
        }))}
      />
    </div>
  );
}