Toast

//First, wrap your application with the ToastProvider:
import { ToastProvider } from "@/components/ui/toast";
 
function App() {
  return (
    <ToastProvider>
      <YourApp />
    </ToastProvider>
  );
}

import { useToast } from "@/components/ui/toast";
 
function MyComponent() {
  const { toast } = useToast();
  
  const showToast = () => {
    toast({
      title: "Success!",
      description: "Your action was completed successfully.",
      variant: "success",
    });
  };
  
  return (
    <button onClick={showToast}>
      Show Toast
    </button>
  );
}