aevgarik/paperclip
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #263 from mvanhorn/feat/180-agent-role-labels

Browse Source 
feat(ui): show human-readable role labels in agent list and properties
This commit is contained in:
Dotta
2026-03-07 21:19:58 -06:00
committed by GitHub
parent f5190f28d1 2639184f46
commit 4c630bc66e
6 changed files with 26 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
ui/src/components/AgentProperties.tsx
View File

@@ -1,6 +1,6 @@
import { useQuery } from "@tanstack/react-query";
import { Link } from "@/lib/router";
import type { Agent, AgentRuntimeState } from "@paperclipai/shared";
import { AGENT_ROLE_LABELS, type Agent, type AgentRuntimeState } from "@paperclipai/shared";
import { agentsApi } from "../api/agents";
import { useCompany } from "../context/CompanyContext";
import { queryKeys } from "../lib/queryKeys";
@@ -24,6 +24,8 @@ const adapterLabels: Record<string, string> = {
http: "HTTP",
};
const roleLabels = AGENT_ROLE_LABELS as Record<string, string>;
function PropertyRow({ label, children }: { label: string; children: React.ReactNode }) {
return (
<div className="flex items-center gap-3 py-1.5">
@@ -51,7 +53,7 @@ export function AgentProperties({ agent, runtimeState }: AgentPropertiesProps) {
<StatusBadge status={agent.status} />
</PropertyRow>
<PropertyRow label="Role">
<span className="text-sm">{agent.role}</span>
<span className="text-sm">{roleLabels[agent.role] ?? agent.role}</span>
</PropertyRow>
{agent.title && (
<PropertyRow label="Title">

7
ui/src/components/agent-config-primitives.tsx
View File

@@ -15,6 +15,7 @@ import {
import { Button } from "@/components/ui/button";
import { HelpCircle, ChevronDown, ChevronRight } from "lucide-react";
import { cn } from "../lib/utils";
import { AGENT_ROLE_LABELS } from "@paperclipai/shared";
/* ---- Help text for (?) tooltips ---- */
export const help: Record<string, string> = {
@@ -59,11 +60,7 @@ export const adapterLabels: Record<string, string> = {
http: "HTTP",
};
export const roleLabels: Record<string, string> = {
ceo: "CEO", cto: "CTO", cmo: "CMO", cfo: "CFO",
engineer: "Engineer", designer: "Designer", pm: "PM",
qa: "QA", devops: "DevOps", researcher: "Researcher", general: "General",
};
export const roleLabels = AGENT_ROLE_LABELS as Record<string, string>;
/* ---- Primitive components ---- */