From d9aa6e4fae2905b0370580ac723eecad30bc3171 Mon Sep 17 00:00:00 2001
From: Sam <sam@sam.wf>
Date: Sat, 25 Mar 2023 14:49:06 +0100
Subject: [PATCH] feat(frontend): add basic error pages (fixes #32)

---
 frontend/src/routes/+error.svelte             | 25 +++++++++++++++++++
 frontend/src/routes/@[username]/+error.svelte | 22 ++++++++++++++++
 2 files changed, 47 insertions(+)
 create mode 100644 frontend/src/routes/+error.svelte
 create mode 100644 frontend/src/routes/@[username]/+error.svelte

diff --git a/frontend/src/routes/+error.svelte b/frontend/src/routes/+error.svelte
new file mode 100644
index 0000000..52d0058
--- /dev/null
+++ b/frontend/src/routes/+error.svelte
@@ -0,0 +1,25 @@
+<script lang="ts">
+  import { page } from "$app/stores";
+</script>
+
+<h1>An error occurred ({$page.status})</h1>
+
+{#if $page.status === 404}
+  <p>
+    The page you were looking for was not found. If you're sure the page exists, check for any typos
+    in the address.
+  </p>
+{:else if $page.status === 429}
+  <p>You've exceeded a rate limit, please try again later.</p>
+{:else if $page.status === 500}
+  <p>An internal error occurred. Please try again later.</p>
+  <p>
+    If this error keeps happening, please <a
+      href="https://codeberg.org/u1f320/pronouns.cc/issues"
+      target="_blank"
+      rel="noreferrer">file a bug report</a
+    > with an explanation of what you did to cause the error.
+  </p>
+{/if}
+
+<p>Error message: <code>{$page.error?.message}</code></p>
diff --git a/frontend/src/routes/@[username]/+error.svelte b/frontend/src/routes/@[username]/+error.svelte
new file mode 100644
index 0000000..9d5d297
--- /dev/null
+++ b/frontend/src/routes/@[username]/+error.svelte
@@ -0,0 +1,22 @@
+<script lang="ts">
+  import { page } from "$app/stores";
+</script>
+
+<h1>An error occurred ({$page.status})</h1>
+
+{#if $page.status === 404}
+  <p>The user you were looking for couldn't be found. Please check for any typos.</p>
+{:else if $page.status === 429}
+  <p>You've exceeded a rate limit, please try again later.</p>
+{:else if $page.status === 500}
+  <p>An internal error occurred. Please try again later.</p>
+  <p>
+    If this error keeps happening, please <a
+      href="https://codeberg.org/u1f320/pronouns.cc/issues"
+      target="_blank"
+      rel="noreferrer">file a bug report</a
+    > with an explanation of what you did to cause the error.
+  </p>
+{/if}
+
+<p>Error message: <code>{$page.error?.message}</code></p>