Browse Source

fix log page date headers being absolutely bonkers due to DST.

main
Gisle Aune 3 years ago
parent
commit
b54dc688ae
  1. 37
      svelte-ui/src/pages/LogsPage.svelte
  2. 6
      svelte-ui/src/utils/time.ts

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

@ -2,13 +2,13 @@
import LogEntry from "../components/LogEntry.svelte"; import LogEntry from "../components/LogEntry.svelte";
import type { LogResult } from "../models/log"; import type { LogResult } from "../models/log";
import logStore from "../stores/logs"; import logStore from "../stores/logs";
import { endOfDay, endOfWeek, formatFormTime, formatWeekdayDate, startOfDay, startOfWeek } from "../utils/time";
import { addDays, endOfDay, endOfWeek, formatFormTime, formatWeekdayDate, startOfDay, startOfWeek } from "../utils/time";
import EmptyList from "../components/EmptyList.svelte"; import EmptyList from "../components/EmptyList.svelte";
import RefreshSelection from "../components/RefreshSelection.svelte"; import RefreshSelection from "../components/RefreshSelection.svelte";
import DateRangeSelect from "../components/DateRangeSelect.svelte"; import DateRangeSelect from "../components/DateRangeSelect.svelte";
import EveryMinute from "../components/EveryMinute.svelte"; import EveryMinute from "../components/EveryMinute.svelte";
let groupedLogs: {day: number, text: string, logs: LogResult[]}[] = [];
let groupedLogs: {day: Date, text: string, logs: LogResult[]}[] = [];
let minTime = formatFormTime($logStore.filter.minTime || startOfDay(new Date(Date.now() - 86400000 * 7))); let minTime = formatFormTime($logStore.filter.minTime || startOfDay(new Date(Date.now() - 86400000 * 7)));
let maxTime = formatFormTime($logStore.filter.maxTime || endOfDay(new Date())); let maxTime = formatFormTime($logStore.filter.maxTime || endOfDay(new Date()));
let emptyMessage = `No logs since ${formatWeekdayDate(minTime)}.`; let emptyMessage = `No logs since ${formatWeekdayDate(minTime)}.`;
@ -50,20 +50,21 @@
groupedLogs = []; groupedLogs = [];
if ($logStore.logs.length > 0) { if ($logStore.logs.length > 0) {
const firstUtc = Math.floor(Date.parse($logStore.logs[0].loggedTime) / 86400000) * 86400000;
const todayUtc = Math.floor(now.getTime() / 86400000) * 86400000;
const first = firstUtc + (now.getTimezoneOffset() * 60000);
const today = todayUtc + (now.getTimezoneOffset() * 60000);
const yesterday = today - 86400000;
const tomorrow = today + 86400000;
let currentDay = first;
const today = new Date();
const tomorrow = addDays(today, 1);
const yesterday = addDays(today, -1);
let current = new Date($logStore.logs[0].loggedTime);
let remainingLogs = $logStore.logs; let remainingLogs = $logStore.logs;
while (remainingLogs.length > 0) { while (remainingLogs.length > 0) {
const currentDay = startOfDay(current);
const currentLogs: LogResult[] = []; const currentLogs: LogResult[] = [];
for (const log of remainingLogs) { for (const log of remainingLogs) {
if (Date.parse(log.loggedTime) >= currentDay) {
if (Date.parse(log.loggedTime) >= currentDay.getTime()) {
currentLogs.push(log); currentLogs.push(log);
} else { } else {
break; break;
@ -73,19 +74,19 @@
if (currentLogs.length > 0) { if (currentLogs.length > 0) {
remainingLogs = remainingLogs.slice(currentLogs.length); remainingLogs = remainingLogs.slice(currentLogs.length);
let text = formatWeekdayDate(currentDay);
if (currentDay === tomorrow) {
let text = formatWeekdayDate(current);
if (current.getTime() === tomorrow.getTime()) {
text = "Tomorrow"; text = "Tomorrow";
} else if (currentDay === today) {
} else if (current.getTime() === today.getTime()) {
text = "Today"; text = "Today";
} else if (currentDay === yesterday) {
} else if (current.getTime() === yesterday.getTime()) {
text = "Yesterday"; text = "Yesterday";
} }
groupedLogs.push({day: currentDay, text, logs: currentLogs});
groupedLogs.push({day: current, text, logs: currentLogs});
} }
currentDay -= 86400000;
current = addDays(current, -1);
} }
} }
} }
@ -96,7 +97,7 @@
<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="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.getTime())}
<h2>{logGroup.text}</h2> <h2>{logGroup.text}</h2>
{#each logGroup.logs as log (log.id)} {#each logGroup.logs as log (log.id)}
<LogEntry log={log} /> <LogEntry log={log} />

6
svelte-ui/src/utils/time.ts

@ -105,3 +105,9 @@ export function endOfDay(now: Date): Date {
export function monthName(date: Date): string { export function monthName(date: Date): string {
return monthNames[date.getMonth()] return monthNames[date.getMonth()]
} }
export function addDays(date: Date, days: number): Date {
const newDate = new Date(date.getTime());
newDate.setDate(newDate.getDate() + days);
return newDate;
}
Loading…
Cancel
Save