Add create and show page for competition

resources/js/pages/tournaments/Show.svelte

@@ -0,0 +1,55 @@
+<script lang="ts">
+    import Button from '@/components/ui/button/button.svelte';
+    import * as Card from '@/components/ui/card/index.js';
+    import * as Table from '@/components/ui/table';
+    import AppLayout from '@/layouts/AppLayout.svelte';
+    import { type Tournament } from '@/types';
+
+    const breadcrumbs = [
+        { title: 'Home', href: '/' },
+        { title: 'Tournaments', href: '/tournaments' },
+        { title: 'Tournament Name', href: '/tournaments/1' },
+    ];
+
+    let { tournament }: { tournament: Tournament } = $props();
+
+    function handleAddTeam() {
+        // add a new row to write the team name, on write complete save it
+    }
+</script>
+
+<AppLayout {breadcrumbs}>
+    {JSON.stringify(tournament)}
+    <!-- Teams -->
+    <Card.Root>
+        <Card.Header>
+            <Card.Title>Teams</Card.Title>
+        </Card.Header>
+        <Card.Content>
+            <Table.Root>
+                <Table.Header>
+                    <Table.Row>
+                        <Table.Head>Name</Table.Head>
+                        <Table.Head>Actions</Table.Head>
+                    </Table.Row>
+                </Table.Header>
+                <Table.Body>
+                    {#each tournament.teams as team (team)}
+                        <Table.Row>
+                            <Table.Cell>{JSON.stringify(team)}</Table.Cell>
+                            <Table.Cell>
+                                <Button variant="outline">Edit</Button>
+                                <Button variant="destructive">Delete</Button>
+                            </Table.Cell>
+                        </Table.Row>
+                    {/each}
+                    <Table.Row>
+                        <Table.Cell>
+                            <Button onsubmit={handleAddTeam} variant="outline">+ Add Team</Button>
+                        </Table.Cell>
+                    </Table.Row>
+                </Table.Body>
+            </Table.Root>
+        </Card.Content>
+    </Card.Root>
+</AppLayout>