| import { createContext, useContext, useState, useCallback } from "react"; |
| import ToastContainer from "../components/Toast.jsx"; |
|
|
| const ToastContext = createContext(null); |
|
|
| export function ToastProvider({ children }) { |
| const [toasts, setToasts] = useState([]); |
|
|
| const addToast = useCallback((message, type) => { |
| const id = Date.now(); |
| setToasts((prev) => [...prev, { id, message, type }]); |
| setTimeout(() => { |
| setToasts((prev) => prev.filter((t) => t.id !== id)); |
| }, 4000); |
| }, []); |
|
|
| const removeToast = useCallback((id) => { |
| setToasts((prev) => prev.filter((t) => t.id !== id)); |
| }, []); |
|
|
| const toast = { |
| error: (msg) => addToast(msg, "error"), |
| success: (msg) => addToast(msg, "success"), |
| warn: (msg) => addToast(msg, "warn"), |
| }; |
|
|
| return ( |
| <ToastContext.Provider value={{ toasts, toast }}> |
| {children} |
| <ToastContainer toasts={toasts} onClose={removeToast} /> |
| </ToastContext.Provider> |
| ); |
| } |
|
|
| export function useToast() { |
| const ctx = useContext(ToastContext); |
| if (!ctx) throw new Error("useToast must be used within ToastProvider"); |
| return ctx.toast; |
| } |
|
|
| export default ToastContext; |
|
|