ake/paperclip
1
0
Fork 0
mirror of https://github.com/alkimake/paperclip.git synced 2026-06-16 10:50:38 +09:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #1380 from DanielSousa/feature/change-reports-to

Browse source 
feat(ui): edit and hire with Reports to picker
This commit is contained in:
Dotta 2026-03-23 15:08:54 -05:00 • committed by GitHub
commit 3a79d94050
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 163 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

12
ui/src/pages/AgentDetail.tsx
View file

@ -18,6 +18,7 @@ import { issuesApi } from "../api/issues";
import { usePanel } from "../context/PanelContext";
import { useSidebar } from "../context/SidebarContext";
import { useCompany } from "../context/CompanyContext";
import { useToast } from "../context/ToastContext";
import { useDialog } from "../context/DialogContext";
import { useBreadcrumbs } from "../context/BreadcrumbContext";
import { queryKeys } from "../lib/queryKeys";
@ -1420,6 +1421,7 @@ function ConfigurationTab({
hideInstructionsFile?: boolean;
}) {
const queryClient = useQueryClient();
const { pushToast } = useToast();
const [awaitingRefreshAfterSave, setAwaitingRefreshAfterSave] = useState(false);
const lastAgentRef = useRef(agent);
@ -1441,9 +1443,17 @@ function ConfigurationTab({
queryClient.invalidateQueries({ queryKey: queryKeys.agents.detail(agent.id) });
queryClient.invalidateQueries({ queryKey: queryKeys.agents.detail(agent.urlKey) });
queryClient.invalidateQueries({ queryKey: queryKeys.agents.configRevisions(agent.id) });
queryClient.invalidateQueries({ queryKey: queryKeys.agents.list(agent.companyId) });
},
onError: () => {
onError: (err) => {
setAwaitingRefreshAfterSave(false);
const message =
err instanceof ApiError
? err.message
: err instanceof Error
? err.message
: "Could not save agent";
pushToast({ title: "Save failed", body: message, tone: "error" });
},
});

62
ui/src/pages/NewAgent.tsx
View file

@ -14,13 +14,13 @@ import {
PopoverContent,
PopoverTrigger,
} from "@/components/ui/popover";
import { Shield, User } from "lucide-react";
import { Shield } from "lucide-react";
import { cn, agentUrl } from "../lib/utils";
import { roleLabels } from "../components/agent-config-primitives";
import { AgentConfigForm, type CreateConfigValues } from "../components/AgentConfigForm";
import { defaultCreateValues } from "../components/agent-config-defaults";
import { getUIAdapter } from "../adapters";
import { AgentIcon } from "../components/AgentIconPicker";
import { ReportsToPicker } from "../components/ReportsToPicker";
import {
DEFAULT_CODEX_LOCAL_BYPASS_APPROVALS_AND_SANDBOX,
DEFAULT_CODEX_LOCAL_MODEL,
@ -68,11 +68,10 @@ export function NewAgent() {
const [name, setName] = useState("");
const [title, setTitle] = useState("");
const [role, setRole] = useState("general");
const [reportsTo, setReportsTo] = useState("");
const [reportsTo, setReportsTo] = useState<string | null>(null);
const [configValues, setConfigValues] = useState<CreateConfigValues>(defaultCreateValues);
const [selectedSkillKeys, setSelectedSkillKeys] = useState<string[]>([]);
const [roleOpen, setRoleOpen] = useState(false);
const [reportsToOpen, setReportsToOpen] = useState(false);
const [formError, setFormError] = useState<string | null>(null);
const { data: agents } = useQuery({
@ -199,7 +198,6 @@ export function NewAgent() {
});
}
const currentReportsTo = (agents ?? []).find((a) => a.id === reportsTo);
const availableSkills = (companySkills ?? []).filter((skill) => !skill.key.startsWith("paperclipai/paperclip/"));
function toggleSkill(key: string, checked: boolean) {
@ -273,54 +271,12 @@ export function NewAgent() {
</PopoverContent>
</Popover>
<Popover open={reportsToOpen} onOpenChange={setReportsToOpen}>
<PopoverTrigger asChild>
<button
className={cn(
"inline-flex items-center gap-1.5 rounded-md border border-border px-2 py-1 text-xs hover:bg-accent/50 transition-colors",
isFirstAgent && "opacity-60 cursor-not-allowed"
)}
disabled={isFirstAgent}
>
{currentReportsTo ? (
<>
<AgentIcon icon={currentReportsTo.icon} className="h-3 w-3 text-muted-foreground" />
{`Reports to ${currentReportsTo.name}`}
</>
) : (
<>
<User className="h-3 w-3 text-muted-foreground" />
{isFirstAgent ? "Reports to: N/A (CEO)" : "Reports to..."}
</>
)}
</button>
</PopoverTrigger>
<PopoverContent className="w-48 p-1" align="start">
<button
className={cn(
"flex items-center gap-2 w-full px-2 py-1.5 text-xs rounded hover:bg-accent/50",
!reportsTo && "bg-accent"
)}
onClick={() => { setReportsTo(""); setReportsToOpen(false); }}
>
No manager
</button>
{(agents ?? []).map((a) => (
<button
key={a.id}
className={cn(
"flex items-center gap-2 w-full px-2 py-1.5 text-xs rounded hover:bg-accent/50 truncate",
a.id === reportsTo && "bg-accent"
)}
onClick={() => { setReportsTo(a.id); setReportsToOpen(false); }}
>
<AgentIcon icon={a.icon} className="shrink-0 h-3 w-3 text-muted-foreground" />
{a.name}
<span className="text-muted-foreground ml-auto">{roleLabels[a.role] ?? a.role}</span>
</button>
))}
</PopoverContent>
</Popover>
<ReportsToPicker
agents={agents ?? []}
value={reportsTo}
onChange={setReportsTo}
disabled={isFirstAgent}
/>
</div>
{/* Shared config form */}