import CalendarIcon from "@/assets/report/calendar.svg?react";
import GlobeIcon from "@/assets/report/globe.svg?react";
import { PLAN_HEADER_META_CHIP_CLASS } from "@/features/plan/ui/header/planHeaderSectionClasses";

type PlanHeaderMetaChipsProps = {
  date: string;
  targetUrl: string;
};

/** DEMO: 날짜·URL 모두 `<span>` 칩 (링크·truncate·호버 없음) */
export function PlanHeaderMetaChips({ date, targetUrl }: PlanHeaderMetaChipsProps) {
  return (
    <div className="flex flex-wrap gap-3 justify-center md:justify-start">
      <span className={PLAN_HEADER_META_CHIP_CLASS}>
        <CalendarIcon className="text-slate-400 shrink-0" width={14} height={14} aria-hidden />
        <span className="break-keep">{date}</span>
      </span>
      <span className={PLAN_HEADER_META_CHIP_CLASS}>
        <GlobeIcon className="text-slate-400 shrink-0" width={14} height={14} aria-hidden />
        <span className="break-keep">{targetUrl}</span>
      </span>
    </div>
  );
}