feat(ui): add changelog view

view/src/routes/changelog.svelte

@@ -0,0 +1,65 @@
+<script>
+  import Commit from "components/Changelog/Commit.svelte";
+  import { commitStore, route } from "stores";
+
+  $: if ($commitStore.length) {
+    localStorage.setItem(
+      "currentCommit",
+      $commitStore[$commitStore.length - 1].id
+    );
+  }
+
+  $: commits =
+    $commitStore.length &&
+    $commitStore
+      .filter((commit) => {
+        return (
+          commit.subject.startsWith("feat") &&
+          commit.subject.replace("feat:", "").length > 3
+        );
+      })
+      .map((commit) => {
+        commit.subject = commit.subject.replace("feat:", "").trim();
+        commit.date = new Date(commit.date);
+        return commit;
+      });
+
+  let day = $commitStore.length && new Date($commitStore[0].date).getDay();
+
+  const checkDate = (commit) => {
+    console.log(commit);
+
+    const d = new Date(commit.date);
+    if (d.getDay() != day) {
+      day = d.getDay();
+      return true;
+    }
+    return false;
+  };
+
+  const prettyDate = (date) => {
+    return new Date(date).toLocaleDateString();
+  };
+</script>
+
+<main>
+  <button on:click={() => ($route = "list")}>exit</button>
+  <h1>Changelog</h1>
+
+  {#each commits as commit}
+    {#if checkDate(commit)}
+      <h3>
+        {prettyDate(commit.date)}
+      </h3>
+    {/if}
+
+    <Commit {commit} />
+  {/each}
+</main>
+
+<style>
+  main {
+    max-width: 640px;
+    margin: 0 auto;
+  }
+</style>

view/src/routes/index.ts

@@ -1,2 +1,3 @@
 export { default as main } from "./main.svelte"
-export { default as list } from "./list.svelte"
+export { default as list } from "./list.svelte"
+export { default as changelog } from "./changelog.svelte"