feat: add loading state to view

src/lib/components/lnv/Sidebar.svelte

@@ -24,6 +24,7 @@
 	import LoadingSidebar from "./sidebar/LoadingSidebar.svelte";
 	import { Tween } from "svelte/motion";
 	import { quintOut } from "svelte/easing";
+	import Progressbar from "../Progressbar.svelte";
 
 	const views: Record<string, string> = {
 		main: "MainSidebar",
@@ -134,10 +135,6 @@
 		return () => value;
 	}
 
-	// TODO: implement loading state
-	// eslint-disable-next-line @typescript-eslint/no-unused-vars
-	let loading = $state(false);
-
 	let searchText = $derived.by(debounce(() => searchbar.text, 300));
 	let searchResults: Feature[] = $state([]);
 	let mobileView = $derived(window.innerWidth < 768 || routing.currentTrip);
@@ -149,10 +146,10 @@
 			return;
 		}
 		if (searchText.length > 0) {
-			loading = true;
+			view.loading = true;
 			search(searchText, 0, 0).then((results) => {
 				searchResults = results;
-				loading = false;
+				view.loading = false;
 				view.switch("search", {
 					results: searchResults,
 					query: searchText,
@@ -211,6 +208,10 @@
 		</div>
 	{/if}
 
+	{#if view.loading}
+		<Progressbar />
+	{/if}
+
 	{#if routing.currentTrip}
 		<InRouteSidebar />
 	{:else}