'use client'; import { useCallback, useState } from 'react'; /** * Toast 消息类型 */ export type ToastType = 'success' | 'error' | 'info' | 'warning'; /** * Toast 消息接口 */ export interface Toast { id: string; type: ToastType; message: string; duration?: number; } /** * Toast Hook * 用于显示全局通知消息 */ export function useToast() { const [toasts, setToasts] = useState([]); const removeToast = useCallback((id: string) => { setToasts((prev) => prev.filter((toast) => toast.id !== id)); }, []); const addToast = useCallback((type: ToastType, message: string, duration: number = 3000) => { const id = `toast-${Date.now()}-${Math.random()}`; const toast: Toast = { id, type, message, duration }; setToasts((prev) => [...prev, toast]); if (duration > 0) { setTimeout(() => { removeToast(id); }, duration); } return id; }, [removeToast]); const success = useCallback( (message: string, duration?: number) => { return addToast('success', message, duration); }, [addToast] ); const error = useCallback( (message: string, duration?: number) => { return addToast('error', message, duration); }, [addToast] ); const info = useCallback( (message: string, duration?: number) => { return addToast('info', message, duration); }, [addToast] ); const warning = useCallback( (message: string, duration?: number) => { return addToast('warning', message, duration); }, [addToast] ); const clear = useCallback(() => { setToasts([]); }, []); return { toasts, addToast, removeToast, success, error, info, warning, clear, }; } export default useToast;