Show a distinct no-permission state for approvals#3318
Conversation
The approvals endpoints are org-admin gated and answer 404 for non-admins, which previously rendered as a generic "Couldn't load approvals" failure. The fetcher now throws a typed ApiRequestError (same message format, so existing string-matching catch sites keep working), the approvals hooks flag the 404 as a permission error and stop polling/retrying it, and both approvals panes render a calm "You need organization admin access" empty state instead. Generated-By: PostHog Code Task-Id: 8713c915-6ca4-444b-824f-343ec148e128
|
Merging to
After your PR is submitted to the merge queue, this comment will be automatically updated with its status. If the PR fails, failure details will also be posted here |
|
React Doctor found no issues in the changed files. 🎉 Reviewed by React Doctor for commit |
|
Reviews (1): Last reviewed commit: "feat(approvals): show a distinct no-perm..." | Re-trigger Greptile |
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
| // Stop polling once we know the viewer lacks org-admin access. | ||
| refetchInterval: (query) => | ||
| isApprovalsPermissionError(query.state.error) ? false : 10_000, |
There was a problem hiding this comment.
refetchInterval callback parameter is named query, which shadows the outer const query assigned from useAuthenticatedQuery. The inner query is the TanStack Query<…> object, not the hook's return value — so this is harmless at runtime, but the two meanings in close proximity can mislead readers into thinking the callback accesses the hook's own state. The same shadowing is present in useAgentApplicationApprovals.ts.
| // Stop polling once we know the viewer lacks org-admin access. | |
| refetchInterval: (query) => | |
| isApprovalsPermissionError(query.state.error) ? false : 10_000, | |
| // Stop polling once we know the viewer lacks org-admin access. | |
| refetchInterval: (q) => | |
| isApprovalsPermissionError(q.state.error) ? false : 10_000, |
Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
There was a problem hiding this comment.
Fixed in 4101201 — renamed the callback parameter to q in both hooks.
| describe("useAgentFleetApprovals", () => { | ||
| beforeEach(() => { | ||
| vi.clearAllMocks(); | ||
| }); | ||
|
|
||
| it("flags a 404 as a permission error without retrying", async () => { | ||
| mockListAgentFleetApprovals.mockRejectedValue( | ||
| new ApiRequestError(404, '{"detail":"Not found"}'), | ||
| ); | ||
| const { result } = renderApprovalsHook(); | ||
|
|
||
| await waitFor(() => expect(result.current.isError).toBe(true)); | ||
| expect(result.current.isPermissionError).toBe(true); | ||
| // The admin gate never clears on retry, so the hook must not retry. | ||
| expect(mockListAgentFleetApprovals).toHaveBeenCalledTimes(1); | ||
| }); | ||
|
|
||
| it("treats non-404 failures as genuine errors and retries them", async () => { | ||
| mockListAgentFleetApprovals.mockRejectedValue( | ||
| new ApiRequestError(500, '{"error":"boom"}'), | ||
| ); | ||
| const { result } = renderApprovalsHook(); | ||
|
|
||
| await waitFor(() => expect(result.current.isError).toBe(true)); | ||
| expect(result.current.isPermissionError).toBe(false); | ||
| expect(mockListAgentFleetApprovals).toHaveBeenCalledTimes(4); | ||
| }); | ||
|
|
||
| it("returns approvals on success", async () => { | ||
| mockListAgentFleetApprovals.mockResolvedValue([{ id: "approval-1" }]); | ||
| const { result } = renderApprovalsHook(); | ||
|
|
||
| await waitFor(() => expect(result.current.isSuccess).toBe(true)); | ||
| expect(result.current.data).toEqual([{ id: "approval-1" }]); | ||
| expect(result.current.isPermissionError).toBe(false); | ||
| }); | ||
| }); |
There was a problem hiding this comment.
useAgentApplicationApprovals contains identical retry/refetchInterval logic but has no dedicated test file. The shared isApprovalsPermissionError helper is exercised here, but the hook-level behaviour (no retry on 404, retry count on 500, isPermissionError flag propagation) would benefit from the same coverage — particularly because useAgentApplicationApprovals also gates on !!idOrSlug, a condition that isn't exercised by the fleet hook tests.
There was a problem hiding this comment.
Added useAgentApplicationApprovals.test.tsx in 4101201 — covers the 404 no-retry path, 500 retries, success, and the !!idOrSlug enabled gate (query stays pending, client never called).
…-agent hook Rename the refetchInterval callback parameter from `query` to `q` in both approvals hooks so it no longer shadows the outer `const query`, and add a dedicated test file for useAgentApplicationApprovals covering the 404 no-retry path, 500 retry path, success, and the !!idOrSlug enabled gate. Generated-By: PostHog Code Task-Id: 8713c915-6ca4-444b-824f-343ec148e128
1 participant
Problem
Tool approvals are org-admin-only, and the backend deliberately answers a 404 (not a 403) when the caller isn't an organization admin. The console's approvals surfaces treated that 404 like any other failure and showed "Couldn't load approvals", so non-admins read the feature as broken — and the panes kept polling the endpoint every 10s even though it could never succeed.
Changes
packages/api-client/src/fetcher.ts: non-2xx responses now throw a typedApiRequestErrorwith a.statusfield. The message keeps the exact legacyFailed request: [<status>] <body>format, so all existing catch sites that string-match on it are unaffected. Added arequestErrorStatus()helper.useAgentFleetApprovals/useAgentApplicationApprovalsexposeisPermissionError, skip react-query retries on the 404 admin gate, and stop the 10srefetchIntervalonce the permission error is known (this also stops the wasted polling behind the pending-count strip on the applications list).AgentFleetApprovalsPane/AgentApprovalsPanerender a dedicated calm empty state — "You need organization admin access" with no retry affordance — while genuine failures keep the "Couldn't load approvals" state. Fixed the copy, which previously said "team-admin"; the actual gate is organization-membership admin. For the per-agent pane, 404→no-permission is safe becauseAgentDetailLayoutonly renders the pane's content after the application itself has loaded.DeepLinkApprovalModalandAgentApprovalDetailneed no changes: the modal uses the session-principal-scoped ingress endpoint (not the admin gate) and already handles 404/403, and the detail view is prop-driven from the list.How did you test this?
fetcher.test.ts(typed status + legacy message format preserved on both throw sites,requestErrorStatus) anduseAgentFleetApprovals.test.tsx(404 →isPermissionErrorwith no retry, 500 → genuine error with retries, success path, predicate cases).pnpm typecheckfor@posthog/api-clientand@posthog/ui; full test suites for both packages pass (160 files / 1433 tests in ui, 75 in api-client); Biome clean on changed files.Automatic notifications
Created with PostHog Code