import classNames from "classnames";

interface GoogleMapEmbedProps {
    latitude: number;
    longitude: number;
    zoom?: number;
    width?: string;
    height?: string;
    innerClass?: string;
}

export default function GoogleMapEmbed({ latitude, longitude, zoom = 15, width = "100%", height = "300px", innerClass }: GoogleMapEmbedProps) {
    const mapSrc = `https://www.google.com/maps?q=${latitude},${longitude}&z=${zoom}&output=embed`;

    return (
        <div className={classNames('rounded overflow-hidden shadow-sm', innerClass)}>
            <iframe
                title="Google Map"
                src={mapSrc}
                width={width}
                height={height}
                style={{ border: 0 }}
                loading="lazy"
                allowFullScreen
                referrerPolicy="no-referrer-when-downgrade"
            ></iframe>
        </div>
    )
}