Fix agent detail URL after agent rename (#9340)
## Thinking Path > - Paperclip is the open source app people use to manage AI agents for work. > - The agent detail page uses route references that can be based on an agent's URL key. > - Renaming an agent can change that URL key while the browser is still on the old route. > - After save or rollback, refetching the stale route reference can render an "Agent not found" state even though the agent still exists. > - This pull request redirects the detail page to the updated canonical route when the saved agent's route reference changes. > - The benefit is that agent renames keep users on the same configuration workflow without landing on a stale URL. ## Linked Issues or Issue Description - Refs #1848 - Related public search performed for agent rename/not-found issues and PRs; no closer in-flight PR was found. - Bug context: after saving a renamed agent or rolling back to a revision with a different name-derived URL key, the agent detail page could continue using the old URL and show "Agent not found". ## What Changed - Added a small route-sync helper that compares the previous and updated agent route refs after mutations. - Redirects the agent detail page with `replace: true` when a save or rollback changes the canonical route ref. - Removes the stale detail-query cache entry so the old route reference is not refetched after a rename. ## Verification - Local outgoing patch scan for common secrets, private paths/emails, and internal issue/link references: no matches. - `corepack pnpm install --frozen-lockfile` - `corepack pnpm --dir ui run typecheck` - `corepack pnpm --dir ui exec vitest run src/pages/AgentDetail.progress.test.ts src/App.test.tsx` - `corepack pnpm check:token-gates` ## Risks - Low risk: the redirect only runs when the updated agent resolves to a different route ref than the current agent. - If a future mutation response omits both URL key and name, the existing route-ref fallback behavior still applies. ## Model Used OpenAI Codex, GPT-5 coding agent via the local Codex adapter, with tool-assisted repository inspection, shell execution, and GitHub API use. ## Checklist - [x] I have included a thinking path that traces from project context to this change - [x] I have specified the model used (with version and capability details) - [x] I have checked ROADMAP.md and confirmed this PR does not duplicate planned core work - [x] I have searched GitHub for duplicate or related PRs and linked them above - [x] I have either (a) linked existing issues with `Fixes: #` / `Closes #` / `Refs #` OR (b) described the issue in-PR following the relevant issue template - [x] I have not referenced internal/instance-local Paperclip issues or links (only public GitHub `#NNN` / `github.com/paperclipai/paperclip` URLs) - [x] My branch name describes the change (e.g. `docs/...`, `fix/...`) and contains no internal Paperclip ticket id or instance-derived details - [x] I have run tests locally and they pass - [x] I have added or updated tests where applicable - [x] I have updated relevant documentation to reflect my changes - [x] I have considered and documented any risks above - [ ] All Paperclip CI gates are green - [ ] Greptile is 5/5 with no open P2s, recommendations, or follow-ups - [x] I will address all Greptile and reviewer comments before requesting merge --------- Co-authored-by: Claude <noreply@paperclip.ing>
This commit is contained in:
Devin Foley
GitHub
parent
17dde9d3f2
commit
d1f6a6850a
|
|
@ -1,8 +1,11 @@
|
|||
import { describe, expect, it } from "vitest";
|
||||
import { QueryClient } from "@tanstack/react-query";
|
||||
import { describe, expect, it, vi } from "vitest";
|
||||
|
||||
import { queryKeys } from "../lib/queryKeys";
|
||||
import {
|
||||
buildHeartbeatProgressLogLine,
|
||||
heartbeatProgressLogLineKey,
|
||||
syncAgentRouteAfterRename,
|
||||
} from "./AgentDetail";
|
||||
|
||||
describe("buildHeartbeatProgressLogLine", () => {
|
||||
|
|
@ -59,3 +62,43 @@ describe("heartbeatProgressLogLineKey", () => {
|
|||
);
|
||||
});
|
||||
});
|
||||
|
||||
describe("syncAgentRouteAfterRename", () => {
|
||||
it("replaces stale agent routes after a rename changes the URL key", () => {
|
||||
const queryClient = new QueryClient();
|
||||
const navigate = vi.fn();
|
||||
queryClient.setQueryData(queryKeys.agents.detail("old-agent"), { id: "agent-1" });
|
||||
queryClient.setQueryData(queryKeys.agents.detail("renamed-agent"), { id: "agent-1" });
|
||||
|
||||
const redirected = syncAgentRouteAfterRename(
|
||||
queryClient,
|
||||
navigate,
|
||||
{ id: "agent-1", name: "Old Agent", urlKey: "old-agent" },
|
||||
{ id: "agent-1", name: "Renamed Agent", urlKey: "renamed-agent" },
|
||||
"configuration",
|
||||
);
|
||||
|
||||
expect(redirected).toBe(true);
|
||||
expect(navigate).toHaveBeenCalledWith("/agents/renamed-agent/configuration", { replace: true });
|
||||
expect(queryClient.getQueryData(queryKeys.agents.detail("old-agent"))).toBeUndefined();
|
||||
expect(queryClient.getQueryData(queryKeys.agents.detail("renamed-agent"))).toEqual({ id: "agent-1" });
|
||||
});
|
||||
|
||||
it("does not redirect when the canonical route ref stays the same", () => {
|
||||
const queryClient = new QueryClient();
|
||||
const navigate = vi.fn();
|
||||
queryClient.setQueryData(queryKeys.agents.detail("same-agent"), { id: "agent-1" });
|
||||
|
||||
const redirected = syncAgentRouteAfterRename(
|
||||
queryClient,
|
||||
navigate,
|
||||
{ id: "agent-1", name: "Same Agent", urlKey: "same-agent" },
|
||||
{ id: "agent-1", name: "Same Agent", urlKey: "same-agent" },
|
||||
"configuration",
|
||||
);
|
||||
|
||||
expect(redirected).toBe(false);
|
||||
expect(navigate).not.toHaveBeenCalled();
|
||||
expect(queryClient.getQueryData(queryKeys.agents.detail("same-agent"))).toEqual({ id: "agent-1" });
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { useCallback, useEffect, useMemo, useState, useRef } from "react";
|
||||
import { useParams, useNavigate, Link, Navigate, useBeforeUnload } from "@/lib/router";
|
||||
import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
|
||||
import { useParams, useNavigate, Link, Navigate, useBeforeUnload, type NavigateFunction } from "@/lib/router";
|
||||
import { useQuery, useMutation, useQueryClient, type QueryClient } from "@tanstack/react-query";
|
||||
import {
|
||||
agentsApi,
|
||||
type AgentKey,
|
||||
|
|
@ -1638,6 +1638,29 @@ function CostsSection({
|
|||
|
||||
/* ---- Agent Configure Page ---- */
|
||||
|
||||
/**
|
||||
* Agent detail URLs use a name-derived key, so updates that change the agent's
|
||||
* name (a rename or a config-revision rollback) can invalidate the reference
|
||||
* currently in the URL. When that happens, refetching the old reference would
|
||||
* 404 with "Agent not found". Instead, drop the stale cached queries and
|
||||
* replace the URL with the new canonical reference. Returns true when a
|
||||
* redirect happened.
|
||||
*/
|
||||
export function syncAgentRouteAfterRename(
|
||||
queryClient: QueryClient,
|
||||
navigate: NavigateFunction,
|
||||
previous: { id: string; urlKey?: string | null; name?: string | null },
|
||||
updated: { id: string; urlKey?: string | null; name?: string | null },
|
||||
tab: string,
|
||||
): boolean {
|
||||
const previousRef = agentRouteRef(previous);
|
||||
const nextRef = agentRouteRef(updated);
|
||||
if (nextRef === previousRef) return false;
|
||||
queryClient.removeQueries({ queryKey: queryKeys.agents.detail(previousRef) });
|
||||
navigate(`/agents/${nextRef}/${tab}`, { replace: true });
|
||||
return true;
|
||||
}
|
||||
|
||||
function AgentConfigurePage({
|
||||
agent,
|
||||
agentId,
|
||||
|
|
@ -1658,6 +1681,8 @@ function AgentConfigurePage({
|
|||
updatePermissions: { mutate: (permissions: AgentPermissionUpdate) => void; isPending: boolean };
|
||||
}) {
|
||||
const queryClient = useQueryClient();
|
||||
const navigate = useNavigate();
|
||||
const { tab: urlTab } = useParams<{ tab?: string }>();
|
||||
const [revisionsOpen, setRevisionsOpen] = useState(false);
|
||||
|
||||
const { data: configRevisions } = useQuery({
|
||||
|
|
@ -1667,10 +1692,12 @@ function AgentConfigurePage({
|
|||
|
||||
const rollbackConfig = useMutation({
|
||||
mutationFn: (revisionId: string) => agentsApi.rollbackConfigRevision(agent.id, revisionId, companyId),
|
||||
onSuccess: () => {
|
||||
onSuccess: (updated) => {
|
||||
queryClient.invalidateQueries({ queryKey: queryKeys.agents.detail(agent.id) });
|
||||
queryClient.invalidateQueries({ queryKey: queryKeys.agents.detail(agent.urlKey) });
|
||||
queryClient.invalidateQueries({ queryKey: queryKeys.agents.configRevisions(agent.id) });
|
||||
if (!syncAgentRouteAfterRename(queryClient, navigate, agent, updated, urlTab ?? "configuration")) {
|
||||
queryClient.invalidateQueries({ queryKey: queryKeys.agents.detail(agent.urlKey) });
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
|
|
@ -1770,6 +1797,8 @@ function ConfigurationTab({
|
|||
hideInstructionsFile?: boolean;
|
||||
}) {
|
||||
const queryClient = useQueryClient();
|
||||
const navigate = useNavigate();
|
||||
const { tab: urlTab } = useParams<{ tab?: string }>();
|
||||
const { pushToast } = useToastActions();
|
||||
const [awaitingRefreshAfterSave, setAwaitingRefreshAfterSave] = useState(false);
|
||||
const lastAgentRef = useRef(agent);
|
||||
|
|
@ -1804,11 +1833,13 @@ function ConfigurationTab({
|
|||
onMutate: () => {
|
||||
setAwaitingRefreshAfterSave(true);
|
||||
},
|
||||
onSuccess: () => {
|
||||
onSuccess: (updated) => {
|
||||
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) });
|
||||
if (!syncAgentRouteAfterRename(queryClient, navigate, agent, updated, urlTab ?? "configuration")) {
|
||||
queryClient.invalidateQueries({ queryKey: queryKeys.agents.detail(agent.urlKey) });
|
||||
}
|
||||
pushToast({ title: "Agent saved", tone: "success" });
|
||||
},
|
||||
onError: (err) => {
|
||||
|
|
|
|||
Loading…
Reference in New Issue