wooo/awoooi
1
1
Fork 0
Code Issues 2 Pull Requests 1 Actions 2 Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/main' into codex/p0-obs-002-20260715

Browse Source
This commit is contained in:
ogt
2026-07-15 09:44:08 +08:00
parent 032be5f400 26c9ec829d
commit 227189cb91
93 changed files with 11421 additions and 519 deletions
Download Patch File Download Diff File Expand all files Collapse all files

175
apps/web/src/app/[locale]/automation/mcp/page.tsx
View File

@@ -42,6 +42,39 @@ interface Capability extends CapabilitySummary {
blockers: string[]
}
interface FederatedRuntimeReceipt {
product_id: string
canonical_repo: string
runtime_role: string
runtime_version: string
health_status: string
change_state: string
mcp: {
enabled: boolean
server_count: number
server_ids: string[]
caller_count: number
tool_count: number
}
rag: {
enabled: boolean
vector_store: string
embedding_model: string
embedding_dim: number
embedding_version_state: string
}
pixelrag: {
enabled: boolean
platform_count: number
platforms: string[]
visual_rag_stage: string
}
blockers: string[]
observed_at: string
received_at: string
fresh: boolean
}
interface ProductRow {
product_id: string
canonical_repo: string
@@ -54,6 +87,7 @@ interface ProductRow {
existing_capabilities?: CapabilitySummary[]
recommended_capabilities?: CapabilitySummary[]
blockers: string[]
federated_runtime_receipt?: FederatedRuntimeReceipt | null
}
interface RuntimeReadback {
@@ -110,6 +144,33 @@ interface RuntimeReadback {
}>
blockers?: string[]
}
federated_runtime?: {
status: string
controller_configured: boolean
controller_owner: string
source_id: string
interval_seconds: number
verified_fresh_receipt_count: number
expected_receipt_count: number
latest_run?: {
run_id: string
trace_id: string
work_item_id: string
trigger_kind: string
status: string
expected_product_count: number
received_product_count: number
verified_product_count: number
runtime_blocked_product_count: number
error_count: number
error_class?: string | null
started_at: string
ended_at?: string | null
fresh: boolean
} | null
receipts: FederatedRuntimeReceipt[]
blockers?: string[]
}
federated_product_runtime_receipt_count?: number
federated_product_runtime_receipt_expected?: number
}
@@ -128,6 +189,8 @@ interface Overview {
active_blocker_count: number
runtime_provider_count: number
runtime_tool_count: number
federated_product_runtime_receipt_count: number
federated_product_runtime_receipt_expected: number
}
architecture: {
decision: string
@@ -260,6 +323,8 @@ export default function McpControlPlanePage({ params }: { params: { locale: stri
const gateway = runtime?.gateway_audit_24h
const rag = runtime?.rag
const lifecycleRuntime = runtime?.version_lifecycle
const federationRuntime = runtime?.federated_runtime
const federationReceipts = federationRuntime?.receipts ?? []
const lifecycleObservationByCandidate = useMemo(
() => new Map(
(lifecycleRuntime?.observations ?? []).map(row => [row.candidate_id, row]),
@@ -323,10 +388,11 @@ export default function McpControlPlanePage({ params }: { params: { locale: stri
</div>
<StatusBadge value={overview.status} />
</div>
<div className="grid gap-3 sm:grid-cols-2 xl:grid-cols-6">
<div className="grid gap-3 sm:grid-cols-2 lg:grid-cols-4 xl:grid-cols-7">
<MetricCard label={t('metrics.products')} value={overview.summary.product_count} detail={t('metrics.productsDetail')} />
<MetricCard label={t('metrics.detected')} value={overview.summary.mcp_source_detected_product_count} detail={t('metrics.detectedDetail')} tone="ok" />
<MetricCard label={t('metrics.gaps')} value={overview.summary.mcp_source_gap_product_count} detail={t('metrics.gapsDetail')} tone="warn" />
<MetricCard label={t('metrics.federated')} value={`${overview.summary.federated_product_runtime_receipt_count}/${overview.summary.federated_product_runtime_receipt_expected}`} detail={t('metrics.federatedDetail')} tone={overview.summary.federated_product_runtime_receipt_count > 0 ? 'warn' : 'danger'} />
<MetricCard label={t('metrics.providers')} value={overview.summary.runtime_provider_count} detail={t('metrics.providersDetail', { tools: overview.summary.runtime_tool_count })} tone={runtime?.status === 'ready' ? 'ok' : 'warn'} />
<MetricCard label={t('metrics.external')} value={overview.summary.external_candidate_count} detail={t('metrics.externalDetail', { ready: overview.summary.external_promotion_ready_count })} tone="warn" />
<MetricCard label={t('metrics.blockers')} value={overview.summary.active_blocker_count} detail={t('metrics.blockersDetail')} tone="danger" />
@@ -386,6 +452,107 @@ export default function McpControlPlanePage({ params }: { params: { locale: stri
</article>
</section>
<section className="rounded-2xl border border-[#bfd8ca] bg-[#f4faf6] p-4 sm:p-5" aria-labelledby="federation-title">
<div className="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between">
<div className="flex items-start gap-3">
<Network className="mt-0.5 h-5 w-5 shrink-0 text-[#2f7d54]" aria-hidden="true" />
<div>
<h2 id="federation-title" className="text-lg font-bold">{t('federation.title')}</h2>
<p className="mt-1 max-w-4xl text-sm leading-6 text-[#627168]">{t('federation.subtitle')}</p>
</div>
</div>
<StatusBadge value={federationRuntime?.status ?? 'pending_first_run'} />
</div>
<div className="mt-4 grid gap-3 sm:grid-cols-3">
<div className="rounded-xl border border-[#d5e5da] bg-white p-3">
<p className="text-[11px] font-semibold text-[#6c7e71]">{t('federation.verified')}</p>
<p className="mt-1 text-2xl font-bold text-[#285a37]">
{federationRuntime?.verified_fresh_receipt_count ?? 0}/{federationRuntime?.expected_receipt_count ?? 2}
</p>
</div>
<div className="rounded-xl border border-[#d5e5da] bg-white p-3">
<p className="text-[11px] font-semibold text-[#6c7e71]">{t('federation.runtimeBlocked')}</p>
<p className="mt-1 text-2xl font-bold text-[#8b5e18]">{federationRuntime?.latest_run?.runtime_blocked_product_count ?? 0}</p>
</div>
<div className="rounded-xl border border-[#d5e5da] bg-white p-3">
<p className="text-[11px] font-semibold text-[#6c7e71]">{t('federation.cadence')}</p>
<p className="mt-1 text-2xl font-bold text-[#285a37]">{Math.round((federationRuntime?.interval_seconds ?? 21600) / 3600)}h</p>
</div>
</div>
{federationRuntime?.latest_run ? (
<div className="mt-3 rounded-xl border border-[#d5e5da] bg-white/80 p-3 text-xs text-[#5d6d62]">
<div className="flex flex-wrap items-center justify-between gap-2">
<span className="font-bold text-[#315e3e]">{t('federation.latestRun')}</span>
<StatusBadge value={federationRuntime.latest_run.status} />
</div>
<p className="mt-2 break-all font-mono text-[10px]">
{federationRuntime.latest_run.work_item_id} · {federationRuntime.latest_run.run_id}
</p>
</div>
) : null}
{federationReceipts.length > 0 ? (
<div className="mt-4 grid gap-4 lg:grid-cols-2">
{federationReceipts.map(receipt => (
<article key={receipt.product_id} className="min-w-0 rounded-xl border border-[#cfe0d4] bg-white p-4" data-testid={`mcp-federation-${receipt.product_id}`}>
<div className="flex flex-wrap items-start justify-between gap-2">
<div className="min-w-0">
<h3 className="font-bold">{receipt.product_id}</h3>
<p className="mt-1 truncate font-mono text-[10px] text-[#7b857e]">{receipt.canonical_repo} · {receipt.runtime_version}</p>
</div>
<StatusBadge value={receipt.health_status} />
</div>
<dl className="mt-4 grid gap-3 sm:grid-cols-3">
<div className="rounded-lg bg-[#f4f8f5] p-3">
<dt className="text-[10px] font-semibold text-[#708077]">{t('federation.mcpInventory')}</dt>
<dd className="mt-1 text-lg font-bold">{receipt.mcp.server_count} / {receipt.mcp.tool_count}</dd>
<p className="text-[10px] text-[#708077]">{t('federation.serversTools')}</p>
</div>
<div className="rounded-lg bg-[#f4f8f5] p-3">
<dt className="text-[10px] font-semibold text-[#708077]">{t('federation.rag')}</dt>
<dd className="mt-1 break-all text-xs font-bold">{receipt.rag.embedding_model || '—'}</dd>
<p className="mt-1 text-[10px] text-[#708077]">{receipt.rag.vector_store} · {receipt.rag.embedding_dim}</p>
</div>
<div className="rounded-lg bg-[#f4f8f5] p-3">
<dt className="text-[10px] font-semibold text-[#708077]">{t('federation.pixelrag')}</dt>
<dd className="mt-1 text-lg font-bold">{receipt.pixelrag.platform_count}</dd>
<p className="text-[10px] text-[#708077]">{receipt.pixelrag.visual_rag_stage.replaceAll('_', ' ')}</p>
</div>
</dl>
<div className="mt-3">
<p className="text-[10px] font-bold uppercase tracking-wide text-[#708077]">{t('federation.serverIds')}</p>
<div className="mt-2 flex flex-wrap gap-1.5">
{receipt.mcp.server_ids.map(serverId => (
<span key={serverId} className="rounded-full border border-[#d5e5da] bg-[#f7fbf8] px-2 py-1 font-mono text-[10px] text-[#315e3e]">{serverId}</span>
))}
</div>
</div>
<div className="mt-3">
<p className="text-[10px] font-bold uppercase tracking-wide text-[#708077]">{t('federation.blockers')}</p>
{receipt.blockers.length > 0 ? (
<ul className="mt-2 space-y-1 text-xs leading-5 text-[#80551b]">
{receipt.blockers.map(blocker => <li key={blocker}>• {blocker.replaceAll('_', ' ')}</li>)}
</ul>
) : (
<p className="mt-2 text-xs text-[#2f7d54]">{t('federation.noBlockers')}</p>
)}
</div>
<p className="mt-3 text-[10px] text-[#7b857e]">
{t('federation.observed', { value: receipt.observed_at })} · {receipt.fresh ? t('federation.fresh') : t('federation.stale')}
</p>
</article>
))}
</div>
) : (
<p role="status" className="mt-4 rounded-xl border border-[#d5e5da] bg-white p-4 text-sm text-[#6b786f]">
{t('federation.pending')}
</p>
)}
<p className="mt-4 text-xs leading-5 text-[#627168]">{t('federation.boundary')}</p>
</section>
<section className="rounded-2xl border border-[#dedbd1] bg-white p-4 sm:p-5" aria-labelledby="product-matrix-title">
<div className="flex flex-col gap-4 lg:flex-row lg:items-end lg:justify-between">
<div>
@@ -427,6 +594,12 @@ export default function McpControlPlanePage({ params }: { params: { locale: stri
{t('products.source', { value: product.source_control_status })}
</span>
</div>
{product.federated_runtime_receipt ? (
<div className="mt-3 rounded-lg border border-[#cfe0d4] bg-[#f4faf6] p-2.5 text-[11px] text-[#315e3e]">
<span className="font-bold">{t('products.federationReceipt')}</span>{' '}
{product.federated_runtime_receipt.runtime_version} · {product.federated_runtime_receipt.mcp.server_count} MCP / {product.federated_runtime_receipt.mcp.tool_count} tools
</div>
) : null}
<dl className="mt-4 grid grid-cols-3 gap-2 text-center">
<div className="rounded-lg bg-white p-2"><dt className="text-[10px] text-[#77736a]">{t('products.existing')}</dt><dd className="mt-1 font-bold">{product.existing_capability_ids.length}</dd></div>
<div className="rounded-lg bg-white p-2"><dt className="text-[10px] text-[#77736a]">{t('products.recommended')}</dt><dd className="mt-1 font-bold">{product.recommended_capability_ids.length}</dd></div>

7
apps/web/src/app/[locale]/awooop/work-items/page.tsx
View File

@@ -12456,6 +12456,7 @@ function AssetCapabilityMatrixPanel({
}) {
const t = useTranslations("awooop.workItems.assetCapabilityMatrix");
const matrix = priority?.ai_automation_asset_capability_matrix;
const isLoading = loading && !matrix;
const summary = matrix?.summary;
const assets = matrix?.assets ?? [];
const scopeRollups = matrix?.scope_rollups ?? [];
@@ -12529,7 +12530,7 @@ function AssetCapabilityMatrixPanel({
) : (
<TriangleAlert className="h-4 w-4" aria-hidden="true" />
)}
{loading ? "--" : matrix?.closed ? t("closed") : t("open")}
{isLoading ? "--" : matrix?.closed ? t("closed") : t("open")}
</div>
</div>
@@ -12561,7 +12562,7 @@ function AssetCapabilityMatrixPanel({
{metric.label}
</div>
<div className="mt-1 font-mono text-xl font-semibold text-[#141413]">
{loading ? "--" : metric.value ?? 0}
{isLoading ? "--" : metric.value ?? 0}
</div>
</div>
))}
@@ -12685,7 +12686,7 @@ function AssetCapabilityMatrixPanel({
})}
</div>
))}
{!loading && filteredAssets.length === 0 ? (
{!isLoading && filteredAssets.length === 0 ? (
<div className="bg-white px-4 py-8 text-center text-xs text-[#77736a]">
{t("empty")}
</div>

251
apps/web/src/app/[locale]/notifications/page.tsx
View File

@@ -14,9 +14,12 @@ import {
Bell,
BellOff,
CheckCircle2,
LockKeyhole,
MessageSquare,
RefreshCw,
Route,
Send,
ShieldCheck,
Slack,
XCircle,
} from 'lucide-react'
@@ -30,6 +33,59 @@ interface Channel {
status: string
}
interface TelegramRouteProduct {
product_id: string
display_name: string
owner: string
source_audit_status: string
egress_status: string
}
interface TelegramRouteItem {
route_id: string
product_id: string
signal_family: string
severity: string[]
bot_alias: string
chat_alias: string
receipt_backend: string
egress_status: string
decision: 'allow' | 'block'
decision_reason: string
}
interface TelegramDestinationRole {
visible_label: string
chat_alias: string
bot_alias: string
bot_owner: string
monitoring_owner: boolean
role: string
monitoring_egress_policy: string
}
interface TelegramRoutingReadback {
status: string
source_status: string
source_generated_at: string
runtime_generated_at: string
runtime_enforcement: {
canonical_resolver_active: boolean
gateway_pre_send_gate_active: boolean
unknown_route_decision: string
all_product_delivery_receipts_ready: boolean
}
rollups: {
product_count: number
route_count: number
runtime_allowed_route_count: number
runtime_blocked_route_count: number
}
destination_roles: TelegramDestinationRole[]
products: TelegramRouteProduct[]
routes: TelegramRouteItem[]
}
const STATUS_CFG: Record<string, { badge: string; dot: string; dotPulse?: string; icon: typeof CheckCircle2; label: string }> = {
active: { badge: 'bg-[#f0faf2] border-[#8fc29a] text-[#17602a]', dot: 'bg-[#22C55E]', dotPulse: 'animate-pulse', icon: CheckCircle2, label: 'Active' },
enabled: { badge: 'bg-[#f0faf2] border-[#8fc29a] text-[#17602a]', dot: 'bg-[#22C55E]', icon: CheckCircle2, label: 'Enabled' },
@@ -51,17 +107,33 @@ export default function NotificationsPage({ params }: { params: { locale: string
const tc = useTranslations('common')
const [channels, setChannels] = useState<Channel[]>([])
const [loading, setLoading] = useState(true)
const [routing, setRouting] = useState<TelegramRoutingReadback | null>(null)
const [routingLoading, setRoutingLoading] = useState(true)
const [routingError, setRoutingError] = useState(false)
const fetchData = () => {
setLoading(true)
fetch(`${API_BASE}/api/v1/notifications/channels`)
.then(r => {
if (!r.ok) throw new Error('not found')
return r.json()
})
.then(data => { setChannels(Array.isArray(data) ? data : (data?.channels ?? [])) })
.catch(() => { setChannels([]) })
.finally(() => setLoading(false))
setRoutingLoading(true)
setRoutingError(false)
void Promise.allSettled([
fetch(`${API_BASE}/api/v1/notifications/channels`).then(async response => {
if (!response.ok) throw new Error('channels unavailable')
const data = await response.json()
setChannels(Array.isArray(data) ? data : (data?.channels ?? []))
}),
fetch(`${API_BASE}/api/v1/agents/telegram-canonical-routing-runtime-readback`).then(async response => {
if (!response.ok) throw new Error('routing unavailable')
setRouting(await response.json() as TelegramRoutingReadback)
}),
]).then(results => {
if (results[0].status === 'rejected') setChannels([])
if (results[1].status === 'rejected') {
setRouting(null)
setRoutingError(true)
}
setLoading(false)
setRoutingLoading(false)
})
}
useEffect(() => { fetchData() }, []) // eslint-disable-line react-hooks/exhaustive-deps
@@ -72,13 +144,13 @@ export default function NotificationsPage({ params }: { params: { locale: string
return (
<AppLayout locale={params.locale}>
<main className="min-h-[calc(100vh-68px)] bg-[#f5f4ed] p-5 lg:p-6">
<div className="mx-auto max-w-3xl">
<div className="mx-auto max-w-6xl">
{/* Header */}
<div className="mb-6 flex items-start justify-between gap-3">
<div>
<p className="text-[11px] font-semibold uppercase tracking-wider text-[#77736a]">
Alerting
{t('eyebrow')}
</p>
<h1 className="mt-1 text-2xl font-bold text-[#141413]">{t('title')}</h1>
<p className="mt-1 text-sm text-[#77736a]">{t('subtitle')}</p>
@@ -93,12 +165,167 @@ export default function NotificationsPage({ params }: { params: { locale: string
</button>
</div>
{/* Canonical Telegram routing cockpit */}
<section
data-testid="telegram-routing-cockpit"
className="mb-5 overflow-hidden rounded-2xl border border-[#e0ddd4] bg-white"
>
<div className="flex flex-wrap items-center justify-between gap-3 border-b border-[#e0ddd4] bg-[#faf9f3] px-5 py-4">
<div className="min-w-0">
<div className="flex items-center gap-2">
<Route className="h-4 w-4 shrink-0 text-[#d97757]" aria-hidden="true" />
<h2 className="font-semibold text-[#141413]">{t('routing.title')}</h2>
</div>
<p className="mt-1 text-xs text-[#77736a]">
{t('routing.subtitle')}
</p>
</div>
{routing?.runtime_enforcement.gateway_pre_send_gate_active && (
<span className="inline-flex items-center gap-1.5 rounded-full border border-[#8fc29a] bg-[#f0faf2] px-3 py-1 text-[10px] font-bold uppercase text-[#17602a]">
<ShieldCheck className="h-3 w-3" aria-hidden="true" />
{t('routing.gateActive')}
</span>
)}
</div>
{routingLoading && (
<div className="grid animate-pulse grid-cols-2 gap-3 p-5 lg:grid-cols-4">
{[0, 1, 2, 3].map(item => <div key={item} className="h-20 rounded-xl bg-[#f5f4ed]" />)}
</div>
)}
{!routingLoading && routingError && (
<div className="flex items-start gap-3 bg-[#fff7e8] px-5 py-4 text-sm text-[#8a5a08]">
<LockKeyhole className="mt-0.5 h-4 w-4 shrink-0" aria-hidden="true" />
<p>{t('routing.unavailable')}</p>
</div>
)}
{!routingLoading && routing && (
<div className="space-y-5 p-5">
<div className="grid grid-cols-2 gap-3 lg:grid-cols-4">
{[
{ key: 'products', label: t('routing.metrics.products'), value: routing.rollups.product_count, tone: 'text-[#141413]' },
{ key: 'routes', label: t('routing.metrics.routes'), value: routing.rollups.route_count, tone: 'text-[#141413]' },
{ key: 'allowed', label: t('routing.metrics.allowed'), value: routing.rollups.runtime_allowed_route_count, tone: 'text-[#17602a]' },
{ key: 'blocked', label: t('routing.metrics.blocked'), value: routing.rollups.runtime_blocked_route_count, tone: 'text-[#9f2f25]' },
].map(({ key, label, value, tone }) => (
<div key={key} className="min-w-0 rounded-xl border border-[#e0ddd4] bg-[#faf9f3] p-4">
<p className="text-xs text-[#77736a]">{label}</p>
<p className={cn('mt-1 font-mono text-2xl font-bold', tone)}>{value}</p>
</div>
))}
</div>
<div className="rounded-xl border border-[#8fc29a] bg-[#f0faf2] p-4 text-sm text-[#17602a]">
<p className="font-semibold">{t('routing.sharedTitle')}</p>
<p className="mt-1 text-xs leading-5">
{t('routing.sharedDetail')}
</p>
</div>
<details className="rounded-xl border border-[#e0ddd4] bg-white">
<summary className="cursor-pointer list-none px-4 py-3 font-semibold text-[#141413]">
{t('routing.rolesSummary', { count: routing.destination_roles.length })}
</summary>
<div className="grid gap-3 border-t border-[#e0ddd4] p-4 md:grid-cols-2">
{routing.destination_roles.map(role => (
<div key={`${role.visible_label}-${role.bot_alias}`} className="min-w-0 rounded-xl bg-[#faf9f3] p-3">
<div className="flex items-center justify-between gap-2">
<p className="truncate font-semibold text-[#141413]">{role.visible_label}</p>
<span className={cn(
'shrink-0 rounded-full border px-2 py-0.5 text-[10px] font-bold',
role.monitoring_owner
? 'border-[#8fc29a] bg-[#f0faf2] text-[#17602a]'
: 'border-[#e0ddd4] bg-white text-[#77736a]',
)}>
{role.monitoring_owner ? t('routing.monitoringOwner') : t('routing.nonMonitoringOwner')}
</span>
</div>
<p className="mt-1 break-words font-mono text-[11px] text-[#77736a]">
{role.bot_alias} → {role.chat_alias}
</p>
<p className="mt-2 text-xs leading-5 text-[#4f4d47]">{role.role}</p>
</div>
))}
</div>
</details>
<details className="rounded-xl border border-[#e0ddd4] bg-white">
<summary className="cursor-pointer list-none px-4 py-3 font-semibold text-[#141413]">
{t('routing.routesSummary', {
products: routing.products.length,
routes: routing.routes.length,
})}
</summary>
<div className="grid gap-3 border-t border-[#e0ddd4] p-4 lg:grid-cols-2">
{routing.products.map(product => {
const productRoutes = routing.routes.filter(route => route.product_id === product.product_id)
return (
<article key={product.product_id} className="min-w-0 rounded-xl border border-[#e0ddd4] p-4">
<div className="flex flex-wrap items-start justify-between gap-2">
<div className="min-w-0">
<p className="font-semibold text-[#141413]">{product.display_name}</p>
<p className="mt-0.5 break-words font-mono text-[11px] text-[#77736a]">{product.product_id}</p>
</div>
<span className={cn(
'rounded-full border px-2 py-0.5 text-[10px] font-bold uppercase',
product.egress_status === 'allowed'
? 'border-[#8fc29a] bg-[#f0faf2] text-[#17602a]'
: 'border-[#f5b8b8] bg-[#fff0ed] text-[#9f2f25]',
)}>
{product.egress_status}
</span>
</div>
<div className="mt-3 space-y-2">
{productRoutes.map(route => (
<div key={route.route_id} className="rounded-lg bg-[#faf9f3] p-3">
<div className="flex flex-wrap items-center justify-between gap-2">
<p className="break-words text-xs font-semibold text-[#141413]">{route.signal_family}</p>
<span className={cn(
'rounded-full px-2 py-0.5 text-[10px] font-bold',
route.decision === 'allow'
? 'bg-[#f0faf2] text-[#17602a]'
: 'bg-[#fff0ed] text-[#9f2f25]',
)}>
{route.decision === 'allow' ? t('routing.allow') : t('routing.noSend')}
</span>
</div>
<p className="mt-1 break-words font-mono text-[10px] text-[#77736a]">
{route.severity.join('/')} · {route.bot_alias} → {route.chat_alias}
</p>
<p className="mt-1 break-words text-[11px] leading-4 text-[#77736a]">{route.decision_reason}</p>
</div>
))}
</div>
</article>
)
})}
</div>
</details>
<p className="break-words font-mono text-[10px] text-[#77736a]">
{t('routing.footer', { runtime: routing.status, source: routing.source_status })}
</p>
<p className="text-[10px] text-[#77736a]">
{t('routing.generatedAt', {
time: new Intl.DateTimeFormat(params.locale, {
dateStyle: 'medium',
timeStyle: 'medium',
timeZone: 'Asia/Taipei',
}).format(new Date(routing.runtime_generated_at)),
})}
</p>
</div>
)}
</section>
{/* Summary */}
{!loading && channels.length > 0 && (
<div className="mb-4 grid grid-cols-2 gap-3">
<div className="flex flex-col items-center rounded-xl border border-[#8fc29a] bg-[#f0faf2] p-4">
<span className="font-mono text-3xl font-bold text-[#17602a]">{activeCount}</span>
<span className="mt-1 text-xs text-[#77736a]">Active Channels</span>
<span className="mt-1 text-xs text-[#77736a]">{t('activeChannels')}</span>
</div>
<div className={cn(
'flex flex-col items-center rounded-xl border p-4',
@@ -107,7 +334,7 @@ export default function NotificationsPage({ params }: { params: { locale: string
<span className={cn('font-mono text-3xl font-bold', errorCount > 0 ? 'text-[#9f2f25]' : 'text-[#77736a]')}>
{errorCount}
</span>
<span className="mt-1 text-xs text-[#77736a]">Errors</span>
<span className="mt-1 text-xs text-[#77736a]">{t('errors')}</span>
</div>
</div>
)}