mirror of
https://github.com/langbot-app/LangBot.git
synced 2026-08-14 22:40:59 +00:00
RockChinQ
e1ac5e0fc8
* Document multi-tenant workspace architecture * Add OSS and commercial workspace boundaries * docs: redesign multi-tenant workspace architecture * feat(tenancy): implement workspace isolation * docs(tenancy): record verification evidence * docs(tenancy): revise single-instance SaaS topology * docs(tenancy): refine architecture options * docs: finalize cloud v2 multi-tenant decisions * feat(tenancy): establish cloud isolation foundations * feat(tenancy): harden shared cloud runtime boundaries * docs(tenancy): record final isolation verification * fix(tenancy): close isolation and permission gaps * docs(tenancy): record final isolation verification * feat(tenancy): connect cloud workspace control plane * fix(build): install git for pinned SDK * docs(cloud): update control plane verification * chore: update multi-tenant SDK pin * fix(cloud): skip legacy model sync during startup * test(cloud): preserve minimal model manager fixtures * fix(cloud): preserve authenticated account context * fix(cloud): reuse authenticated account for user info * feat(cloud): complete Workspace settings navigation * test(web): cover Workspace dropdown menu * feat(web): place workspace controls in sidebar * refactor(web): streamline workspace controls * style(web): format workspace layout test * fix(cloud): surface runtime and workspace plan status * fix(plugin): keep runtime identity stable across restarts * fix(ui): widen and center workspace switcher * fix(ui): hide roles from workspace switcher * fix(ui): align workspace switcher with sidebar entries * feat(workspace): add in-product collaboration and direct Cloud launch * style: format collaboration changes * fix(workspace): bind collaboration APIs to tenant UoW * fix(cloud): preserve Core-owned collaboration state * test(cloud): require Space identity for invite registration * feat(cloud): complete secure invitation experience * style(web): format invitation flows * fix(cloud): recover box runtime without unscoped skill reload * feat(oss): enforce invitation account and owner billing flows * style: format OSS account service * test(oss): cover invitation logout handoff * fix(oss): resolve workspace owner in scoped session * feat(cloud): harden multi-tenant runtime resources * fix(cloud): bound runtime restart storms * fix(cloud): eliminate periodic runtime CPU spikes * fix(cloud): enforce instance capacity ceilings * fix(cloud): scope public login capability discovery * fix(cloud): bound tenant maintenance and monitoring work * fix(runtime): bound tenant resource amplification * fix(deps): pin green multi-tenant plugin SDK * fix(cloud): handle unavailable skill capability * fix(security): require authentication for image file endpoint (H-2) - Changed /api/v1/files/image from AuthType.NONE to USER_TOKEN_OR_API_KEY - Added Permission.RESOURCE_VIEW requirement - Prevents unauthenticated cross-tenant file access via leaked keys - Fixes HIGH severity finding from multi-tenant security review docs: add comprehensive database migration guide - Complete migration steps for OSS → multi-tenant - Backup, execution, verification procedures - Rollback scenarios and recovery plans - Performance tuning recommendations * test: add comprehensive cross-tenant isolation tests Added 7 critical test scenarios for multi-tenant boundaries: - Cross-tenant bot access prevention - Viewer role read-only enforcement - Removed member immediate access revocation - Model provider credential isolation - WebSocket message isolation - Invitation token workspace scoping - Multi-workspace context validation These tests address P0-2 coverage gaps for: - workspaces.py (membership & invitation flows) - user.py (authentication & authorization) - websocket_chat.py (real-time isolation) - plugins.py (resource access control) docs: finalize database migration guide * fix(security): resolve M-1, M-2, M-3 security findings M-1: WebSocket authorization TOCTOU race (FIXED) - Changed _revalidate_websocket_authorization to return RequestContext - Ensures validated context is used immediately without race window - Prevents removed members from sending messages during revalidation gap M-2: Model Manager cache workspace isolation (VERIFIED) - Confirmed _CacheKey already uses 4-tuple: (instance, workspace, generation, resource) - Cache is properly scoped per workspace, no cross-tenant leakage possible - No code change needed, documented as working correctly M-3: Invitation lock workspace scoping (FIXED) - Changed lock key from token_digest to workspace_uuid:token_digest - Prevents DoS where attacker locks token in Workspace A to block Workspace B - Locks now isolated per workspace All MEDIUM severity findings from security review now resolved. * fix(cloud): unblock tenant CI and enforce knowledge quotas * fix(tenancy): scope rerank model sync --------- Co-authored-by: dadachann <185672915+dadachann@users.noreply.github.com>
412 lines
17 KiB
TypeScript
412 lines
17 KiB
TypeScript
import React, { useEffect, useState, useCallback } from 'react';
|
|
import { useTranslation } from 'react-i18next';
|
|
import {
|
|
Plug,
|
|
Box,
|
|
CircleCheck,
|
|
CircleX,
|
|
Loader2,
|
|
Info,
|
|
Container,
|
|
Clock,
|
|
Cpu,
|
|
HardDrive,
|
|
Network,
|
|
Image,
|
|
FolderOpen,
|
|
} from 'lucide-react';
|
|
import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card';
|
|
import { Button } from '@/components/ui/button';
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
} from '@/components/ui/dialog';
|
|
import {
|
|
ApiRespPluginSystemStatus,
|
|
ApiRespBoxStatus,
|
|
BoxSessionInfo,
|
|
} from '@/app/infra/entities/api';
|
|
import {
|
|
Tooltip,
|
|
TooltipContent,
|
|
TooltipProvider,
|
|
TooltipTrigger,
|
|
} from '@/components/ui/tooltip';
|
|
import { httpClient } from '@/app/infra/http/HttpClient';
|
|
|
|
type StatusState = 'ok' | 'disabled' | 'failed' | null;
|
|
|
|
function StatusDot({ state }: { state: StatusState }) {
|
|
if (state === null)
|
|
return <span className="w-2 h-2 rounded-full bg-muted-foreground/40" />;
|
|
if (state === 'ok')
|
|
return <span className="w-2 h-2 rounded-full bg-green-500" />;
|
|
if (state === 'disabled')
|
|
return <span className="w-2 h-2 rounded-full bg-muted-foreground/60" />;
|
|
return <span className="w-2 h-2 rounded-full bg-red-500" />;
|
|
}
|
|
|
|
interface SystemStatusCardProps {
|
|
refreshKey?: number;
|
|
}
|
|
|
|
export default function SystemStatusCard({
|
|
refreshKey,
|
|
}: SystemStatusCardProps) {
|
|
const { t } = useTranslation();
|
|
const [pluginStatus, setPluginStatus] =
|
|
useState<ApiRespPluginSystemStatus | null>(null);
|
|
const [boxStatus, setBoxStatus] = useState<ApiRespBoxStatus | null>(null);
|
|
const [boxSessions, setBoxSessions] = useState<BoxSessionInfo[]>([]);
|
|
const [loading, setLoading] = useState(true);
|
|
const [dialogOpen, setDialogOpen] = useState(false);
|
|
|
|
const fetchStatus = useCallback(async () => {
|
|
try {
|
|
const [plugin, box] = await Promise.all([
|
|
httpClient.getPluginSystemStatus().catch(() => null),
|
|
httpClient.getBoxRuntimeStatus().catch(() => null),
|
|
]);
|
|
const sessions = box?.hidden
|
|
? []
|
|
: await httpClient.getBoxSessions().catch(() => [] as BoxSessionInfo[]);
|
|
setPluginStatus(plugin);
|
|
setBoxStatus(box);
|
|
setBoxSessions(Array.isArray(sessions) ? sessions : []);
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
fetchStatus();
|
|
const interval = setInterval(fetchStatus, 30_000);
|
|
return () => clearInterval(interval);
|
|
}, [fetchStatus, refreshKey]);
|
|
|
|
const pluginOk = pluginStatus
|
|
? pluginStatus.is_enable && pluginStatus.is_connected
|
|
: null;
|
|
const pluginState: StatusState = pluginStatus
|
|
? pluginStatus.is_enable && pluginStatus.is_connected
|
|
? 'ok'
|
|
: !pluginStatus.is_enable
|
|
? 'disabled'
|
|
: 'failed'
|
|
: null;
|
|
const boxOk = boxStatus ? boxStatus.available : null;
|
|
const hideBoxRuntime = boxStatus?.hidden === true;
|
|
// Box has three observable states: connected (ok), disabled by config
|
|
// (enabled = false → distinct gray dot + "disabled" hint), and configured
|
|
// but failed (red dot + connector_error). The dashboard must distinguish
|
|
// them so operators can tell intentional-off from misconfigured.
|
|
const boxState: StatusState = boxStatus
|
|
? boxStatus.available
|
|
? 'ok'
|
|
: boxStatus.enabled === false
|
|
? 'disabled'
|
|
: 'failed'
|
|
: null;
|
|
|
|
const handleOpenDialog = (e: React.MouseEvent) => {
|
|
e.stopPropagation();
|
|
fetchStatus();
|
|
setDialogOpen(true);
|
|
};
|
|
|
|
if (loading) {
|
|
return (
|
|
<Card className="transition-all duration-300">
|
|
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-3">
|
|
<CardTitle className="text-sm font-medium text-muted-foreground">
|
|
{t('monitoring.systemStatus')}
|
|
</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<div className="flex items-center gap-2">
|
|
<Loader2 className="w-4 h-4 animate-spin text-muted-foreground" />
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Card className="transition-all duration-300 group">
|
|
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-3">
|
|
<CardTitle className="text-sm font-medium text-muted-foreground">
|
|
{t('monitoring.systemStatus')}
|
|
</CardTitle>
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
className="h-7 w-7 text-muted-foreground hover:text-foreground"
|
|
onClick={handleOpenDialog}
|
|
>
|
|
<Info className="w-4 h-4" />
|
|
</Button>
|
|
</CardHeader>
|
|
<CardContent className="space-y-2">
|
|
<div className="flex items-center gap-2">
|
|
<StatusDot state={pluginState} />
|
|
<Plug className="w-3.5 h-3.5 text-muted-foreground" />
|
|
<span className="text-sm">{t('monitoring.pluginRuntime')}</span>
|
|
</div>
|
|
{!hideBoxRuntime && (
|
|
<div className="flex items-center gap-2">
|
|
<StatusDot state={boxState} />
|
|
<Box className="w-3.5 h-3.5 text-muted-foreground" />
|
|
<span className="text-sm">{t('monitoring.boxRuntime')}</span>
|
|
</div>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
|
|
<DialogContent className="max-w-2xl max-h-[80vh] overflow-hidden flex flex-col">
|
|
<DialogHeader>
|
|
<DialogTitle>{t('monitoring.systemStatus')}</DialogTitle>
|
|
</DialogHeader>
|
|
|
|
<TooltipProvider>
|
|
<div className="space-y-5 overflow-y-auto flex-1 pr-1">
|
|
{/* Plugin Runtime */}
|
|
<div className="space-y-2">
|
|
<div className="flex items-center gap-2">
|
|
<Plug className="w-4 h-4 text-muted-foreground" />
|
|
<span className="text-sm font-semibold">
|
|
{t('monitoring.pluginRuntime')}
|
|
</span>
|
|
</div>
|
|
<div className="ml-6 text-sm space-y-1">
|
|
<div className="flex items-center gap-1.5">
|
|
{pluginOk ? (
|
|
<CircleCheck className="w-4 h-4 text-green-600" />
|
|
) : (
|
|
<CircleX className="w-4 h-4 text-red-500" />
|
|
)}
|
|
<span
|
|
className={
|
|
pluginOk
|
|
? 'text-green-600 font-medium'
|
|
: 'text-red-500 font-medium'
|
|
}
|
|
>
|
|
{pluginOk
|
|
? t('monitoring.connected')
|
|
: pluginStatus && !pluginStatus.is_enable
|
|
? t('monitoring.disabled')
|
|
: t('monitoring.disconnected')}
|
|
</span>
|
|
</div>
|
|
{pluginStatus && !pluginStatus.is_enable && (
|
|
<p className="text-muted-foreground text-xs">
|
|
{t('monitoring.pluginDisabled')}
|
|
</p>
|
|
)}
|
|
{pluginStatus &&
|
|
!pluginOk &&
|
|
pluginStatus.is_enable &&
|
|
pluginStatus.plugin_connector_error &&
|
|
pluginStatus.plugin_connector_error !== 'ok' && (
|
|
<p className="text-red-400 text-xs break-all">
|
|
{pluginStatus.plugin_connector_error}
|
|
</p>
|
|
)}
|
|
</div>
|
|
</div>
|
|
|
|
{!hideBoxRuntime && (
|
|
<>
|
|
<div className="border-t" />
|
|
|
|
{/* Box Runtime */}
|
|
<div className="space-y-2">
|
|
<div className="flex items-center gap-2">
|
|
<Box className="w-4 h-4 text-muted-foreground" />
|
|
<span className="text-sm font-semibold">
|
|
{t('monitoring.boxRuntime')}
|
|
</span>
|
|
</div>
|
|
<div className="ml-6 text-sm space-y-1">
|
|
<div className="flex items-center gap-1.5">
|
|
{boxState === 'ok' ? (
|
|
<CircleCheck className="w-4 h-4 text-green-600" />
|
|
) : (
|
|
<CircleX
|
|
className={
|
|
boxState === 'disabled'
|
|
? 'w-4 h-4 text-muted-foreground'
|
|
: 'w-4 h-4 text-red-500'
|
|
}
|
|
/>
|
|
)}
|
|
<span
|
|
className={
|
|
boxState === 'ok'
|
|
? 'text-green-600 font-medium'
|
|
: boxState === 'disabled'
|
|
? 'text-muted-foreground font-medium'
|
|
: 'text-red-500 font-medium'
|
|
}
|
|
>
|
|
{boxState === 'ok'
|
|
? t('monitoring.connected')
|
|
: boxState === 'disabled'
|
|
? t('monitoring.disabled')
|
|
: t('monitoring.disconnected')}
|
|
</span>
|
|
</div>
|
|
{boxState === 'disabled' && (
|
|
<p className="text-muted-foreground text-xs">
|
|
{t('monitoring.boxDisabled')}
|
|
</p>
|
|
)}
|
|
{boxState === 'failed' && boxStatus?.connector_error && (
|
|
<p className="text-red-400 text-xs break-all">
|
|
{boxStatus.connector_error}
|
|
</p>
|
|
)}
|
|
{boxStatus && (
|
|
<div className="text-muted-foreground text-xs space-y-0.5">
|
|
{boxStatus.backend && (
|
|
<p>
|
|
{t('monitoring.boxBackend')}:{' '}
|
|
<span className="text-foreground font-mono">
|
|
{boxStatus.backend.name}
|
|
</span>
|
|
</p>
|
|
)}
|
|
<p>
|
|
{t('monitoring.boxProfile')}:{' '}
|
|
<span className="text-foreground font-mono">
|
|
{boxStatus.profile}
|
|
</span>
|
|
</p>
|
|
{boxOk && boxStatus.active_sessions !== undefined && (
|
|
<p>
|
|
{t('monitoring.boxSandboxes')}:{' '}
|
|
<span className="text-foreground font-mono">
|
|
{boxStatus.active_sessions}
|
|
</span>
|
|
</p>
|
|
)}
|
|
</div>
|
|
)}
|
|
|
|
{/* Active Sandboxes */}
|
|
{boxSessions.length > 0 && (
|
|
<div className="mt-3 space-y-2">
|
|
{boxSessions.map((session) => (
|
|
<div
|
|
key={session.session_id}
|
|
className="rounded-lg border p-3 space-y-2"
|
|
>
|
|
<div className="flex items-center gap-1.5 min-w-0">
|
|
<Container className="w-4 h-4 text-muted-foreground flex-shrink-0" />
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<span className="font-mono font-semibold text-foreground truncate text-sm">
|
|
{session.session_id}
|
|
</span>
|
|
</TooltipTrigger>
|
|
<TooltipContent>
|
|
{session.session_id}
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
</div>
|
|
<div className="grid grid-cols-2 gap-x-4 gap-y-1.5 text-xs">
|
|
<div className="flex items-center gap-1.5 text-muted-foreground min-w-0">
|
|
<Image className="w-3 h-3 flex-shrink-0" />
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<span className="text-foreground font-mono truncate">
|
|
{session.image}
|
|
</span>
|
|
</TooltipTrigger>
|
|
<TooltipContent>
|
|
{session.image}
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
</div>
|
|
<div className="flex items-center gap-1.5 text-muted-foreground">
|
|
<HardDrive className="w-3 h-3 flex-shrink-0" />
|
|
<span className="text-foreground">
|
|
{session.backend_name}
|
|
</span>
|
|
</div>
|
|
<div className="flex items-center gap-1.5 text-muted-foreground">
|
|
<Cpu className="w-3 h-3 flex-shrink-0" />
|
|
<span className="text-foreground">
|
|
{session.cpus} CPU / {session.memory_mb} MB
|
|
</span>
|
|
</div>
|
|
<div className="flex items-center gap-1.5 text-muted-foreground">
|
|
<Network className="w-3 h-3 flex-shrink-0" />
|
|
<span className="text-foreground">
|
|
{session.network}
|
|
</span>
|
|
</div>
|
|
{session.host_path && (
|
|
<div className="flex items-center gap-1.5 text-muted-foreground col-span-2 min-w-0">
|
|
<FolderOpen className="w-3 h-3 flex-shrink-0" />
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<span className="text-foreground font-mono truncate">
|
|
{session.host_path} :{' '}
|
|
{session.mount_path}{' '}
|
|
<span className="text-muted-foreground">
|
|
({session.host_path_mode})
|
|
</span>
|
|
</span>
|
|
</TooltipTrigger>
|
|
<TooltipContent>
|
|
{session.host_path} :{' '}
|
|
{session.mount_path} (
|
|
{session.host_path_mode})
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
</div>
|
|
)}
|
|
<div className="flex items-center gap-1.5 text-muted-foreground">
|
|
<Clock className="w-3 h-3 flex-shrink-0" />
|
|
<span>
|
|
{t('monitoring.boxSessionCreated')}:{' '}
|
|
<span className="text-foreground">
|
|
{new Date(
|
|
session.created_at,
|
|
).toLocaleString()}
|
|
</span>
|
|
</span>
|
|
</div>
|
|
<div className="flex items-center gap-1.5 text-muted-foreground">
|
|
<Clock className="w-3 h-3 flex-shrink-0" />
|
|
<span>
|
|
{t('monitoring.boxSessionLastUsed')}:{' '}
|
|
<span className="text-foreground">
|
|
{new Date(
|
|
session.last_used_at,
|
|
).toLocaleString()}
|
|
</span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</>
|
|
)}
|
|
</div>
|
|
</TooltipProvider>
|
|
</DialogContent>
|
|
</Dialog>
|
|
</>
|
|
);
|
|
}
|