From d4a38560834dc0532f91f437ad753135df18c505 Mon Sep 17 00:00:00 2001
From: Gabriel Brown <gbrown@ksensetech.com>
Date: Fri, 10 Jul 2026 17:02:26 -0400
Subject: [PATCH] fix(workspace): key shell by job

---
 .../spoons/[spoonId]/agent/[jobId]/page.tsx   |  2 +-
 .../src/app/(app)/threads/[threadId]/page.tsx |  2 +-
 .../agent-workspace-shell-key.test.tsx        | 28 +++++++++++++++++++
 3 files changed, 30 insertions(+), 2 deletions(-)
 create mode 100644 apps/next/tests/component/agent-workspace-shell-key.test.tsx

diff --git a/apps/next/src/app/(app)/spoons/[spoonId]/agent/[jobId]/page.tsx b/apps/next/src/app/(app)/spoons/[spoonId]/agent/[jobId]/page.tsx
index 06a8883..93fdbfe 100644
--- a/apps/next/src/app/(app)/spoons/[spoonId]/agent/[jobId]/page.tsx
+++ b/apps/next/src/app/(app)/spoons/[spoonId]/agent/[jobId]/page.tsx
@@ -37,7 +37,7 @@ const AgentWorkspacePage = () => {
           Back to Spoon
         </Link>
       </Button>
-      <AgentWorkspaceShell jobId={jobId} />
+      <AgentWorkspaceShell key={jobId} jobId={jobId} />
     </main>
   );
 };
diff --git a/apps/next/src/app/(app)/threads/[threadId]/page.tsx b/apps/next/src/app/(app)/threads/[threadId]/page.tsx
index f471c58..add0be8 100644
--- a/apps/next/src/app/(app)/threads/[threadId]/page.tsx
+++ b/apps/next/src/app/(app)/threads/[threadId]/page.tsx
@@ -53,7 +53,7 @@ const ThreadDetailPage = () => {
             Back to Spoon
           </Link>
         </Button>
-        <AgentWorkspaceShell jobId={latestJob._id} />
+        <AgentWorkspaceShell key={latestJob._id} jobId={latestJob._id} />
       </main>
     );
   }
diff --git a/apps/next/tests/component/agent-workspace-shell-key.test.tsx b/apps/next/tests/component/agent-workspace-shell-key.test.tsx
new file mode 100644
index 0000000..b6e1178
--- /dev/null
+++ b/apps/next/tests/component/agent-workspace-shell-key.test.tsx
@@ -0,0 +1,28 @@
+import { useEffect } from 'react';
+import { render } from '@testing-library/react';
+import { describe, expect, test } from 'vitest';
+
+let mounts = 0;
+
+const Child = ({ jobId }: { jobId: string }) => {
+  useEffect(() => {
+    mounts += 1;
+  }, []);
+
+  return <span>{jobId}</span>;
+};
+
+const Shell = ({ jobId }: { jobId: string }) => (
+  <Child key={jobId} jobId={jobId} />
+);
+
+describe('workspace shell keyed by job', () => {
+  test('remounts when jobId changes', () => {
+    mounts = 0;
+    const { rerender } = render(<Shell jobId='a' />);
+    expect(mounts).toBe(1);
+
+    rerender(<Shell jobId='b' />);
+    expect(mounts).toBe(2);
+  });
+});