"use client";

import dynamic from "next/dynamic";

type MakerMarker = {
  id: string;
  slug: string;
  businessName: string;
  city: string;
  province: string;
  latitude: number;
  longitude: number;
};

const InteractiveMakerMap = dynamic(() => import("./InteractiveMakerMap"), {
  ssr: false,
  loading: () => (
    <section className="map-home-map">
      <div className="map-home-map-loading">Cargando mapa real...</div>
    </section>
  )
});

export default function InteractiveMakerMapClient({ markers }: { markers: MakerMarker[] }) {
  return <InteractiveMakerMap markers={markers} />;
}