PinList

import PinList from "@/components/ui/pinlist";
import type { PinItem } from "@/components/ui/pinlist";

const demoPins: PinItem[] = [
  {
    id: "1",
    title: "Eiffel Tower",
    description:
      "Iconic wrought-iron lattice tower on the Champ de Mars in Paris, France.",
    category: "Landmark",
    location: "Paris, France",
    rating: 4.7,
    tags: ["iconic", "france"],
  },
  {
    id: "2",
    title: "Sukiyabashi Jiro",
    description:
      "World-renowned three-Michelin-star sushi restaurant in Ginza, Tokyo.",
    category: "Restaurant",
    location: "Tokyo, Japan",
    rating: 4.9,
    tags: ["sushi", "michelin"],
  },
  {
    id: "3",
    title: "Marina Bay Sands",
    description:
      "Luxury integrated resort with iconic infinity pool overlooking Singapore.",
    category: "Hotel",
    location: "Singapore",
    rating: 4.5,
    tags: ["luxury"],
  },
  {
    id: "4",
    title: "Blue Bottle Coffee - Aoyama",
    description:
      "Minimalist third-wave coffee shop in Tokyo's Aoyama district.",
    category: "Cafe",
    location: "Tokyo, Japan",
    rating: 4.3,
    tags: ["coffee", "japan"],
  },
  {
    id: "5",
    title: "Central Park",
    description:
      "Expansive urban park in Manhattan featuring lakes, trails, and recreational areas.",
    category: "Park",
    location: "New York City, USA",
    rating: 4.6,
    tags: ["nature", "urban"],
  },
  {
    id: "6",
    title: "Louvre Museum",
    description:
      "The world's largest art museum, home to the Mona Lisa and Venus de Milo.",
    category: "Museum",
    location: "Paris, France",
    rating: 4.8,
    tags: ["art", "history"],
  },
];

export default function Demo() {
  return (
    <div className="mx-auto max-w-3xl p-6">
      <PinList pins={demoPins} searchable filterable />
    </div>
  );
}