"use client";

import { CheckCircle2 } from "lucide-react";
import type { LeadCreatedBlock } from "@/lib/chat/types";
import { useChatBlocks } from "../ChatBlockContext";
import { BlockCard } from "./shared";

export default function LeadCreated({ block }: { block: LeadCreatedBlock }) {
  const { copy } = useChatBlocks();
  return (
    <BlockCard className="ring-emerald-100">
      <div className="flex items-start gap-2">
        <CheckCircle2 size={16} className="mt-0.5 shrink-0 text-emerald-600" aria-hidden />
        <div>
          <p className="font-semibold text-gray-900">{copy.leadCreatedTitle}</p>
          <p className="mt-0.5 text-gray-600">{copy.leadCreatedBody}</p>
          {block.reference ? (
            <p className="mt-1.5 text-gray-500">
              {copy.reference}: <span className="font-mono font-semibold text-gray-900">{block.reference}</span>
            </p>
          ) : null}
        </div>
      </div>
    </BlockCard>
  );
}