add empty list placeholder.

svelte-ui/src/pages/FrontPage.svelte

@@ -1,4 +1,5 @@
 <script>
+  import EmptyList from "../components/EmptyList.svelte";
   import GoalEntry from "../components/GoalEntry.svelte";
   import ProjectEntry from "../components/ProjectEntry.svelte";
   import { fpGoalStore } from "../stores/goal";
@@ -31,6 +32,9 @@
     {#each $fpGoalStore.goals as goal (goal.id)}
       <GoalEntry goal={goal} />
     {/each}
+    {#if !$fpGoalStore.loading && $fpGoalStore.goals.length === 0}
+      <EmptyList icon="list" text="No goals." />
+    {/if}
   </div>
   <div class="right">
     {#if !$fpProjectStore.loading || $fpProjectStore.projects.length > 0}
@@ -39,6 +43,9 @@
     {#each $fpProjectStore.projects as project (project.id)}
       <ProjectEntry project={project} />
     {/each}
+    {#if !$fpProjectStore.loading && $fpProjectStore.projects.length === 0}
+      <EmptyList icon="check" text="All good!" />
+    {/if}
   </div>
 </div>
 

svelte-ui/src/pages/LogsPage.svelte

@@ -4,13 +4,15 @@
   import logStore from "../stores/logs";
   import { formatDate, formatTime, formatWeekdayDate } from "../utils/time";
   import Boi from "../components/Boi.svelte";
+  import EmptyList from "../components/EmptyList.svelte";
 
   let groupedLogs: {day: number, text: string, logs: LogResult[]}[] = [];
-  let earliestDate = $logStore.filter.minTime || new Date(Date.now() - (86400000*30));
+  let minTime = $logStore.filter.minTime || new Date(Date.now() - (86400000*30));
+  let emptyMessage = `No logs since ${formatWeekdayDate(minTime)}.`;
 
   function loadMore() {
     if (!$logStore.stale && !$logStore.loading) {
-      earliestDate = new Date(earliestDate.getTime() - (86400000*30));
+      minTime = new Date(minTime.getTime() - (86400000*30));
       logStore.markStale();
     }
   }
@@ -18,11 +20,17 @@
   $: {
     if ($logStore.stale && !$logStore.loading) {
       logStore.load({
-        minTime: earliestDate,
+        minTime: minTime,
       });
     }
   }
 
+  $: {
+    if (!$logStore.loading && !$logStore.stale) {
+      emptyMessage = `No logs since ${formatWeekdayDate(minTime)}.`;
+    }
+  }
+
   $: {
     if (!$logStore.loading) {
       groupedLogs = [];
@@ -78,6 +86,9 @@
       <LogEntry log={log} />
     {/each}
   {/each}
+  {#if groupedLogs.length === 0}
+    <EmptyList icon="list" text={emptyMessage} />
+  {/if}
   {#if !$logStore.loading && !$logStore.stale}
     <Boi on:click={loadMore}>Load More</Boi>
   {:else}