🌌 Migrate app to svelte-5

app/src/routes/peripherals/camera/Camera.svelte

@@ -6,8 +6,12 @@
 </script>
 
 <SettingsCard collapsible={false}>
-    <Camera slot="icon" class="lex-shrink-0 mr-2 h-6 w-6 self-end" />
-    <span slot="title">Camera</span>
+    {#snippet icon()}
+		<Camera  class="lex-shrink-0 mr-2 h-6 w-6 self-end" />
+	{/snippet}
+    {#snippet title()}
+		<span >Camera</span>
+	{/snippet}
     <Stream />
     <CameraSetting />
 </SettingsCard>

app/src/routes/peripherals/camera/CameraSetting.svelte

@@ -2,7 +2,7 @@
 	import { api } from '$lib/api';
 	import Spinner from '$lib/components/Spinner.svelte';
     import type { CameraSettings } from '$lib/types/models';
-    let settings:CameraSettings
+    let settings:CameraSettings = $state()
 
     const getCameraSettings = async () => {
         const result = await api.get<CameraSettings>('/api/camera/settings')
@@ -27,7 +27,7 @@
     <Spinner />
 {:then _} 
     <div class="flex flex-col gap-1">
-        <button class="btn btn-primary" type="button" on:click={updateCameraSettings}>Update camera settings</button>
+        <button class="btn btn-primary" type="button" onclick={updateCameraSettings}>Update camera settings</button>
 
         <label for="brightness">
             Brightness {settings.brightness}