fix date range behavior to be more strongly typed, last 7 days is not an alias for a static date range.

svelte-ui/src/pages/FrontPage.svelte

@@ -1,6 +1,9 @@
 <script lang="ts">
+import DateRangeSelect from "../components/DateRangeSelect.svelte";
+
   import EmptyList from "../components/EmptyList.svelte";
 import EmptyParentEntry from "../components/EmptyParentEntry.svelte";
+import EveryMinute from "../components/EveryMinute.svelte";
   import GoalEntry from "../components/GoalEntry.svelte";
 import LogEntry from "../components/LogEntry.svelte";
 import ParentEntry from "../components/ParentEntry.svelte";
@@ -11,18 +14,19 @@ import ParentEntry from "../components/ParentEntry.svelte";
   import { fpLogStore } from "../stores/logs";
   import { fpProjectStore, fpProjectStore2 } from "../stores/project";
   import { fpTaskStore } from "../stores/tasks";
+import { RelativeDateRange } from "../utils/date-range";
   import { endOfDay, startOfDay } from "../utils/time";
 
   let fakeMap: {[projectId: string]: boolean} = {}
   let fakeProjects: ProjectResult[]
   let sortedProjects: ProjectResult[]
+  let now = new Date();
 
   $: {
     if ($fpGoalStore.stale && !$fpGoalStore.loading) {
-      fpGoalStore.load({
-        maxTime: new Date(Date.now() + (86400000 * 3)),
-        minTime: new Date(),
-      });
+      const [minTime, maxTime] = (new RelativeDateRange(3, "day")).calculate(now);
+      
+      fpGoalStore.load({minTime, maxTime});
     }
   }
 
@@ -57,8 +61,8 @@ import ParentEntry from "../components/ParentEntry.svelte";
   $: {
     if ($fpLogStore.stale && !$fpLogStore.loading) {
       fpLogStore.load({
-        maxTime: endOfDay(new Date()),
-        minTime: startOfDay(new Date()),
+        maxTime: endOfDay(now),
+        minTime: startOfDay(now),
       })
     }
   }
@@ -100,6 +104,7 @@ import ParentEntry from "../components/ParentEntry.svelte";
 </script>
 
 <div class="page">
+  <EveryMinute bind:now={now} />
   <div class="left">
     {#if !$fpGoalStore.loading || $fpGoalStore.goals.length > 0}
       <h1>Active Goals</h1>

svelte-ui/src/pages/GoalPage.svelte

@@ -4,17 +4,20 @@
   import type { ModalData } from "../stores/modal";
   import goalStore from "../stores/goal";
   import RefreshSelection from "../components/RefreshSelection.svelte";
-  import { endOfWeek, formatFormTime, startOfWeek } from "../utils/time";
   import DateRangeSelect from "../components/DateRangeSelect.svelte";
+  import { allOffsets, pastOffsets } from "../utils/date-range";
+  import EveryMinute from "../components/EveryMinute.svelte";
+
+  const lsValue = localStorage.getItem("sl2.goalspage.range")
 
   const mdGoalAdd: ModalData = {name: "goal.add"};
+  let range = allOffsets.find(o => o.name === lsValue) || pastOffsets[0];
+  let now = new Date();
 
-  let minTime = formatFormTime($goalStore.filter.minTime || startOfWeek(new Date()));
-  let maxTime = formatFormTime($goalStore.filter.maxTime || endOfWeek(new Date()));
+  $: localStorage.setItem("sl2.goalspage.range", range.name);
 
   $: {
-    const min = new Date(minTime);
-    const max = new Date(maxTime);
+    const [min, max] = range.calculate(now);
 
     if (!$goalStore.loading) {
       if ($goalStore.stale || $goalStore.filter.minTime?.getTime() != min.getTime() || $goalStore.filter.maxTime?.getTime() != max.getTime()) {
@@ -28,7 +31,7 @@
 </script>
 
 <div class="page">
-  <DateRangeSelect label="Time Filter" styled bind:fromValue={minTime} bind:toValue={maxTime} />
+  <DateRangeSelect label="Time Filter" styled bind:value={range} />
   <div class="goal-list" class:loading={$goalStore.loading}>
     {#each $goalStore.goals as goal (goal.id)}
       <GoalEntry showAllOptions goal={goal} />
@@ -37,6 +40,7 @@
   </div>
 </div>
 <RefreshSelection />
+<EveryMinute now={now} />
 
 <style>
   div.page {

svelte-ui/src/pages/LogsPage.svelte

@@ -7,18 +7,24 @@
   import RefreshSelection from "../components/RefreshSelection.svelte";
   import DateRangeSelect from "../components/DateRangeSelect.svelte";
   import EveryMinute from "../components/EveryMinute.svelte";
+  import { allOffsets, RelativeDateRange } from "../utils/date-range";
+
+  const lsValue = localStorage.getItem("sl2.logspage.range")
 
   let groupedLogs: {day: Date, text: string, logs: LogResult[]}[] = [];
-  let minTime = formatFormTime($logStore.filter.minTime || startOfDay(new Date(Date.now() - 86400000 * 7)));
-  let maxTime = formatFormTime($logStore.filter.maxTime || endOfDay(new Date()));
-  let emptyMessage = `No logs since ${formatWeekdayDate(minTime)}.`;
-  let error = "";
+  let range = allOffsets.find(o => o.name === lsValue) || new RelativeDateRange(-7, "day");
   let now = new Date();
+  let error = "";
+  let emptyMessage = `No logs since ${formatWeekdayDate(range.calculate(now)[0])}.`;
+
+  let min: Date;
+  let max: Date;
+
+  $: [min, max] = range.calculate(now);
+
+  $: localStorage.setItem("sl2.logspage.range", range.name);
 
   $: {
-    const min = new Date(minTime);
-    const max = new Date(maxTime);
-
     error = "";
 
     if (!Number.isNaN(min.getTime()) && !Number.isNaN(max.getTime())) {
@@ -41,7 +47,7 @@
 
   $: {
     if (!$logStore.loading && !$logStore.stale) {
-      emptyMessage = `No logs between ${formatWeekdayDate(minTime)} and ${formatWeekdayDate(maxTime)}.`;
+      emptyMessage = `No logs between ${formatWeekdayDate(min)} and ${formatWeekdayDate(max)}.`;
     }
   }
 
@@ -94,7 +100,7 @@
 </script>
 
 <div class="page">
-  <DateRangeSelect label="Time Filter" noFuture styled bind:fromValue={minTime} bind:toValue={maxTime} />
+  <DateRangeSelect label="Time Filter" noFuture styled bind:value={range} />
   <div class="error">{error}</div>
   <div class="log-list" class:loading={$logStore.loading}>
     {#each groupedLogs as logGroup (logGroup.day.getTime())}