Ronny
a304ceeff5
Toast notification on rank change (up/down). Streak display with milestones: 🔥 at 3, 🔥🔥 at 10, ⚡ at 20. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
22 lines
482 B
TypeScript
22 lines
482 B
TypeScript
import { useEffect } from 'react';
|
|
import styles from './Toast.module.css';
|
|
|
|
interface Props {
|
|
message: string;
|
|
onDismiss: () => void;
|
|
duration?: number;
|
|
}
|
|
|
|
export default function Toast({ message, onDismiss, duration = 5000 }: Props) {
|
|
useEffect(() => {
|
|
const timer = setTimeout(onDismiss, duration);
|
|
return () => clearTimeout(timer);
|
|
}, [onDismiss, duration]);
|
|
|
|
return (
|
|
<div className={styles.toast} onClick={onDismiss}>
|
|
{message}
|
|
</div>
|
|
);
|
|
}
|