From 37c097a47482ccd5714dbe1edbd8ac5fdce9631e Mon Sep 17 00:00:00 2001 From: Dotta <34892728+cryppadotta@users.noreply.github.com> Date: Tue, 30 Jun 2026 09:54:25 -0500 Subject: [PATCH] [codex] Update watchdog properties pane cache (#8786) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Thinking Path > - Paperclip is the open source app people use to manage AI agents for work. > - The issue detail surface includes an Issue Properties pane that shows live metadata for a selected issue. > - Watchdog configuration can be changed from that pane, but cached issue detail data also feeds the pane key and rerender behavior. > - If the cache does not reflect watchdog changes immediately, the properties pane can keep stale watchdog state until a later refetch completes. > - This pull request updates the watchdog save/delete paths to write the returned watchdog state into cached issue detail data. > - It also includes watchdog fields in the issue properties panel key so watchdog configuration changes invalidate the memoized panel state. > - The benefit is a properties pane that updates consistently after operators set or remove a watchdog. ## Linked Issues or Issue Description Refs #8789 This PR fixes stale watchdog state in the Issue Properties pane after watchdog save/delete mutations. ## What Changed - Write the saved watchdog summary into cached issue detail data after a successful watchdog upsert using the exact `queryKeys.issues.detail(issue.id)` key. - Clear cached issue detail watchdog data after a successful watchdog delete using the exact `queryKeys.issues.detail(issue.id)` key. - Include stable watchdog fields in `buildIssuePropertiesPanelKey` so watchdog configuration changes produce a new panel key. - Add focused tests for watchdog cache updates and panel-key invalidation, including save and delete cache assertions. ## Verification - `pnpm --filter @paperclipai/ui exec vitest run src/components/IssueProperties.test.tsx src/lib/issue-properties-panel-key.test.ts` - Result: 2 files passed, 40 tests passed. ## Risks Low risk. The change is scoped to UI cache handling for issue detail watchdog state and panel-key generation. The main risk is an unexpected query-cache shape, covered by focused tests around the existing issue detail query key. > For core feature work, check [`ROADMAP.md`](ROADMAP.md) first and discuss it in `#dev` before opening the PR. Feature PRs that overlap with planned core work may need to be redirected — check the roadmap first. See `CONTRIBUTING.md`. ## Model Used OpenAI Codex coding agent running GPT-5-class model with repository tool use and local command execution. The exact backend model identifier and context window are not exposed in this runtime. ## 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 - [x] 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: Paperclip --- ui/src/components/IssueProperties.test.tsx | 72 ++++++++++++++++++- ui/src/components/IssueProperties.tsx | 8 ++- ui/src/lib/issue-properties-panel-key.test.ts | 27 +++++++ ui/src/lib/issue-properties-panel-key.ts | 10 +++ 4 files changed, 113 insertions(+), 4 deletions(-) diff --git a/ui/src/components/IssueProperties.test.tsx b/ui/src/components/IssueProperties.test.tsx index 9144bf8fa1..3e0d5f2233 100644 --- a/ui/src/components/IssueProperties.test.tsx +++ b/ui/src/components/IssueProperties.test.tsx @@ -15,6 +15,7 @@ import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import type { Issue } from "@paperclipai/shared"; import { afterEach, beforeEach, describe, expect, it, vi } from "vitest"; import { IssueProperties } from "./IssueProperties"; +import { queryKeys } from "../lib/queryKeys"; const mockAgentsApi = vi.hoisted(() => ({ list: vi.fn(), @@ -370,7 +371,7 @@ function createExecutionState(overrides: Partial = {}): Iss }; } -function renderProperties(container: HTMLDivElement, props: ComponentProps) { +function renderPropertiesWithQueryClient(container: HTMLDivElement, props: ComponentProps) { const queryClient = new QueryClient({ defaultOptions: { queries: { retry: false }, @@ -384,6 +385,11 @@ function renderProperties(container: HTMLDivElement, props: ComponentProps, ); }); + return { root, queryClient }; +} + +function renderProperties(container: HTMLDivElement, props: ComponentProps) { + const { root } = renderPropertiesWithQueryClient(container, props); return root; } @@ -1813,18 +1819,76 @@ describe("IssueProperties", () => { act(() => root.unmount()); }); + it("updates cached issue detail when saving a watchdog", async () => { + mockInstanceSettingsApi.getExperimental.mockResolvedValue({ + enableTaskWatchdogs: true, + }); + mockAgentsApi.list.mockResolvedValue([watchdogAgent]); + const savedWatchdog = createWatchdogSummary({ + instructions: "Watch the deploy", + }); + mockIssuesApi.upsertWatchdog.mockResolvedValueOnce(savedWatchdog); + const issue = createIssue({ watchdog: null }); + const { root, queryClient } = renderPropertiesWithQueryClient(container, { + issue, + childIssues: [], + onUpdate: vi.fn(), + inline: true, + }); + queryClient.setQueryData(queryKeys.issues.detail(issue.id), issue); + await flush(); + + let trigger: HTMLButtonElement | undefined; + await waitForAssertion(() => { + trigger = Array.from(container.querySelectorAll("button")) + .find((button) => button.textContent?.includes("Set watchdog")); + expect(trigger).toBeTruthy(); + }); + + await act(async () => { + trigger!.dispatchEvent(new MouseEvent("click", { bubbles: true })); + }); + await flush(); + + let agentOption: HTMLElement | undefined; + await waitForAssertion(() => { + agentOption = Array.from(container.querySelectorAll("button, [role='option']")) + .find((node) => node.textContent?.includes("ClaudeCoder")) as HTMLElement | undefined; + expect(agentOption).toBeTruthy(); + }); + await act(async () => { + agentOption!.dispatchEvent(new MouseEvent("click", { bubbles: true })); + }); + await flush(); + + const finalSave = Array.from(container.querySelectorAll("button")) + .find((button) => button.textContent === "Set watchdog" && button !== trigger); + expect(finalSave).toBeTruthy(); + await act(async () => { + finalSave!.dispatchEvent(new MouseEvent("click", { bubbles: true })); + }); + await flush(); + + expect(queryClient.getQueryData(queryKeys.issues.detail(issue.id))?.watchdog) + .toEqual(savedWatchdog); + + act(() => root.unmount()); + }); + it("renders an existing watchdog and removes it via the API", async () => { mockInstanceSettingsApi.getExperimental.mockResolvedValue({ enableTaskWatchdogs: true, }); mockAgentsApi.list.mockResolvedValue([watchdogAgent]); const onUpdate = vi.fn(); - const root = renderProperties(container, { - issue: createIssue({ watchdog: createWatchdogSummary() }), + const issue = createIssue({ watchdog: createWatchdogSummary() }); + const { root, queryClient } = renderPropertiesWithQueryClient(container, { + issue, childIssues: [], onUpdate, inline: true, }); + queryClient.setQueryData(queryKeys.issues.detail(issue.id), issue); await flush(); await waitForAssertion(() => { @@ -1847,6 +1911,8 @@ describe("IssueProperties", () => { await flush(); expect(mockIssuesApi.deleteWatchdog).toHaveBeenCalledWith("issue-1"); + expect(queryClient.getQueryData(queryKeys.issues.detail(issue.id))?.watchdog) + .toBeNull(); act(() => root.unmount()); }); diff --git a/ui/src/components/IssueProperties.tsx b/ui/src/components/IssueProperties.tsx index 2524076483..8cb1cf1c1c 100644 --- a/ui/src/components/IssueProperties.tsx +++ b/ui/src/components/IssueProperties.tsx @@ -1212,7 +1212,10 @@ export function IssueProperties({ const upsertWatchdog = useMutation({ mutationFn: (data: { agentId: string; instructions: string | null }) => issuesApi.upsertWatchdog(issue.id, data), - onSuccess: () => { + onSuccess: (watchdog) => { + queryClient.setQueryData(queryKeys.issues.detail(issue.id), (current) => + current ? { ...current, watchdog } : current, + ); void queryClient.invalidateQueries({ queryKey: queryKeys.issues.detail(issue.id) }); setWatchdogOpen(false); }, @@ -1220,6 +1223,9 @@ export function IssueProperties({ const deleteWatchdog = useMutation({ mutationFn: () => issuesApi.deleteWatchdog(issue.id), onSuccess: () => { + queryClient.setQueryData(queryKeys.issues.detail(issue.id), (current) => + current ? { ...current, watchdog: null } : current, + ); void queryClient.invalidateQueries({ queryKey: queryKeys.issues.detail(issue.id) }); setWatchdogOpen(false); }, diff --git a/ui/src/lib/issue-properties-panel-key.test.ts b/ui/src/lib/issue-properties-panel-key.test.ts index c1b557fe78..ac7d0cf4d7 100644 --- a/ui/src/lib/issue-properties-panel-key.test.ts +++ b/ui/src/lib/issue-properties-panel-key.test.ts @@ -50,6 +50,33 @@ describe("buildIssuePropertiesPanelKey", () => { expect(second).not.toBe(first); }); + it("changes when watchdog configuration changes", () => { + const first = buildIssuePropertiesPanelKey(createIssue({ watchdog: null }), []); + const second = buildIssuePropertiesPanelKey( + createIssue({ + watchdog: { + id: "watchdog-1", + companyId: "company-1", + issueId: "issue-1", + watchdogAgentId: "agent-1", + instructions: "Keep the tree moving.", + status: "active", + watchdogIssueId: null, + lastObservedFingerprint: null, + lastReviewedFingerprint: null, + lastTriggeredAt: null, + lastCompletedAt: null, + triggerCount: 0, + createdAt: new Date("2026-04-12T12:01:00.000Z"), + updatedAt: new Date("2026-04-12T12:01:00.000Z"), + }, + }), + [], + ); + + expect(second).not.toBe(first); + }); + it("changes when workspace detail hydrates after opening from a cached issue", () => { const first = buildIssuePropertiesPanelKey(createIssue(), []); const second = buildIssuePropertiesPanelKey( diff --git a/ui/src/lib/issue-properties-panel-key.ts b/ui/src/lib/issue-properties-panel-key.ts index 5bb0f6ce21..b75d74cb0c 100644 --- a/ui/src/lib/issue-properties-panel-key.ts +++ b/ui/src/lib/issue-properties-panel-key.ts @@ -22,6 +22,7 @@ type IssuePropertiesPanelKeyIssue = Pick< | "blocks" | "blockedBy" | "ancestors" + | "watchdog" >; type IssuePropertiesPanelKeyChild = Pick; @@ -83,6 +84,15 @@ export function buildIssuePropertiesPanelKey( title: relation.title, status: relation.status, })), + watchdog: issue.watchdog + ? { + id: issue.watchdog.id, + watchdogAgentId: issue.watchdog.watchdogAgentId, + instructions: issue.watchdog.instructions ?? null, + status: issue.watchdog.status, + watchdogIssueId: issue.watchdog.watchdogIssueId ?? null, + } + : null, parentSummary: issue.ancestors?.[0] ? { id: issue.ancestors[0].id,