diff --git a/frontend/src/components/AppHeader.vue b/frontend/src/components/AppHeader.vue index 4c7c998..6c5a707 100644 --- a/frontend/src/components/AppHeader.vue +++ b/frontend/src/components/AppHeader.vue @@ -14,18 +14,31 @@ const chatStore = useChatStore(); const router = useRouter(); const mobileMenuOpen = ref(false); +const statusShortLabel = computed(() => { + if (chatStore.ollamaStatus === "unavailable") return "Offline"; + if (chatStore.ollamaStatus === "checking") return "Checking"; + if (chatStore.modelStatus === "not_found") return "No model"; + if (chatStore.modelStatus === "cold") return "Cold"; + if (chatStore.modelStatus === "loaded") return "Ready"; + return "Checking"; +}); + const statusLabel = computed(() => { if (chatStore.ollamaStatus === "unavailable") return "Ollama unavailable"; - if (chatStore.modelStatus === "not_found") return "Model downloading..."; - if (chatStore.chatReady) return "Connected"; + if (chatStore.ollamaStatus === "checking") return "Checking..."; + if (chatStore.modelStatus === "not_found") return "Model not installed"; + if (chatStore.modelStatus === "cold") return "Model cold — first response may be slow"; + if (chatStore.modelStatus === "loaded") return "Model loaded · ready"; return "Checking..."; }); const statusClass = computed(() => { if (chatStore.ollamaStatus === "unavailable") return "status-red"; - if (chatStore.modelStatus === "not_found") return "status-yellow"; - if (chatStore.chatReady) return "status-green"; - return "status-yellow"; + if (chatStore.ollamaStatus === "checking") return "status-gray"; + if (chatStore.modelStatus === "not_found") return "status-orange"; + if (chatStore.modelStatus === "cold") return "status-yellow"; + if (chatStore.modelStatus === "loaded") return "status-green"; + return "status-gray"; }); function toggleMobileMenu() { @@ -67,6 +80,7 @@ router.afterEach(() => { Logs + {{ statusShortLabel }}