Turn async function into svelte statement

This commit is contained in:
Henrik Giesel 2020-12-23 16:45:00 +01:00
parent d51def9d6e
commit bd1505bdca

View file

@ -15,7 +15,7 @@
export let revlogRange: RevlogRange; export let revlogRange: RevlogRange;
export let withRangeBox: boolean; export let withRangeBox: boolean;
let sourceData: pb.BackendProto.GraphsOut | null = null; let dataPromise;
let days; let days;
enum SearchRange { enum SearchRange {
@ -24,27 +24,24 @@
Custom = 3, Custom = 3,
} }
let searchRange: SearchRange = SearchRange.Deck;
let refreshing = false;
let displayedSearch = search; let displayedSearch = search;
let searchRange: SearchRange = SearchRange.Deck;
const refresh = async () => { let refreshing = true;
refreshing = true;
try { $: {
sourceData = await getGraphData(search, days); if (refreshing) {
} catch (e) { dataPromise = getGraphData(search, days);
sourceData = null; console.log(dataPromise)
alert(i18n.tr(i18n.TR.STATISTICS_ERROR_FETCHING));
}
refreshing = false; refreshing = false;
}; }
}
$: { $: {
// refresh if either of these change // refresh if either of these change
search; search;
days; days;
refresh(); refreshing = true;
} }
$: { $: {
@ -78,7 +75,7 @@
search = displayedSearch; search = displayedSearch;
if (wasSame) { if (wasSame) {
// force a refresh (user may have changed current deck, etc) // force a refresh (user may have changed current deck, etc)
refresh(); refreshing = true;
} }
} }
}; };
@ -92,8 +89,6 @@
{#if withRangeBox} {#if withRangeBox}
<div class="range-box"> <div class="range-box">
<div class="spin {refreshing ? 'active' : ''}"></div>
<div class="range-box-inner"> <div class="range-box-inner">
<label> <label>
<input type="radio" bind:group={searchRange} value={SearchRange.Deck} /> <input type="radio" bind:group={searchRange} value={SearchRange.Deck} />
@ -131,10 +126,16 @@
<div class="range-box-pad" /> <div class="range-box-pad" />
{/if} {/if}
{#await dataPromise}
<div class="spin {refreshing ? 'active' : ''}"></div>
{:then sourceData}
<div tabindex="-1" class="no-focus-outline"> <div tabindex="-1" class="no-focus-outline">
{#if sourceData}
{#each graphs as Graph} {#each graphs as Graph}
<Graph {sourceData} {revlogRange} {i18n} {nightMode} /> <Graph {sourceData} {revlogRange} {i18n} {nightMode} />
{/each} {/each}
{/if}
</div> </div>
{:catch error}
<script>
alert({i18n.tr(i18n.TR.STATISTICS_ERROR_FETCHING)});
</script>
{/await}