Handle gongs

ui/src/routes/musiks/gongs/[gid]/+page.svelte

@@ -1,3 +1,39 @@
-<h2>
-    Gong
-</h2>
+<script>
+ import { page } from '$app/stores';
+
+ import {
+     Container,
+     Input,
+     ListGroup,
+     ListGroupItem,
+     Spinner,
+ } from 'sveltestrap';
+
+ import { getGong } from '../../../../lib/gong';
+</script>
+
+{#await getGong($page.params.gid)}
+    <div class="d-flex flex-fill justify-content-center align-items-center gap-2">
+        <Spinner color="primary" /> Chargement en cours&hellip;
+    </div>
+{:then gong}
+    <Container>
+        <h2>
+            {gong.name}
+        </h2>
+        <ListGroup>
+            <ListGroupItem>
+                <strong>Chemin</strong>
+                {gong.path}
+            </ListGroupItem>
+            <ListGroupItem class="d-flex gap-2">
+                <strong>Par défaut&nbsp;?</strong>
+                <Input type="switch" on:change={() => gong.setDefault()} checked={gong.enabled} disabled={gong.enabled} />
+            </ListGroupItem>
+            <ListGroupItem>
+                <strong>ID</strong>
+                <span class="text-muted">{gong.id}</span>
+            </ListGroupItem>
+        </ListGroup>
+    </Container>
+{/await}