🎨 format

app/src/routes/+layout.svelte

@@ -1,129 +1,129 @@
 <script lang="ts">
-  import { onDestroy, onMount } from 'svelte'
-  import { page } from '$app/state'
-  import { Modals, modals } from 'svelte-modals'
-  import Toast from '$lib/components/toasts/Toast.svelte'
-  import { notifications } from '$lib/components/toasts/notifications'
-  import { fade } from 'svelte/transition'
-  import '../app.css'
-  import Menu from '../lib/components/menu/Menu.svelte'
-  import Statusbar from '../lib/components/statusbar/statusbar.svelte'
-  import {
-    telemetry,
-    analytics,
-    ModesEnum,
-    kinematicData,
-    mode,
-    outControllerData,
-    servoAngles,
-    servoAnglesOut,
-    socket,
-    location,
-    useFeatureFlags,
-    walkGait
-  } from '$lib/stores'
-  import { type Analytics, type DownloadOTA } from '$lib/types/models'
-  import { MessageTopic } from '$lib/types/models'
+    import { onDestroy, onMount } from 'svelte'
+    import { page } from '$app/state'
+    import { Modals, modals } from 'svelte-modals'
+    import Toast from '$lib/components/toasts/Toast.svelte'
+    import { notifications } from '$lib/components/toasts/notifications'
+    import { fade } from 'svelte/transition'
+    import '../app.css'
+    import Menu from '../lib/components/menu/Menu.svelte'
+    import Statusbar from '../lib/components/statusbar/statusbar.svelte'
+    import {
+        telemetry,
+        analytics,
+        ModesEnum,
+        kinematicData,
+        mode,
+        outControllerData,
+        servoAngles,
+        servoAnglesOut,
+        socket,
+        location,
+        useFeatureFlags,
+        walkGait
+    } from '$lib/stores'
+    import { type Analytics, type DownloadOTA } from '$lib/types/models'
+    import { MessageTopic } from '$lib/types/models'
 
-  interface Props {
-    children?: import('svelte').Snippet
-  }
+    interface Props {
+        children?: import('svelte').Snippet
+    }
 
-  let { children }: Props = $props()
+    let { children }: Props = $props()
 
-  const features = useFeatureFlags()
+    const features = useFeatureFlags()
 
