🎨 Fix different typing problems

app/src/lib/api.ts

@@ -1,6 +1,6 @@
 import { get } from 'svelte/store'
 import { Err, Ok, type Result } from './utilities'
-import { location } from './stores'
+import { apiLocation } from './stores'
 
 export const api = {
     get<TResponse>(endpoint: string, params?: RequestInit) {
@@ -44,7 +44,7 @@ async function sendRequest<TResponse>(
 
     try {
         response = await fetch(endpoint, request)
-    } catch (error) {
+    } catch {
         return Err.new(new Error(), 'An error has occurred')
     }
 
@@ -67,9 +67,9 @@ async function sendRequest<TResponse>(
 }
 
 function resolveUrl(url: string): string {
-    if (url.startsWith('http') || !get(location)) return url
+    if (url.startsWith('http') || !get(apiLocation)) return url
     const protocol = window.location.protocol
-    return `${protocol}//${get(location)}${url.startsWith('/') ? '' : '/'}${url}`
+    return `${protocol}//${get(apiLocation)}${url.startsWith('/') ? '' : '/'}${url}`
 }
 
 export class ApiError extends Error {

app/src/lib/components/Stream.svelte

@@ -1,8 +1,8 @@
 <script lang="ts">
     import { onDestroy } from 'svelte'
-    import { location } from '$lib/stores'
+    import { apiLocation } from '$lib/stores'
 
-    let source = $state(`${$location}/api/camera/stream`)
+    let source = $state(`${$apiLocation}/api/camera/stream`)
 
     onDestroy(() => (source = '#'))
 </script>

app/src/lib/components/Visualization.svelte

@@ -59,8 +59,6 @@
     let gui_panel: GUI
     let Throttler = new throttler()
 
-    let feet_trace = new Array(4).fill([])
-    let trace_lines: BufferGeometry<NormalBufferAttributes>[] = []
     let target: Object3D<Object3DEventMap>
 
     let target_position = { x: 0, z: 0, yaw: 0 }
@@ -179,7 +177,7 @@
             .addDirectionalLight({ x: 10, y: 20, z: 10, color: 0xffffff, intensity: 3 })
             .addAmbientLight({ color: 0xffffff, intensity: 0.5 })
             .addFogExp2(0xcccccc, 0.015)
-            .addModel($model)
+            .addModel($model as URDFRobot)
             .addTransformControls(sceneManager.model)
             .fillParent()
             .addRenderCb(render)
@@ -193,32 +191,13 @@
         sceneManager.scene.add(target)
 
         if (debug) {
-            sceneManager.addDragControl(updateAngles)
+            sceneManager.addDragControl((angles: Record<string, number>) => {
+                Object.entries(angles).forEach(([name, angle]) => {
+                    updateAngles(name, angle)
+                })
+            })
         }
         if (sky) sceneManager.addSky()
-
-        for (let i = 0; i < 4; i++) {
-            const geometry = new BufferGeometry()
-            const material = new LineBasicMaterial({ color: extractFootColor() })
-            const line = new Line(geometry, material)
-            trace_lines.push(geometry)
-            sceneManager.scene.add(line)
-        }
-    }
-
-    const renderTraceLines = (foot_positions: Vector3[]) => {
-        if (!settings['Trace feet']) {
-            if (!feet_trace.length) return
-            trace_lines.forEach((line, i) => line.setFromPoints(feet_trace[i].slice(-1)))
-            feet_trace = new Array(4).fill([])
-            return
-        }
-
-        trace_lines.forEach((line, i) => {
-            feet_trace[i].push(foot_positions[i])
-            feet_trace[i] = feet_trace[i].slice(-settings['Trace points'])
-            line.setFromPoints(feet_trace[i])
-        })
     }
 
     const calculate_kinematics = () => {
@@ -311,7 +290,6 @@
 
         const toes = getToeWorldPositions(robot)
 
-        renderTraceLines(toes)
         update_camera(robot)
         update_gait()
         calculate_kinematics()

app/src/lib/components/menu/GithubButton.svelte

@@ -2,7 +2,7 @@
     import { Github } from '../icons'
 
     interface Props {
-        github: { url: string; version: string }
+        github: { url: string; version: string; active?: boolean; href?: string }
     }
 
     let { github }: Props = $props()

app/src/lib/components/widget/ChartWidget.svelte

@@ -6,7 +6,7 @@
     import { slide } from 'svelte/transition'
 
     let chartElement: HTMLCanvasElement
-    let chart: Chart<'line', number[], string>
+    let chart: Chart<'line', number[], number>
 
     interface Props {
         label: string

app/src/lib/stores/location-store.ts

@@ -2,4 +2,5 @@ import { persistentStore } from '$lib/utilities'
 import { writable } from 'svelte/store'
 import { PUBLIC_VITE_USE_HOST_NAME } from '$env/static/public'
 
-export const location = PUBLIC_VITE_USE_HOST_NAME ? writable('') : persistentStore('location', '')
+export const apiLocation =
+    PUBLIC_VITE_USE_HOST_NAME ? writable('') : persistentStore('location', '')

app/src/routes/+layout.svelte

@@ -18,7 +18,7 @@
         servoAngles,
         servoAnglesOut,
         socket,
-        location,
+        apiLocation,
         useFeatureFlags,
         walkGait
     } from '$lib/stores'
@@ -34,7 +34,7 @@
     const features = useFeatureFlags()
 
     onMount(async () => {
-        const ws = $location ? $location : window.location.host
+        const ws = $apiLocation ? $apiLocation : window.location.host
         socket.init(`ws://${ws}/api/ws`)
 
         addEventListeners()

app/src/routes/connection/Connection.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
     import SettingsCard from '$lib/components/SettingsCard.svelte'
     import { WiFi } from '$lib/components/icons'
-    import { location, socket } from '$lib/stores'
+    import { apiLocation, socket } from '$lib/stores'
 
     const update = () => {
-        const ws = $location ? $location : window.location.host
+        const ws = $apiLocation ? $apiLocation : window.location.host
         socket.init(`ws://${ws}/api/ws/events`)
     }
 </script>
@@ -19,7 +19,7 @@
 
     <div class="flex">
         <label class="label w-32" for="server">Address:</label>
-        <input class="input" bind:value={$location} />
+        <input class="input" bind:value={$apiLocation} />
     </div>
 
     <button class="btn btn-primary" onclick={update}>Update</button>

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

@@ -2,7 +2,19 @@
     import { api } from '$lib/api'
     import Spinner from '$lib/components/Spinner.svelte'
     import type { CameraSettings } from '$lib/types/models'
-    let settings: CameraSettings = $state()
+    let settings: CameraSettings = $state({
+        brightness: 0,
+        contrast: 0,
+        framesize: 0,
+        vflip: false,
+        hmirror: false,
+        special_effect: 0,
+        quality: 0,
+        saturation: 0,
+        sharpness: 0,
+        denoise: 0,
+        wb_mode: 0
+    })
 
     const getCameraSettings = async () => {
         const result = await api.get<CameraSettings>('/api/camera/settings')

app/src/routes/peripherals/i2c/i2cSetting.svelte

@@ -16,7 +16,7 @@
     })
 
     const handleSettings = (data: Record<string, unknown>) => {
-        settings = data
+        settings = data as PeripheralsConfiguration
     }
 
     const handleSave = () => {

app/src/routes/peripherals/imu/imu.svelte

@@ -195,8 +195,8 @@
         }
 
         if ($features.bmp) {
-            updateChartData(tempChart, $imu.bmp_temp, 'Temperature')
+            updateChartData(tempChart, $imu.bmp_temp)
-            updateChartData(altitudeChart, $imu.altitude, 'Altitude')
+            updateChartData(altitudeChart, $imu.altitude)
         }
     }