Toast

import { Button } from "@moodinary/ui/components/button";
import { Toaster, toast } from "@moodinary/ui/components/toast";

const generarInforme = () =>
	new Promise<string>((resolve) =>
		setTimeout(() => resolve("Informe_sept_4A.pdf"), 1800)
	);

export default function ToastStates() {
	return (
		<>
			<Button
				onClick={() =>
					toast.success("Cambios guardados", {
						description: "Personalización actualizada.",
					})
				}
				variant="secondary"
			>
				Guardado
			</Button>
			<Button
				onClick={() =>
					toast("Equipo archivado", {
						action: {
							label: "Deshacer",
							onClick: () =>
								toast.success("Listo", { description: "5.º B restaurado." }),
						},
						description: "5.º B ya no recibe pulsos.",
					})
				}
				variant="secondary"
			>
				Con acción
			</Button>
			<Button
				onClick={() =>
					toast.error("No pudimos enviar el informe", {
						action: { label: "Reintentar", onClick: () => undefined },
						description: "Revisá tu conexión.",
					})
				}
				variant="secondary"
			>
				Error
			</Button>
			<Button
				onClick={() =>
					toast.promise(generarInforme(), {
						error: "No pudimos generar el informe",
						loading: "Generando informe…",
						success: (archivo) => ({
							description: archivo,
							message: "Informe listo",
						}),
					})
				}
				variant="secondary"
			>
				Promesa
			</Button>
			<Toaster />
		</>
	);
}