feat: add changelog

frontend/src/lib/store.ts

@@ -12,3 +12,5 @@ const initialThemeValue = browser
   : defaultThemeValue;
 
 export const themeStore = writable<string>(initialThemeValue);
+
+export const CURRENT_CHANGELOG = "0.4.0";

frontend/src/routes/+layout.svelte

@@ -49,6 +49,7 @@
           >)
         {/if} ·
         <a href="/page/about">About & contact</a> &middot;
+        <a href="/page/changelog">Changelog</a> &middot;
         <Icon name="cash" aria-hidden />
         <a href="https://liberapay.com/u1f320/" target="_blank">Donate</a>
         &middot;

frontend/src/routes/nav/Navigation.svelte

@@ -16,7 +16,7 @@
   } from "sveltestrap";
 
   import Logo from "./Logo.svelte";
-  import { userStore, themeStore } from "$lib/store";
+  import { userStore, themeStore, CURRENT_CHANGELOG } from "$lib/store";
   import {
     ErrorCode,
     type APIError,
@@ -36,11 +36,14 @@
   let isAdmin = false;
   let numReports = 0;
   let numWarnings = 0;
+  let changelogRead = "99.99.99";
 
   $: currentUser = $userStore;
   $: theme = $themeStore;
 
   onMount(() => {
+    changelogRead = localStorage.getItem("changelog-read") || "0.0.0";
+
     const localUser = localStorage.getItem("pronouns-user");
     userStore.set(localUser ? JSON.parse(localUser) : null);
 
@@ -146,6 +149,13 @@
             </NavLink>
           </NavItem>
         {/if}
+        {#if changelogRead < CURRENT_CHANGELOG}
+          <NavItem>
+            <NavLink href="/page/changelog">
+              Changelog <Badge color="secondary">v{CURRENT_CHANGELOG}</Badge>
+            </NavLink>
+          </NavItem>
+        {/if}
       {:else}
         <NavItem>
           <NavLink href="/auth/login">Log in</NavLink>

frontend/src/routes/page/changelog/+page.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+  import { onMount } from "svelte";
+  import { html } from "./changelog.md";
+  import { CURRENT_CHANGELOG } from "$lib/store";
+
+  onMount(() => {
+    localStorage.setItem("changelog-read", CURRENT_CHANGELOG);
+  });
+</script>
+
+<svelte:head>
+  <title>Changelog - pronouns.cc</title>
+  <meta name="description" content="pronouns.cc's changelog" />
+  <meta property="og:description" content="pronouns.cc's changelog" />
+</svelte:head>
+
+<div class="grid">
+  <div class="row">
+    <div class="col-lg-2" />
+    <div class="col-lg-8">
+      {@html html}
+    </div>
+    <div class="col-lg-2" />
+  </div>
+</div>

frontend/src/routes/page/changelog/changelog.md

@@ -0,0 +1,17 @@
+# Changelog
+
+## 0.4.0 - April 20th 2023
+
+- **Added custom preferences!**
+  These can be used instead of, or in addition to, the existing five preferences
+  and can use any icon in [Bootstrap Icons](https://icons.getbootstrap.com/).
+  Change them in your [profile settings](/edit/profile).
+- Added the ability to sign in with Tumblr and Google accounts,
+  in addition to Discord and Mastodon.
+- Added this changelog.
+- Added a donation link to the footer, and a message on the settings page. Sadly, running a website like this costs money :(
+
+---
+
+- The website will now correctly handle tokens expiring, so you don't get stuck in an infinite loop as soon as they expire anymore.
+- Fixed pronoun links, pronouns with special characters will link to the correct page now.