Refactor

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>