New Code Editor and fun

src/components/dashboard/Statistics.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+    import type {Player} from "../types/data.ts";
+    import {statsRepo} from "../repo/repo.ts";
+    import {t} from "astro-i18n"
+
+    export let user: Player;
+
+    let request = getRequest();
+
+    function getRequest() {
+        return $statsRepo.getUserStats(user.id)
+    }
+</script>
+
+{#await request}
+    <p>{t("status.loading")}</p>
+{:then data}
+    <p>Playtime: {data.playtime}h</p>
+    <p>Fights: {data.fights}</p>
+    {#if user.perms.includes("CHECK")}
+        <p>Schematics Checked: {data.acceptedSchematics}</p>
+    {/if}
+{:catch error}
+    <p>error: {error}</p>
+{/await}

src/components/dashboard/UserInfo.svelte

@@ -3,6 +3,7 @@
     import type {Player} from "../types/data.ts";
     import {tokenStore} from "../repo/repo.ts";
     import {l} from "../../util/util.ts";
+    import Statistics from "./Statistics.svelte";
 
     export let user: Player;
 
@@ -31,11 +32,6 @@
     <div>
         <h1 class="text-4xl font-bold">{t("dashboard.title", {name: user.name})}</h1>
         <p>{t("dashboard.rank", {rank: t("home.prefix." + user.prefix)})}</p>
-        <p>{t("dashboard.permissions")}</p>
-        <ul>
-            {#each user.perms as permission}
-                <li class="list-disc ml-6">{permission}</li>
-            {/each}
-        </ul>
+        <Statistics {user} />
     </div>
 </div>