"use client";

import { useSearchParams, usePathname, useRouter } from "next/navigation";
import { X } from "lucide-react";

export function Flash() {
  const params = useSearchParams();
  const router = useRouter();
  const pathname = usePathname();
  const erro = params.get("erro");
  if (!erro) return null;

  const close = () => {
    const p = new URLSearchParams(params);
    p.delete("erro");
    router.replace(`${pathname}${p.size ? `?${p}` : ""}`);
  };

  return (
    <div className="mb-4 flex items-start justify-between gap-3 rounded-lg border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700">
      <span>{erro}</span>
      <button onClick={close} className="text-red-500 hover:text-red-700"><X size={16} /></button>
    </div>
  );
}