xinyin025/LangBot
1
0
Fork 0
mirror of https://github.com/langbot-app/LangBot.git synced 2026-06-10 07:46:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(web): auto-refresh system status and show disconnect errors in real time

Browse Source 
Poll Plugin Runtime and Box Runtime status every 30 seconds so the
dashboard reflects disconnections without a manual page refresh.
Also re-fetch when the popover is opened for immediate feedback.
This commit is contained in:
Junyan Qin
2026-04-19 14:05:41 +08:00
committed by WangCham
parent 7858d17008
commit d47803db2c
1 changed files with 11 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
web/src/app/home/monitoring/components/overview-cards/SystemStatusCards.tsx
View File

@@ -37,8 +37,8 @@ export default function SystemStatusCard() {
const [boxStatus, setBoxStatus] = useState<ApiRespBoxStatus | null>(null); const [boxStatus, setBoxStatus] = useState<ApiRespBoxStatus | null>(null);
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const fetchStatus = useCallback(async () => { const fetchStatus = useCallback(async (showLoading = false) => {
setLoading(true); if (showLoading) setLoading(true);
try { try {
const [plugin, box] = await Promise.all([ const [plugin, box] = await Promise.all([
httpClient.getPluginSystemStatus().catch(() => null), httpClient.getPluginSystemStatus().catch(() => null),
@@ -47,12 +47,14 @@ export default function SystemStatusCard() {
setPluginStatus(plugin); setPluginStatus(plugin);
setBoxStatus(box); setBoxStatus(box);
} finally { } finally {
setLoading(false); if (showLoading) setLoading(false);
} }
}, []); }, []);
useEffect(() => { useEffect(() => {
fetchStatus(); fetchStatus(true);
const interval = setInterval(() => fetchStatus(false), 30_000);
return () => clearInterval(interval);
}, [fetchStatus]); }, [fetchStatus]);
const pluginOk = pluginStatus const pluginOk = pluginStatus
@@ -78,7 +80,11 @@ export default function SystemStatusCard() {
} }
return ( return (
<Popover> <Popover
onOpenChange={(open) => {
if (open) fetchStatus(false);
}}
>
<PopoverTrigger asChild> <PopoverTrigger asChild>
<Card className="transition-all duration-300 group cursor-pointer hover:border-primary/30"> <Card className="transition-all duration-300 group cursor-pointer hover:border-primary/30">
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-3"> <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-3">