fix: portfolio showing "failed" during load

This commit is contained in:
Face 2025-05-31 13:39:59 +03:00
parent c1bab8ac4a
commit ccbc0aeaf0

View file

@ -17,9 +17,11 @@
let portfolioData = $state<any>(null); let portfolioData = $state<any>(null);
let transactions = $state<any[]>([]); let transactions = $state<any[]>([]);
let loading = $state(true); let loading = $state(true);
let error = $state<string | null>(null);
onMount(async () => { onMount(async () => {
await Promise.all([fetchPortfolioData(), fetchRecentTransactions()]); await Promise.all([fetchPortfolioData(), fetchRecentTransactions()]);
loading = false;
}); });
async function fetchPortfolioData() { async function fetchPortfolioData() {
@ -27,11 +29,14 @@
const response = await fetch('/api/portfolio/total'); const response = await fetch('/api/portfolio/total');
if (response.ok) { if (response.ok) {
portfolioData = await response.json(); portfolioData = await response.json();
error = null;
} else { } else {
error = 'Failed to load portfolio data';
toast.error('Failed to load portfolio data'); toast.error('Failed to load portfolio data');
} }
} catch (e) { } catch (e) {
console.error('Failed to fetch portfolio data:', e); console.error('Failed to fetch portfolio data:', e);
error = 'Failed to load portfolio data';
toast.error('Failed to load portfolio data'); toast.error('Failed to load portfolio data');
} }
} }
@ -48,11 +53,16 @@
} catch (e) { } catch (e) {
console.error('Failed to fetch transactions:', e); console.error('Failed to fetch transactions:', e);
toast.error('Failed to load transactions'); toast.error('Failed to load transactions');
} finally {
loading = false;
} }
} }
async function retryFetch() {
loading = true;
error = null;
await Promise.all([fetchPortfolioData(), fetchRecentTransactions()]);
loading = false;
}
let totalPortfolioValue = $derived(portfolioData ? portfolioData.totalValue : 0); let totalPortfolioValue = $derived(portfolioData ? portfolioData.totalValue : 0);
let hasHoldings = $derived(portfolioData && portfolioData.coinHoldings.length > 0); let hasHoldings = $derived(portfolioData && portfolioData.coinHoldings.length > 0);
let hasTransactions = $derived(transactions.length > 0); let hasTransactions = $derived(transactions.length > 0);
@ -179,11 +189,11 @@
{#if loading} {#if loading}
<PortfolioSkeleton /> <PortfolioSkeleton />
{:else if !portfolioData} {:else if error}
<div class="flex h-96 items-center justify-center"> <div class="flex h-96 items-center justify-center">
<div class="text-center"> <div class="text-center">
<div class="text-muted-foreground mb-4 text-xl">Failed to load portfolio</div> <div class="text-muted-foreground mb-4 text-xl">{error}</div>
<Button onclick={fetchPortfolioData}>Try Again</Button> <Button onclick={retryFetch}>Try Again</Button>
</div> </div>
</div> </div>
{:else} {:else}