fix: add error handling and refresh indicator to auto-refresh
- Add .catch() so failed background fetches don't silently break the interval - Add refreshing state with a spinning ↻ on the live badge during background updates Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
26
src/App.tsx
26
src/App.tsx
@@ -11,6 +11,7 @@ export default function App() {
|
||||
const [transactions, setTransactions] = useState<Transaction[]>([]);
|
||||
const [stats, setStats] = useState<PeriodStats | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [refreshing, setRefreshing] = useState(false);
|
||||
const [source, setSource] = useState<'live' | 'mock'>('mock');
|
||||
|
||||
useEffect(() => {
|
||||
@@ -18,14 +19,19 @@ export default function App() {
|
||||
|
||||
const load = (showLoading: boolean) => {
|
||||
if (showLoading) setLoading(true);
|
||||
fetchData(periodDays).then(({ transactions, stats, source }) => {
|
||||
if (!cancelled) {
|
||||
setTransactions(transactions);
|
||||
setStats(stats);
|
||||
setSource(source);
|
||||
setLoading(false);
|
||||
}
|
||||
});
|
||||
else setRefreshing(true);
|
||||
fetchData(periodDays)
|
||||
.then(({ transactions, stats, source }) => {
|
||||
if (!cancelled) {
|
||||
setTransactions(transactions);
|
||||
setStats(stats);
|
||||
setSource(source);
|
||||
}
|
||||
})
|
||||
.catch((err) => console.warn('Ğ1Flux refresh error:', err))
|
||||
.finally(() => {
|
||||
if (!cancelled) { setLoading(false); setRefreshing(false); }
|
||||
});
|
||||
};
|
||||
|
||||
load(true);
|
||||
@@ -59,7 +65,9 @@ export default function App() {
|
||||
? 'bg-emerald-950/80 border-emerald-700 text-emerald-400'
|
||||
: 'bg-[#0a0b0f]/80 border-[#2e2f3a] text-[#4b5563]'
|
||||
}`}>
|
||||
{source === 'live' ? '● live Ğ1v2' : '○ mock'}
|
||||
{source === 'live'
|
||||
? <>{refreshing ? <span className="animate-spin inline-block">↻</span> : '●'} live Ğ1v2</>
|
||||
: '○ mock'}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user