Refactor

src/components/FightTable.svelte

@@ -1,28 +1,20 @@
 <script lang="ts">
-    import {eventRepo} from "./repo/repo.ts";
-    import {astroI18n} from "astro-i18n";
+    import {window} from "./util.ts";
+    import {astroI18n, t} from "astro-i18n";
     import type {ExtendedEvent} from "./types/event.ts";
 
     export let event: ExtendedEvent;
     export let group: string;
     export let rows: number = 1;
-
-    function window<T>(arr: T[], len: number): T[][] {
-        let result: T[][] = [];
-        for (let i = 0; i < arr.length; i += len) {
-            result.push(arr.slice(i, i + len));
-        }
-        return result;
-    }
 </script>
 
 <div>
     <table>
         <tr class="font-bold border-b">
             {#each Array(rows) as _}
-                <td>Time</td>
-                <td>Blue Team</td>
-                <td>Red Team</td>
+                <td>{t("announcements.table.time")}</td>
+                <td>{t("announcements.table.blue")}</td>
+                <td>{t("announcements.table.red")}</td>
             {/each}
         </tr>
         {#each window(event.fights.filter(f => f.group === group), rows) as fights}

src/components/GroupTable.svelte

@@ -0,0 +1,56 @@
+<script lang="ts">
+    import {window} from "./util.ts";
+    import {t} from "astro-i18n";
+    import type {ExtendedEvent} from "./types/event.ts";
+
+    export let event: ExtendedEvent;
+    export let group: string;
+    export let rows: number = 1;
+
+    $: teamPoints = event.teams.map(team => {
+        const fights = event.fights.filter(fight => fight.blueTeam.id === team.id || fight.redTeam.id === team.id);
+        const points = fights.reduce((acc, fight) => {
+            if (fight.ergebnis === 1 && fight.blueTeam.id === team.id) {
+                return acc + 3;
+            } else if (fight.ergebnis === 2 && fight.redTeam.id === team.id) {
+                return acc + 3;
+            } else if (fight.ergebnis === 3) {
+                return acc + 1;
+            } else {
+                return acc;
+            }
+        }, 0);
+        return {
+            team,
+            points,
+        };
+    }).sort((a, b) => b.points - a.points);
+</script>
+
+<div>
+    <table>
+        <tr class="font-bold border-b">
+            {#each Array(rows) as _}
+                <td>{t("announcements.table.team")}</td>
+                <td>{t("announcements.table.points")}</td>
+            {/each}
+        </tr>
+        {#each window(teamPoints, rows) as teams}
+            <tr>
+                {#each teams as team}
+                    <td>{team.team.name}</td>
+                    <td>{team.points}</td>
+                {/each}
+            </tr>
+        {/each}
+    </table>
+</div>
+
+<style lang="scss">
+  table {
+    @apply w-full;
+  }
+  div {
+    @apply p-3 bg-gray-200 dark:bg-gray-800 rounded-2xl w-3/4 mx-auto;
+  }
+</style>

src/components/util.ts

@@ -0,0 +1,7 @@
+export function window<T>(arr: T[], len: number): T[][] {
+    let result: T[][] = [];
+    for (let i = 0; i < arr.length; i += len) {
+        result.push(arr.slice(i, i + len));
+    }
+    return result;
+}