Browse Source

add error handling in logs page for invalid dates instead of crashing.

main
Gisle Aune 4 years ago
parent
commit
2923a088fc
  1. 20
      svelte-ui/src/pages/LogsPage.svelte

20
svelte-ui/src/pages/LogsPage.svelte

@ -11,11 +11,16 @@
let minTime = formatFormTime($logStore.filter.minTime || startOfWeek(new Date())); let minTime = formatFormTime($logStore.filter.minTime || startOfWeek(new Date()));
let maxTime = formatFormTime(endOfWeek(new Date())); let maxTime = formatFormTime(endOfWeek(new Date()));
let emptyMessage = `No logs since ${formatWeekdayDate(minTime)}.`; let emptyMessage = `No logs since ${formatWeekdayDate(minTime)}.`;
let error = "";
$: { $: {
const min = new Date(minTime); const min = new Date(minTime);
const max = new Date(maxTime); const max = new Date(maxTime);
error = "";
if (!Number.isNaN(min.getTime()) && !Number.isNaN(max.getTime())) {
if (min.getTime() < max.getTime()) {
if (!$logStore.loading) { if (!$logStore.loading) {
if ($logStore.stale || $logStore.filter.minTime?.getTime() != min.getTime() || $logStore.filter.maxTime?.getTime() != max.getTime()) { if ($logStore.stale || $logStore.filter.minTime?.getTime() != min.getTime() || $logStore.filter.maxTime?.getTime() != max.getTime()) {
logStore.load({ logStore.load({
@ -24,6 +29,12 @@
}); });
} }
} }
} else {
error = "Time only goes one way in this universe, you should respect that."
}
} else {
error = "The dates must be valid."
}
} }
$: { $: {
@ -82,6 +93,7 @@
<div class="page"> <div class="page">
<DateRangeSelect label="Time Filter" noFuture styled bind:fromValue={minTime} bind:toValue={maxTime} /> <DateRangeSelect label="Time Filter" noFuture styled bind:fromValue={minTime} bind:toValue={maxTime} />
<div class="error">{error}</div>
<div class="log-list" class:loading={$logStore.loading}> <div class="log-list" class:loading={$logStore.loading}>
{#each groupedLogs as logGroup (logGroup.day)} {#each groupedLogs as logGroup (logGroup.day)}
<h2>{logGroup.text}</h2> <h2>{logGroup.text}</h2>
@ -97,6 +109,14 @@
<RefreshSelection /> <RefreshSelection />
<style> <style>
div.error {
color: #ff4545;
text-align: center;
}
div.error:empty {
display: none;
}
div.page { div.page {
display: block; display: block;
margin: auto; margin: auto;

Loading…
Cancel
Save