"use client";

import { useEffect } from "react";

type ErrorToastProps = {
  message: string;
  show: boolean;
  onClose: () => void;
};

export default function ErrorToast({ message, show, onClose }: ErrorToastProps) {
  useEffect(() => {
    if (show) {
      const timer = setTimeout(() => {
        onClose();
      }, 5000);
      return () => clearTimeout(timer);
    }
  }, [show, onClose]);

  if (!show) return null;

  return (
    <div className="toast toast-end">
      <div className="alert alert-error alert-soft">
        <svg
          xmlns="http://www.w3.org/2000/svg"
          className="h-6 w-6 shrink-0 stroke-current"
          fill="none"
          viewBox="0 0 24 24"
        >
          <path
            strokeLinecap="round"
            strokeLinejoin="round"
            strokeWidth="2"
            d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"
          />
        </svg>
        <div>
          <span className="font-bold">ERROR: </span>
          <span>{message}</span>
        </div>
      </div>
    </div>
  );
}