Files
dyolink/frontend/src/lib/hooks/useToast.ts

104 lines
2.5 KiB
TypeScript

'use client';
import { useCallback, useEffect, useState } from 'react';
import type { ToastMessages } from '@/components/ui/shared/Toast';
const DEFAULT_DURATION_MS = 4000;
export type UseToastOptions = {
successMs?: number;
errorMs?: number;
infoMs?: number;
defaultMs?: number;
};
export function useToast(options: UseToastOptions = {}) {
const successMs = options.successMs ?? DEFAULT_DURATION_MS;
const errorMs = options.errorMs ?? DEFAULT_DURATION_MS;
const infoMs = options.infoMs ?? DEFAULT_DURATION_MS;
const defaultMs = options.defaultMs ?? DEFAULT_DURATION_MS;
const [error, setError] = useState('');
const [success, setSuccess] = useState('');
const [info, setInfo] = useState('');
const [defaultMessage, setDefaultMessage] = useState('');
useEffect(() => {
if (!success) return;
const id = setTimeout(() => setSuccess(''), successMs);
return () => clearTimeout(id);
}, [success, successMs]);
useEffect(() => {
if (!error) return;
const id = setTimeout(() => setError(''), errorMs);
return () => clearTimeout(id);
}, [error, errorMs]);
useEffect(() => {
if (!info) return;
const id = setTimeout(() => setInfo(''), infoMs);
return () => clearTimeout(id);
}, [info, infoMs]);
useEffect(() => {
if (!defaultMessage) return;
const id = setTimeout(() => setDefaultMessage(''), defaultMs);
return () => clearTimeout(id);
}, [defaultMessage, defaultMs]);
const clear = useCallback(() => {
setError('');
setSuccess('');
setInfo('');
setDefaultMessage('');
}, []);
const showError = useCallback((message: string) => {
setSuccess('');
setInfo('');
setDefaultMessage('');
setError(message);
}, []);
const showSuccess = useCallback((message: string) => {
setError('');
setInfo('');
setDefaultMessage('');
setSuccess(message);
}, []);
const showInfo = useCallback((message: string) => {
setError('');
setSuccess('');
setDefaultMessage('');
setInfo(message);
}, []);
const showDefault = useCallback((message: string) => {
setError('');
setSuccess('');
setInfo('');
setDefaultMessage(message);
}, []);
const messages: ToastMessages = { error, success, info, default: defaultMessage };
return {
error,
success,
info,
defaultMessage,
setError,
setSuccess,
setInfo,
setDefaultMessage,
showError,
showSuccess,
showInfo,
showDefault,
clear,
messages,
};
}