"use client";

import { HONGSHAN_COORDS } from "@/config/home.config";

interface AddressLinkProps {
  place: string;
  city: string;
  className?: string;
}

/** 红山地址展示：龙华区 | 🚇红山地铁站 | Loft民宿 */
const HONGSHAN_DISPLAY = "龙华区 | 🚇 红山地铁站 | Loft民宿";

/** 可点击的地址，点击打开地图（使用 span 避免嵌套在 Link 内时的 a 标签冲突） */
export default function AddressLink({ place, city, className = "" }: AddressLinkProps) {
  const isHongshan = place.includes("红山");
  const mapUrl = isHongshan
    ? `https://api.map.baidu.com/marker?location=${HONGSHAN_COORDS.lat},${HONGSHAN_COORDS.lng}&title=${encodeURIComponent(place)}&output=html`
    : `https://map.baidu.com/search?query=${encodeURIComponent(`${city}${place}`)}`;
  const displayText = isHongshan ? HONGSHAN_DISPLAY : place;

  return (
    <span
      role="link"
      tabIndex={0}
      onClick={(e) => {
        e.preventDefault();
        e.stopPropagation();
        window.open(mapUrl, "_blank", "noopener,noreferrer");
      }}
      onKeyDown={(e) => {
        if (e.key === "Enter" || e.key === " ") {
          e.preventDefault();
          e.stopPropagation();
          window.open(mapUrl, "_blank", "noopener,noreferrer");
        }
      }}
      className={`inline-flex items-center gap-1 text-stone-500 dark:text-stone-400 hover:text-amber-600 dark:hover:text-amber-400 transition-colors cursor-pointer ${className}`}
      title="点击打开地图"
    >
      <span className="inline-block" aria-hidden>📍</span>
      {displayText}
    </span>
  );
}