style: run eslint and prettier

.vscode/extensions.json

@@ -1,6 +1,3 @@
 {
-  "recommendations": [
+	"recommendations": ["svelte.svelte-vscode", "inlang.vs-code-extension"]
-    "svelte.svelte-vscode",
-    "inlang.vs-code-extension"
-  ]
 }

project.inlang/settings.json

@@ -1,10 +1,7 @@
 {
 	"$schema": "https://inlang.com/schema/project-settings",
 	"baseLocale": "en",
-  "locales": [
+	"locales": ["en", "de"],
-    "en",
-    "de"
-  ],
 	"modules": [
 		"https://cdn.jsdelivr.net/npm/@inlang/plugin-message-format@4/dist/index.js",
 		"https://cdn.jsdelivr.net/npm/@inlang/plugin-m-function-matcher@2/dist/index.js"

src/App.svelte

@@ -6,7 +6,6 @@
 	import { routing } from "$lib/services/navigation/routing.svelte";
 	import { checkWebGL } from "$lib/webgl";
 	import RoutingInfo from "$lib/components/lnv/RoutingInfo.svelte";
-	import { setLocale } from "./paraglide/runtime";
 
 	onMount(() => {
 		if (!checkWebGL()) {
@@ -15,9 +14,6 @@
 			);
 			return;
 		}
-
-		// @ts-expect-error
-		window.setLocale = setLocale;
 	});
 </script>
 

src/lib/components/lnv/AddVehicleDrawer.svelte

@@ -138,9 +138,15 @@
 								: m["vehicles.add.electric"]()}
 					</Select.Trigger>
 					<Select.Content>
-						<Select.Item value="diesel">{m["vehicles.add.diesel"]()}</Select.Item>
+						<Select.Item value="diesel"
-						<Select.Item value="petrol">{m["vehicles.add.petrol"]()}</Select.Item>
+							>{m["vehicles.add.diesel"]()}</Select.Item
-						<Select.Item value="electric">{m["vehicles.add.electric"]()}</Select.Item>
+						>
+						<Select.Item value="petrol"
+							>{m["vehicles.add.petrol"]()}</Select.Item
+						>
+						<Select.Item value="electric"
+							>{m["vehicles.add.electric"]()}</Select.Item
+						>
 					</Select.Content>
 				</Select.Root>
 

src/lib/components/lnv/Sidebar.svelte

@@ -46,7 +46,7 @@
 		about: AboutSidebar,
 		"offline-maps": OfflineMapsSidebar,
 		"dev-options": DeveloperSidebar,
-		language: LanguageSidebar
+		language: LanguageSidebar,
 	};
 
 	let isDragging = false;

src/lib/components/lnv/sidebar/InRouteSidebar.svelte

@@ -123,7 +123,8 @@
 	});
 </script>
 
-{fullDistanceText} {m["sidebar.in-route.left"]()}
+{fullDistanceText}
+{m["sidebar.in-route.left"]()}
 
 <Button
 	onclick={() => {

src/lib/components/lnv/sidebar/InfoSidebar.svelte

@@ -256,7 +256,9 @@
 
 		<!-- any payment:* tag -->
 		{#if Object.keys(tags).some((key) => key.startsWith("payment:"))}
-			<h3 class="text-lg font-bold mt-2">{m["sidebar.info.payment-methods"]()}</h3>
+			<h3 class="text-lg font-bold mt-2">
+				{m["sidebar.info.payment-methods"]()}
+			</h3>
 			<ul style="display: flex; flex-wrap: wrap; gap: 0.5rem;">
 				{#each Object.entries(tags).filter( ([key]) => key.startsWith("payment:"), ) as [key, value] (key)}
 					<Badge

src/lib/components/lnv/sidebar/RouteSidebar.svelte

@@ -51,8 +51,8 @@
 </SidebarHeader>
 
 <span
-	>{m["sidebar.route.driving-with"]()} <strong>{(selectedVehicle() ?? DefaultVehicle).name}</strong
+	>{m["sidebar.route.driving-with"]()}
-	></span
+	<strong>{(selectedVehicle() ?? DefaultVehicle).name}</strong></span
 >
 <div class="flex flex-col gap-2 w-full mb-2">
 	<div class="flex gap-2 items-center w-full">
@@ -67,6 +67,7 @@
 		<Input bind:value={toLocation} />
 	</div>
 	<span>
+		<!-- eslint-disable-next-line -->
 		{@html m["sidebar.route.help"]()}
 	</span>
 </div>

src/lib/components/lnv/sidebar/settings/LanguageSidebar.svelte

@@ -11,13 +11,17 @@
 </SidebarHeader>
 
 <div id="languages">
-	{#each locales as locale}
+	{#each locales as locale, _index (locale)}
 		{#if locale == getLocale()}
 			<SettingsButton text={m.language()} icon={CheckIcon} disabled />
 		{:else}
-			<SettingsButton text={m.language({}, { locale })} icon={LanguagesIcon} onclick={() => {
+			<SettingsButton
-				setLocale(locale)
+				text={m.language({}, { locale })}
-			}} />
+				icon={LanguagesIcon}
+				onclick={() => {
+					setLocale(locale);
+				}}
+			/>
 		{/if}
 	{/each}
 </div>

src/lib/components/lnv/sidebar/settings/SettingsSidebar.svelte

@@ -19,13 +19,25 @@
 <div id="sections">
 	<section>
 		<h2>{m["sidebar.settings.general"]()}</h2>
-		<SettingsButton icon={LanguagesIcon} text={m["sidebar.language.header"]()} view="language" />
+		<SettingsButton
+			icon={LanguagesIcon}
+			text={m["sidebar.language.header"]()}
+			view="language"
+		/>
 	</section>
 
 	<section>
 		<h2>{m["sidebar.settings.map"]()}</h2>
-		<SettingsButton icon={MapIcon} text={m["sidebar.offline-maps.header"]()} view="offline-maps" />
+		<SettingsButton
-		<SettingsButton icon={PaintbrushIcon} text={m["sidebar.map-style.header"]()} disabled />
+			icon={MapIcon}
+			text={m["sidebar.offline-maps.header"]()}
+			view="offline-maps"
+		/>
+		<SettingsButton
+			icon={PaintbrushIcon}
+			text={m["sidebar.map-style.header"]()}
+			disabled
+		/>
 	</section>
 
 	<section>
@@ -37,7 +49,11 @@
 				view="dev-options"
 			/>
 		{/if}
-		<SettingsButton icon={InfoIcon} text={m["sidebar.about.header"]()} view="about" />
+		<SettingsButton
+			icon={InfoIcon}
+			text={m["sidebar.about.header"]()}
+			view="about"
+		/>
 	</section>
 </div>
 

vite.config.ts

@@ -1,4 +1,4 @@
-import { paraglideVitePlugin } from '@inlang/paraglide-js'
+import { paraglideVitePlugin } from "@inlang/paraglide-js";
 import tailwindcss from "@tailwindcss/vite";
 import { defineConfig } from "vite";
 import { svelte } from "@sveltejs/vite-plugin-svelte";
@@ -7,7 +7,14 @@ import path from "path";
 const host = process.env.TAURI_DEV_HOST;
 
 export default defineConfig({
-	plugins: [paraglideVitePlugin({ project: './project.inlang', outdir: './src/paraglide' }),tailwindcss(), svelte()],
+	plugins: [
+		paraglideVitePlugin({
+			project: "./project.inlang",
+			outdir: "./src/paraglide",
+		}),
+		tailwindcss(),
+		svelte(),
+	],
 	clearScreen: false,
 	server: {
 		port: 5173,