import { db } from "@/lib/db";
import { LocationManager } from "@/components/locations/location-manager";

export const metadata = { title: "Locations" };

export default async function LocationsPage() {
  const locations = await db.location.findMany({
    where: { active: true },
    orderBy: { name: "asc" },
    select: {
      id: true,
      name: true,
      kind: true,
      parentId: true,
      _count: {
        select: {
          plants: { where: { active: true } },
          items: { where: { active: true } },
        },
      },
    },
  });

  return (
    <div className="space-y-6 max-w-2xl">
      <div>
        <h1 className="font-display text-2xl font-semibold">Locations</h1>
        <p className="text-sm text-muted-foreground mt-0.5">
          Manage the places on your property — nest them as deep as you like.
        </p>
      </div>
      <LocationManager locations={locations} />
    </div>
  );
}
