💄 Use correct loading spinner

Malte2036 · Oct 15, 2024 · feac854 · feac854
1 parent 489086c
commit feac854
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 8 deletions.
diff --git a/package.json b/package.json
@@ -14,7 +14,7 @@
 		"test": "vitest"
 	},
 	"dependencies": {
-		"@malte2036/thw-tools-components": "^0.2.13",
+		"@malte2036/thw-tools-components": "^0.2.17",
 		"marked": "^14.1.3",
 		"zod": "^3.23.8"
 	},

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/lib/LoadingSpinner.svelte b/src/lib/LoadingSpinner.svelte
@@ -0,0 +1 @@
+<thw-loading-spinner />
diff --git a/src/routes/(main)/ai/+page.svelte b/src/routes/(main)/ai/+page.svelte
@@ -3,6 +3,7 @@
 	import { askAiKnowledgeBase, type AiKnowledgeBaseAskApiResponse } from '$lib/api/apiAi';
 	import Button from '$lib/Button.svelte';
 	import Input from '$lib/Input.svelte';
+	import LoadingSpinner from '$lib/LoadingSpinner.svelte';
 
 	let input = '';
 
@@ -15,14 +16,14 @@
 
 <div class="flex flex-col content-between p-4 h-full">
 	<div class="flex flex-col gap-4 flex-grow bg-thw-100 rounded-lg p-2">
-		<h1 class="text-2xl font-bold">Ask AI</h1>
+		<h1 class="text-2xl font-bold">Ask Knowledge Base</h1>
 
 		<Input bind:inputValue={input} placeholder="Ask AI" />
 
 		<Button click={ask}>Ask</Button>
 
 		{#await response}
-			<p>Loading...</p>
+			<LoadingSpinner />
 		{:then data}
 			{#if data}
 				<div class="text-lg font-bold">Ergebniss aus der Knowledge Base:</div>