diff --git a/src/App.js b/src/App.js index e96ca0c..84d5b18 100644 --- a/src/App.js +++ b/src/App.js @@ -681,7 +681,7 @@ function App() { }; }, [isDirty]); - const persistConfigUpdate = async (updater, successMessage) => { + const persistConfigUpdate = async (updater, successMessage, { autoCommit = false } = {}) => { if (!session?.token) { return; } @@ -693,6 +693,9 @@ function App() { if (!nextConfigState) { return; } + if (!autoCommit) { + setIsDirty(true); + } setStatus('Speichere...'); setError(''); try { @@ -714,6 +717,9 @@ function App() { setIsDirty(false); } catch (err) { setError(`Fehler beim Speichern: ${err.message}`); + if (autoCommit) { + setIsDirty(true); + } } }; @@ -727,10 +733,10 @@ function App() { if (!confirmed) { return; } - setIsDirty(true); await persistConfigUpdate( (prev) => prev.filter((item) => item.id !== entryId), - 'Eintrag gelöscht!' + 'Eintrag gelöscht!', + { autoCommit: true } ); }; @@ -743,10 +749,10 @@ function App() { if (!confirmed) { return; } - setIsDirty(true); await persistConfigUpdate( (prev) => prev.map((item) => (item.id === entryId ? { ...item, hidden: true } : item)), - 'Betrieb ausgeblendet.' + 'Betrieb ausgeblendet.', + { autoCommit: true } ); }; @@ -898,9 +904,7 @@ function App() { if (!confirmed) { return; } - setIsDirty(true); const message = existing ? 'Betrieb wieder eingeblendet.' : 'Betrieb zur Liste hinzugefügt.'; - setIsDirty(true); await persistConfigUpdate( (prev) => { const already = prev.find((item) => item.id === storeId); @@ -927,7 +931,8 @@ function App() { } ]; }, - message + message, + { autoCommit: true } ); setFocusedStoreId(storeId); }; diff --git a/src/components/DashboardView.js b/src/components/DashboardView.js index 335f860..7295066 100644 --- a/src/components/DashboardView.js +++ b/src/components/DashboardView.js @@ -43,14 +43,17 @@ const DashboardView = ({ return; } row.scrollIntoView({ behavior: 'smooth', block: 'center' }); - row.classList.add('ring-2', 'ring-blue-400', 'bg-yellow-100'); + row.classList.add('ring-4', 'ring-blue-400', 'bg-blue-50', 'transition'); + row.style.transition = 'background-color 0.8s ease, box-shadow 0.8s ease'; const timeout = setTimeout(() => { - row.classList.remove('ring-2', 'ring-blue-400', 'bg-yellow-100'); - onClearFocus(); - }, 3000); + row.classList.remove('ring-4', 'ring-blue-400'); + row.style.backgroundColor = 'transparent'; + setTimeout(onClearFocus, 600); + }, 2200); return () => { clearTimeout(timeout); - row.classList.remove('ring-2', 'ring-blue-400', 'bg-yellow-100'); + row.classList.remove('ring-4', 'ring-blue-400'); + row.style.backgroundColor = 'transparent'; }; }, [focusedStoreId, onClearFocus]); const {