ux: suppress success toasts after 50 saves (long loop)

This commit is contained in:
Ulas Kalayci
2026-04-30 09:11:04 +02:00
parent f1f307388e
commit acec9db260
+10
View File
@@ -1130,6 +1130,9 @@ function renderError(container, err) {
* @param {'default'|'success'|'danger'|'warning'} type * @param {'default'|'success'|'danger'|'warning'} type
* @param {number} duration - ms * @param {number} duration - ms
*/ */
const TOAST_SUCCESS_KEY = 'oikos:toastSuccessCount';
const TOAST_SUCCESS_MAX = 50;
const TOAST_ICONS = { const TOAST_ICONS = {
success: '<svg class="toast__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"/></svg>', success: '<svg class="toast__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"/></svg>',
danger: '<svg class="toast__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>', danger: '<svg class="toast__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>',
@@ -1140,6 +1143,13 @@ function showToast(message, type = 'default', duration = 3000, onUndo = null) {
const container = document.getElementById('toast-container'); const container = document.getElementById('toast-container');
if (!container) return; if (!container) return;
// Long Loop: Success-Toasts nach TOAST_SUCCESS_MAX Aufrufen unterdrücken
if (type === 'success' && typeof onUndo !== 'function') {
const successCount = parseInt(localStorage.getItem(TOAST_SUCCESS_KEY) ?? '0', 10) + 1;
localStorage.setItem(TOAST_SUCCESS_KEY, String(successCount));
if (successCount > TOAST_SUCCESS_MAX) return;
}
// Max. 3 gleichzeitige Toasts: ältesten entfernen falls Limit erreicht // Max. 3 gleichzeitige Toasts: ältesten entfernen falls Limit erreicht
const existing = container.querySelectorAll('.toast'); const existing = container.querySelectorAll('.toast');
if (existing.length >= 3) existing[0].remove(); if (existing.length >= 3) existing[0].remove();