diff --git a/site/src/pages/AgentsPage/AgentChatPageView.stories.tsx b/site/src/pages/AgentsPage/AgentChatPageView.stories.tsx
index 67092e452f..8084831ab6 100644
--- a/site/src/pages/AgentsPage/AgentChatPageView.stories.tsx
+++ b/site/src/pages/AgentsPage/AgentChatPageView.stories.tsx
@@ -283,6 +283,70 @@ index abc1234..def5678 100644
},
};
+/**
+ * Clicking the refresh button in the git panel invalidates the
+ * cached PR diff contents so that React Query re-fetches from
+ * the server.
+ */
+export const RefreshInvalidatesPRDiff: Story = {
+ render: () => (
+
+ ),
+ beforeEach: () => {
+ spyOn(API.experimental, "getChatDiffContents").mockResolvedValue({
+ chat_id: AGENT_ID,
+ diff: `diff --git a/src/main.ts b/src/main.ts
+index abc1234..def5678 100644
+--- a/src/main.ts
++++ b/src/main.ts
+@@ -1,3 +1,5 @@
+ import { start } from "./server";
++import { logger } from "./logger";
+ const port = 3000;
++logger.info("Starting server...");
+ start(port);`,
+ });
+ },
+ play: async ({ canvasElement }) => {
+ const canvas = within(canvasElement);
+
+ // Wait for the initial diff fetch triggered by React Query.
+ await waitFor(() => {
+ expect(API.experimental.getChatDiffContents).toHaveBeenCalled();
+ });
+ const callsBefore = (
+ API.experimental.getChatDiffContents as ReturnType
+ ).mock.calls.length;
+
+ // Click the refresh button in the git panel toolbar.
+ const refreshButton = canvas.getByRole("button", { name: "Refresh" });
+ await userEvent.click(refreshButton);
+
+ // The query should be re-fetched, resulting in an additional call.
+ await waitFor(() => {
+ expect(
+ (API.experimental.getChatDiffContents as ReturnType).mock
+ .calls.length,
+ ).toBeGreaterThan(callsBefore);
+ });
+ },
+};
+
/** Left sidebar is collapsed. */
export const SidebarCollapsed: Story = {
render: () => ,
diff --git a/site/src/pages/AgentsPage/AgentChatPageView.tsx b/site/src/pages/AgentsPage/AgentChatPageView.tsx
index 8625d6a443..523234dea2 100644
--- a/site/src/pages/AgentsPage/AgentChatPageView.tsx
+++ b/site/src/pages/AgentsPage/AgentChatPageView.tsx
@@ -1,9 +1,10 @@
import { ArchiveIcon } from "lucide-react";
import { type FC, type RefObject, useRef, useState } from "react";
+import { useQueryClient } from "react-query";
import type { UrlTransform } from "streamdown";
+import { chatDiffContentsKey } from "#/api/queries/chats";
import type * as TypesGen from "#/api/typesGenerated";
import type { ChatDiffStatus, ChatMessagePart } from "#/api/typesGenerated";
-
import { cn } from "#/utils/cn";
import { pageTitle } from "#/utils/page";
import {
@@ -208,6 +209,21 @@ export const AgentChatPageView: FC = ({
desktopChatId,
lastInjectedContext,
}) => {
+ const queryClient = useQueryClient();
+
+ // Wrap the git watcher refresh to also invalidate the cached
+ // remote/PR diff contents so the panel re-fetches from GitHub.
+ const handleRefresh = () => {
+ const sent = gitWatcher.refresh();
+ if (sent && agentId) {
+ void queryClient.invalidateQueries({
+ queryKey: chatDiffContentsKey(agentId),
+ exact: true,
+ });
+ }
+ return sent;
+ };
+
const [isRightPanelExpanded, setIsRightPanelExpanded] = useState(false);
const [dragVisualExpanded, setDragVisualExpanded] = useState(
null,
@@ -389,7 +405,7 @@ export const AgentChatPageView: FC = ({
: undefined
}
repositories={gitWatcher.repositories}
- onRefresh={gitWatcher.refresh}
+ onRefresh={handleRefresh}
onCommit={handleCommit}
isExpanded={visualExpanded}
remoteDiffStats={diffStatusData}