Jakob Wennberg
3edbf0a2e3
Three user-reported failures in the assistant panel, one root cause each: 1. "The chat asks what I'm referring to" when continuing a thread. The single-call console (general.help, AskConsole -> /api/agent/ask) was stateless since the 08-20 model-agnostic cutover: conversationId was only the tool actor id, so every turn was answered blind, reload or not. The provider-agnostic GenerateTextRequest gains an optional `history` (real message turns before the prompt, in both the Anthropic-family and the OpenAI-compatible adapter; absent/empty leaves the request byte-identical to the single-turn call). The route loads the thread's earlier turns server-side (loadChatHistory: text only, hidden and tool rows dropped, alternation repaired, newest 16 rows / 10k chars) before writing the new question, and hands them to the model. 2. A full page reload (the deploy prompt's "Ladda om") closed the docked panel and dropped the thread from view. The panel now remembers its open thread per tab in sessionStorage (lib/agent-panel/session-restore) and the provider reopens it on mount; the sheet loads it exactly like a pick from "Tidigare konversationer". Close and "Ny konversation" forget it; a thread that no longer opens is dropped instead of retried on every reload. 3. "Can't type any more" once the update banner shows. DeployReloadPrompt's full-width wrapper sits at z-[60] after the panel in DOM order and swallowed clicks on the panel's composer; only the card takes input now. Claude-Session: https://claude.ai/code/session_01VjoXN3xdNZrHZeYA6qMi3g Co-authored-by: Jakob Wennberg <311770904+jakobwennberg-oss@users.noreply.github.com> Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
71 lines
2.6 KiB
TypeScript
71 lines
2.6 KiB
TypeScript
'use client'
|
|
|
|
import { useEffect, useState } from 'react'
|
|
import { useTranslations } from 'next-intl'
|
|
import { Button } from '@/components/ui/button'
|
|
|
|
// Inlined at build time from next.config's `env` (the deploy's commit SHA on
|
|
// Vercel; empty in dev / self-hosted, which turns the check off).
|
|
const BUILD_ID = process.env.NEXT_PUBLIC_BUILD_ID || ''
|
|
|
|
/**
|
|
* Detects when a newer deploy is live while this tab is still running an old JS
|
|
* bundle, and offers a one-click reload. This is why a just-shipped change can
|
|
* appear "missing" in a long-open tab until the whole app is reloaded.
|
|
*
|
|
* Compares the build id baked into this bundle against /api/version (the
|
|
* running deployment's id), re-checking when the tab regains focus plus a slow
|
|
* interval backstop. No-op when no build id is set.
|
|
*/
|
|
export function DeployReloadPrompt() {
|
|
const t = useTranslations('common')
|
|
const [stale, setStale] = useState(false)
|
|
|
|
useEffect(() => {
|
|
if (!BUILD_ID || stale) return
|
|
|
|
let cancelled = false
|
|
async function check() {
|
|
try {
|
|
const res = await fetch('/api/version', { cache: 'no-store' })
|
|
if (!res.ok) return
|
|
const { id } = await res.json()
|
|
if (!cancelled && id && id !== BUILD_ID) setStale(true)
|
|
} catch {
|
|
// Transient network error: ignore, the next trigger retries.
|
|
}
|
|
}
|
|
|
|
function onVisible() {
|
|
if (document.visibilityState === 'visible') check()
|
|
}
|
|
|
|
check()
|
|
document.addEventListener('visibilitychange', onVisible)
|
|
const interval = setInterval(check, 30 * 60 * 1000) // 30 min backstop
|
|
return () => {
|
|
cancelled = true
|
|
document.removeEventListener('visibilitychange', onVisible)
|
|
clearInterval(interval)
|
|
}
|
|
}, [stale])
|
|
|
|
if (!stale) return null
|
|
|
|
return (
|
|
// The wrapper spans the full width at the same z-index as the docked
|
|
// assistant panel and mounts after it, so without pointer-events-none it
|
|
// swallowed every click and tap in the strip behind it: the panel's
|
|
// composer sits exactly there, and "a new version is available" turned
|
|
// into "I can't type any more". Only the card itself takes input.
|
|
<div className="pointer-events-none fixed inset-x-0 bottom-4 z-[60] flex justify-center px-4">
|
|
<div className="pointer-events-auto flex items-center gap-3 rounded-lg border border-border bg-popover px-4 py-3 text-sm shadow-md">
|
|
<span className="text-foreground">{t('update_available')}</span>
|
|
<Button size="sm" onClick={() => window.location.reload()}>
|
|
{t('reload')}
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|