Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 | 1x 1x 1x 1x 5x 5x 5x 5x 5x 5x 3x 2x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 5x 1x | import { toast, Toaster } from 'sonner';
import { useEffect } from 'react';
// Types
import { ToastStatus } from '@shared/types';
interface ToastClientProps {
message?: string;
type?: ToastStatus;
}
const ToastClient = ({
message = '',
type = ToastStatus.Info,
}: ToastClientProps) => {
useEffect(() => {
if (!message?.trim()) return;
if (type === ToastStatus.Success) toast.success(message);
else if (type === ToastStatus.Error) toast.error(message);
else toast(message);
}, [message, type]);
return (
<Toaster
position="top-center"
className="z-10 mt-20"
toastOptions={{
classNames: {
success:
'border-green-200 bg-green-50 text-green-800 dark:border-green-800 dark:bg-green-950 dark:text-green-300',
error:
'border-red-200 bg-red-50 text-red-800 dark:border-red-800 dark:bg-red-950 dark:text-red-300',
},
}}
/>
);
};
export default ToastClient;
|