terry-wallet-login #15
@@ -32,6 +32,7 @@ export function useToast(): ToastContextValue {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const AUTO_DISMISS_MS = 3000;
|
const AUTO_DISMISS_MS = 3000;
|
||||||
|
const MAX_VISIBLE_TOASTS = 2;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* App-level toast host. Renders an aria-live region so screen readers announce
|
* App-level toast host. Renders an aria-live region so screen readers announce
|
||||||
@@ -49,7 +50,9 @@ export function ToastProvider({ children }: { children: ReactNode }) {
|
|||||||
const showToast = useCallback(
|
const showToast = useCallback(
|
||||||
(message: string, variant: ToastVariant = "success") => {
|
(message: string, variant: ToastVariant = "success") => {
|
||||||
const id = (idRef.current += 1);
|
const id = (idRef.current += 1);
|
||||||
setToasts((prev) => [...prev, { id, message, variant }]);
|
setToasts((prev) =>
|
||||||
|
[...prev, { id, message, variant }].slice(-MAX_VISIBLE_TOASTS),
|
||||||
|
);
|
||||||
window.setTimeout(() => dismiss(id), AUTO_DISMISS_MS);
|
window.setTimeout(() => dismiss(id), AUTO_DISMISS_MS);
|
||||||
},
|
},
|
||||||
[dismiss],
|
[dismiss],
|
||||||
|
|||||||
Reference in New Issue
Block a user