feat: add agent status indicator in chat input, db tabs tests, and service management script

1 files changed, 15 insertions, 0 deletions

diff --git a/packages/frontend/src/lib/components/ChatInput.svelte b/packages/frontend/src/lib/components/ChatInput.svelte
index dac7a3a..3bbc4ab 100644
--- a/packages/frontend/src/lib/components/ChatInput.svelte
+++ b/packages/frontend/src/lib/components/ChatInput.svelte
@@ -4,6 +4,8 @@ import { tabStore } from "../tabs.svelte.js";
 let inputEl: HTMLInputElement | undefined;
 let inputValue = $state("");
 
+const agentStatus = $derived(tabStore.activeTab?.agentStatus ?? "idle");
+
 $effect(() => {
 	inputEl?.focus();
 });
@@ -24,6 +26,19 @@ function submit() {
 </script>
 
 <div class="flex items-center gap-2 p-3">
+	{#if agentStatus === "running"}
+		<span class="loading loading-spinner loading-sm text-primary"></span>
+	{:else if agentStatus === "idle"}
+		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" class="w-5 h-5 text-success">
+			<polyline points="20 6 9 17 4 12"></polyline>
+		</svg>
+	{:else if agentStatus === "error"}
+		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-5 h-5 text-error">
+			<circle cx="12" cy="12" r="10"></circle>
+			<line x1="12" y1="8" x2="12" y2="12"></line>
+			<line x1="12" y1="16" x2="12.01" y2="16"></line>
+		</svg>
+	{/if}
 	<input
 		bind:this={inputEl}
 		bind:value={inputValue}