fix: show bridge in agents page, replace capabilities with labels

This commit is contained in:
Markov 2026-03-15 14:14:30 +01:00
parent c00a3ea1f1
commit 503bb1379a

View File

@ -12,7 +12,7 @@ export default function AgentsPage() {
const load = async () => { const load = async () => {
try { try {
const members = await getMembers(); const members = await getMembers();
setAgents(members.filter((m) => m.type === "agent")); setAgents(members.filter((m) => m.type === "agent" || m.type === "bridge"));
} finally { } finally {
setLoading(false); setLoading(false);
} }
@ -22,6 +22,11 @@ export default function AgentsPage() {
load(); load();
}, []); }, []);
const typeIcon = (type: string) => {
if (type === "bridge") return { bg: "bg-purple-500/20", text: "text-purple-400", icon: "🔗" };
return { bg: "bg-blue-500/20", text: "text-blue-400", icon: "🤖" };
};
return ( return (
<div className="p-6"> <div className="p-6">
<div className="flex items-center justify-between mb-6"> <div className="flex items-center justify-between mb-6">
@ -40,14 +45,19 @@ export default function AgentsPage() {
<div className="text-[var(--muted)] text-sm">Нет агентов</div> <div className="text-[var(--muted)] text-sm">Нет агентов</div>
) : ( ) : (
<div className="grid gap-4 grid-cols-1 md:grid-cols-2 lg:grid-cols-3"> <div className="grid gap-4 grid-cols-1 md:grid-cols-2 lg:grid-cols-3">
{agents.map((agent) => ( {agents.map((agent) => {
const ti = typeIcon(agent.type);
return (
<div <div
key={agent.id} key={agent.id}
onClick={() => setSelected(agent)} onClick={() => setSelected(agent)}
className="bg-[var(--card)] border border-[var(--border)] rounded-xl p-4 cursor-pointer hover:border-[var(--accent)]/50 transition-colors" className="bg-[var(--card)] border border-[var(--border)] rounded-xl p-4 cursor-pointer hover:border-[var(--accent)]/50 transition-colors"
> >
<div className="flex items-center justify-between mb-2"> <div className="flex items-center justify-between mb-2">
<div className="flex items-center gap-2">
<span>{ti.icon}</span>
<h3 className="font-semibold">{agent.name}</h3> <h3 className="font-semibold">{agent.name}</h3>
</div>
<span <span
className={`text-xs px-2 py-0.5 rounded-full ${ className={`text-xs px-2 py-0.5 rounded-full ${
agent.status === "online" agent.status === "online"
@ -58,27 +68,33 @@ export default function AgentsPage() {
{agent.status === "online" ? "online" : "offline"} {agent.status === "online" ? "online" : "offline"}
</span> </span>
</div> </div>
<div className="text-xs text-[var(--muted)] mb-3">@{agent.slug}</div> <div className="text-xs text-[var(--muted)] mb-3">
@{agent.slug} {agent.type}
</div>
{agent.agent_config?.capabilities && agent.agent_config.capabilities.length > 0 && ( {agent.agent_config?.labels && agent.agent_config.labels.length > 0 && (
<div className="flex flex-wrap gap-1 mb-3"> <div className="flex flex-wrap gap-1 mb-3">
{agent.agent_config.capabilities.map((cap) => ( {agent.agent_config.labels.map((label) => (
<span <span
key={cap} key={label}
className="text-xs px-2 py-0.5 bg-[var(--accent)]/10 text-[var(--accent)] rounded" className="text-xs px-2 py-0.5 bg-[var(--accent)]/10 text-[var(--accent)] rounded"
> >
{cap} {label}
</span> </span>
))} ))}
</div> </div>
)} )}
<div className="text-xs text-[var(--muted)] space-y-1"> <div className="text-xs text-[var(--muted)] space-y-1">
<div>💬 chat: {agent.agent_config?.chat_listen || "—"}</div> <div>💬 чат: {agent.agent_config?.chat_listen || "—"}</div>
<div>📋 tasks: {agent.agent_config?.task_listen || "—"}</div> <div>📋 задачи: {agent.agent_config?.task_listen || "—"}</div>
{agent.agent_config?.mentionable === false && (
<div>🚫 не упоминаемый</div>
)}
</div> </div>
</div> </div>
))} );
})}
</div> </div>
)} )}