-  onMount(async () => {
-    const ws = $location ? $location : window.location.host
-    socket.init(`ws://${ws}/api/ws`)
+    onMount(async () => {
+        const ws = $location ? $location : window.location.host
+        socket.init(`ws://${ws}/api/ws`)
 
-    addEventListeners()
+        addEventListeners()
 
-    outControllerData.subscribe(data => socket.sendEvent(MessageTopic.input, data))
-    mode.subscribe(data => socket.sendEvent(MessageTopic.mode, data))
-    walkGait.subscribe(data => socket.sendEvent(MessageTopic.gait, data))
-    servoAnglesOut.subscribe(data => socket.sendEvent(MessageTopic.angles, data))
-    kinematicData.subscribe(data => socket.sendEvent(MessageTopic.position, data))
-  })
-
-  onDestroy(() => {
-    removeEventListeners()
-  })
-
-  const addEventListeners = () => {
-    socket.on('open', handleOpen)
-    socket.on('close', handleClose)
-    socket.on('error', handleError)
-    socket.on(MessageTopic.rssi, handleNetworkStatus)
-    socket.on(MessageTopic.mode, (data: ModesEnum) => mode.set(data))
-    socket.on(MessageTopic.analytics, handleAnalytics)
-    socket.on(MessageTopic.angles, (angles: number[]) => {
-      if (angles.length) servoAngles.set(angles)
+        outControllerData.subscribe(data => socket.sendEvent(MessageTopic.input, data))
+        mode.subscribe(data => socket.sendEvent(MessageTopic.mode, data))
+        walkGait.subscribe(data => socket.sendEvent(MessageTopic.gait, data))
+        servoAnglesOut.subscribe(data => socket.sendEvent(MessageTopic.angles, data))
+        kinematicData.subscribe(data => socket.sendEvent(MessageTopic.position, data))
     })
-    features.subscribe(data => {
-      if (data?.download_firmware) socket.on(MessageTopic.otastatus, handleOAT)
-      if (data?.sonar) socket.on(MessageTopic.sonar, data => console.log(data))
+
+    onDestroy(() => {
+        removeEventListeners()
     })
-  }
 
-  const removeEventListeners = () => {
-    socket.off(MessageTopic.analytics, handleAnalytics)
-    socket.off('open', handleOpen)
-    socket.off('close', handleClose)
-    socket.off(MessageTopic.rssi, handleNetworkStatus)
-    socket.off(MessageTopic.otastatus, handleOAT)
-  }
+    const addEventListeners = () => {
+        socket.on('open', handleOpen)
+        socket.on('close', handleClose)
+        socket.on('error', handleError)
+        socket.on(MessageTopic.rssi, handleNetworkStatus)
+        socket.on(MessageTopic.mode, (data: ModesEnum) => mode.set(data))
+        socket.on(MessageTopic.analytics, handleAnalytics)
+        socket.on(MessageTopic.angles, (angles: number[]) => {
+            if (angles.length) servoAngles.set(angles)
+        })
+        features.subscribe(data => {
+            if (data?.download_firmware) socket.on(MessageTopic.otastatus, handleOAT)
+            if (data?.sonar) socket.on(MessageTopic.sonar, data => console.log(data))
+        })
+    }
 
-  const handleOpen = () => {
-    notifications.success('Connection to device established', 5000)
-  }
+    const removeEventListeners = () => {
+        socket.off(MessageTopic.analytics, handleAnalytics)
+        socket.off('open', handleOpen)
+        socket.off('close', handleClose)
+        socket.off(MessageTopic.rssi, handleNetworkStatus)
+        socket.off(MessageTopic.otastatus, handleOAT)
+    }
 
-  const handleClose = () => {
-    notifications.error('Connection to device lost', 5000)
-    telemetry.setRSSI(0)
-  }
+    const handleOpen = () => {
+        notifications.success('Connection to device established', 5000)
+    }
 
-  const handleError = (data: any) => console.error(data)
+    const handleClose = () => {
+        notifications.error('Connection to device lost', 5000)
+        telemetry.setRSSI(0)
+    }
 
-  const handleAnalytics = (data: Analytics) => analytics.addData(data)
+    const handleError = (data: any) => console.error(data)
 
-  const handleNetworkStatus = (data: number) => telemetry.setRSSI(data)
+    const handleAnalytics = (data: Analytics) => analytics.addData(data)
 
-  const handleOAT = (data: DownloadOTA) => telemetry.setDownloadOTA(data)
+    const handleNetworkStatus = (data: number) => telemetry.setRSSI(data)
 
-  let menuOpen = $state(false)
+    const handleOAT = (data: DownloadOTA) => telemetry.setDownloadOTA(data)
+
+    let menuOpen = $state(false)
 </script>
 
 <svelte:head>
-  <title>{page.data.title}</title>
+    <title>{page.data.title}</title>
 </svelte:head>
 
 <div class="drawer">
-  <input id="main-menu" type="checkbox" class="drawer-toggle" bind:checked={menuOpen} />
-  <div class="drawer-content flex flex-col">
-    <!-- Status bar content here -->
-    <Statusbar />
+    <input id="main-menu" type="checkbox" class="drawer-toggle" bind:checked={menuOpen} />
+    <div class="drawer-content flex flex-col">
+        <!-- Status bar content here -->
+        <Statusbar />
 
-    <!-- Main page content here -->
-    {@render children?.()}
-  </div>
-  <!-- Side Navigation -->
-  <div class="drawer-side z-30 shadow-lg">
-    <label for="main-menu" class="drawer-overlay"></label>
-    <Menu menuClicked={() => (menuOpen = false)} />
-  </div>
+        <!-- Main page content here -->
+        {@render children?.()}
+    </div>
+    <!-- Side Navigation -->
+    <div class="drawer-side z-30 shadow-lg">
+        <label for="main-menu" class="drawer-overlay"></label>
+        <Menu menuClicked={() => (menuOpen = false)} />
+    </div>
 </div>
 
 <Modals>
-  <!-- svelte-ignore a11y_click_events_have_key_events -->
-  <!-- svelte-ignore a11y_no_static_element_interactions -->
-  {#snippet backdrop()}
-    <div
-      class="fixed inset-0 z-40 max-h-full max-w-full bg-black/20 backdrop-blur-sm"
-      transition:fade
-      onclick={modals.closeAll}>
-    </div>
-  {/snippet}
+    <!-- svelte-ignore a11y_click_events_have_key_events -->
+    <!-- svelte-ignore a11y_no_static_element_interactions -->
+    {#snippet backdrop()}
+        <div
+            class="fixed inset-0 z-40 max-h-full max-w-full bg-black/20 backdrop-blur-sm"
+            transition:fade
+            onclick={modals.closeAll}
+        ></div>
+    {/snippet}
 </Modals>
 
 <Toast />