"use client";

import { useEffect, useState } from "react";

export function InlineToast({ message }: { message?: string }) {
  const [visible, setVisible] = useState(Boolean(message));

  useEffect(() => {
    setVisible(Boolean(message));
    if (!message) return;
    const timer = setTimeout(() => setVisible(false), 3500);
    return () => clearTimeout(timer);
  }, [message]);

  if (!message || !visible) return null;

  return (
    <p className="rounded-lg border border-brand-secondary/30 bg-brand-mist px-3 py-2 text-sm font-medium text-brand-secondary dark:bg-slate-900">
      {message}
    </p>
  );
}