diff --git a/apps/agent-forge/e2e/a11y.spec.ts b/apps/agent-forge/e2e/a11y.spec.ts
index 4903c69d..63bd46d0 100644
--- a/apps/agent-forge/e2e/a11y.spec.ts
+++ b/apps/agent-forge/e2e/a11y.spec.ts
@@ -113,7 +113,7 @@ test('Ctrl+K opens the command palette; ? lists the shortcuts', async ({ page })
 });
 
 // One <main>, one h1, the banner and the primary nav on every screen, not just Agents.
-for (const route of ['#/traces', '#/traces?status=error', '#/traces/e2e-trace?obs=e2e-obs', '#/threads', '#/threads/s1', '#/threads?status=active', '#/monitoring', '#/evals/scores', '#/prompts', '#/prompts/mira@2?diff=1,2', '#/settings', '#/playground']) {
+for (const route of ['#/traces', '#/traces?status=error', '#/traces/e2e-trace?obs=e2e-obs', '#/threads', '#/threads/s1', '#/threads?status=active', '#/monitoring', '#/evals/scores', '#/prompts', '#/prompts/mira@2?diff=1,2', '#/hub', '#/hub/docs?scope=fleet', '#/settings', '#/playground']) {
   test(`${route} keeps the landmarks and exactly one main`, async ({ page }) => {
     await page.goto(`/?token=e2e-studio-token${route}`);
     await expect(page.locator('.screen-main')).toBeVisible();
diff --git a/apps/agent-forge/server/__tests__/observeProxy.test.ts b/apps/agent-forge/server/__tests__/observeProxy.test.ts
index 421bb152..273011a4 100644
--- a/apps/agent-forge/server/__tests__/observeProxy.test.ts
+++ b/apps/agent-forge/server/__tests__/observeProxy.test.ts
@@ -3,7 +3,7 @@
  * panels' GETs same-origin, because the daemon itself serves no CORS
  * headers. A dead daemon answers 502 with the `lousho observe start` hint.
  * Writes go through only when OBSERVE_WRITE_ALLOWLIST names the method and
- * path (feedback scores, a prompt label move); every other non-GET stays 405.
+ * path (feedback scores, a prompt label move, a hub publish); every other non-GET stays 405.
  */
 import { describe, it, expect, beforeEach, afterEach } from 'vitest';
 import * as http from 'node:http';
@@ -101,6 +101,13 @@ describe('observe proxy', () => {
     expect((await request(app).delete('/observe/api/v1/scores')).status).toBe(405);
   });
 
+  it('forwards POST /api/v1/hub (a Context Hub fleet entry edit) with its JSON body', async () => {
+    const entry = { agent_id: 'a1', namespace: 'docs', key: 'k', value: { a: 1 }, scope: 'fleet' };
+    const res = await request(app).post('/observe/api/v1/hub').send(entry);
+    expect(res.status).toBe(201);
+    expect(res.body).toEqual({ echoed: '/api/v1/hub', method: 'POST', contentType: 'application/json', body: entry });
+  });
+
   it('forwards an allowlisted PUT (prompt label move) with its JSON body and content-type', async () => {
     const res = await request(app).put('/observe/api/v1/prompts/mira/labels/prod').send({ version: 2 });
     expect(res.status).toBe(200);
@@ -116,6 +123,8 @@ describe('observe proxy', () => {
     ['put', '/observe/api/v1/prompts/mira/labels/prod/extra'],
     ['delete', '/observe/api/v1/prompts/mira/labels/prod'],
     ['post', '/observe/api/v1/prompts/mira/labels/prod'],
+    ['post', '/observe/api/v1/hub/x'],
+    ['put', '/observe/api/v1/hub'],
     ['post', '/observe/v1/traces'],
   ] as const)('keeps %s %s at 405', async (method, url) => {
     const res = await request(app)[method](url).send({ version: 1 });
@@ -141,8 +150,8 @@ describe('observe proxy', () => {
     expect(res.status).toBe(413);
   });
 
-  it('exports one write allowlist of method + path pairs: feedback scores and the label move', () => {
-    expect(OBSERVE_WRITE_ALLOWLIST.map((entry) => entry.method)).toEqual(['POST', 'PUT']);
+  it('exports one write allowlist of method + path pairs: feedback scores, the label move and hub publishes', () => {
+    expect(OBSERVE_WRITE_ALLOWLIST.map((entry) => entry.method)).toEqual(['POST', 'PUT', 'POST']);
     expect(OBSERVE_WRITE_ALLOWLIST.every((entry) => entry.path instanceof RegExp)).toBe(true);
   });
 });
diff --git a/apps/agent-forge/server/observeProxy.ts b/apps/agent-forge/server/observeProxy.ts
index 10420eef..d6da6a11 100644
--- a/apps/agent-forge/server/observeProxy.ts
+++ b/apps/agent-forge/server/observeProxy.ts
@@ -10,9 +10,9 @@
  *
  * GET is forwarded for every path. Writes are forwarded only when
  * {@link OBSERVE_WRITE_ALLOWLIST} names the method and path - a short list of
- * Studio actions (human feedback scores, moving a prompt label) - with the
- * JSON body app.ts's `express.json` already parsed, re-serialised and capped
- * at 1 MiB. Every other non-GET - the ingest endpoint above all - answers 405
+ * Studio actions (human feedback scores, moving a prompt label, editing a
+ * Context Hub fleet entry) - with the JSON body app.ts's `express.json`
+ * already parsed, re-serialised and capped at 1 MiB. Every other non-GET - the ingest endpoint above all - answers 405
  * and stays reporter-only. `/observe` sits in app.ts's API_PREFIXES, so it
  * carries the same per-launch token requirement as the rest of the studio API.
  */
@@ -33,6 +33,7 @@ export interface ObserveWrite {
 export const OBSERVE_WRITE_ALLOWLIST: readonly ObserveWrite[] = [
   { method: 'POST', path: /^\/api\/v1\/scores$/ },
   { method: 'PUT', path: /^\/api\/v1\/prompts\/[^/]+\/labels\/[^/]+$/ },
+  { method: 'POST', path: /^\/api\/v1\/hub$/ },
 ];
 
 /**
diff --git a/apps/agent-forge/src/observe/__tests__/observeClient.test.ts b/apps/agent-forge/src/observe/__tests__/observeClient.test.ts
index 34b0bd6d..213aed66 100644
--- a/apps/agent-forge/src/observe/__tests__/observeClient.test.ts
+++ b/apps/agent-forge/src/observe/__tests__/observeClient.test.ts
@@ -171,4 +171,26 @@ describe('ObserveClient', () => {
     const missing = clientWith((async () => jsonResponse(404, { error: "No prompt 'mira@9'." })) as typeof fetch);
     await expect(missing.movePromptLabel('mira', 'prod', 9)).rejects.toMatchObject({ status: 404, message: "No prompt 'mira@9'." });
   });
+  it('listHubEntries sends agent_id plus the optional namespace/scope/limit and returns the entries', async () => {
+    const entry = { entry_id: 'e1', namespace: 'docs', agent_id: 'a1', key: 'k', value: '1', scope: 'fleet', created_at: 1, ttl: null, expires_at: null };
+    const fetchFn = vi.fn(async () => jsonResponse(200, { entries: [entry] }));
+    const client = clientWith(fetchFn as typeof fetch);
+    expect(await client.listHubEntries({ agent_id: 'a1', namespace: 'docs', scope: 'fleet', limit: 1000 })).toEqual([entry]);
+    expect(fetchFn).toHaveBeenCalledWith('/observe/api/v1/hub?agent_id=a1&namespace=docs&scope=fleet&limit=1000', expect.anything());
+    await client.listHubEntries({ agent_id: 'a1' });
+    expect(fetchFn).toHaveBeenLastCalledWith('/observe/api/v1/hub?agent_id=a1', expect.anything());
+  });
+
+  it('publishHubEntry POSTs the entry as JSON to /api/v1/hub', async () => {
+    const fetchFn = vi.fn(async (_url: unknown, init?: RequestInit) => {
+      void init;
+      return jsonResponse(200, { entry: undefined, created: false });
+    });
+    const body = { agent_id: 'a1', namespace: 'docs', key: 'k', value: { a: 1 }, scope: 'fleet' as const, ttl: 60_000 };
+    expect(await clientWith(fetchFn as typeof fetch).publishHubEntry(body)).toMatchObject({ created: false });
+    const [url, init] = fetchFn.mock.calls[0] as [string, RequestInit];
+    expect(url).toBe('/observe/api/v1/hub');
+    expect(init.method).toBe('POST');
+    expect(JSON.parse(String(init.body))).toEqual(body);
+  });
 });
diff --git a/apps/agent-forge/src/observe/observeClient.ts b/apps/agent-forge/src/observe/observeClient.ts
index 238f5e9d..faaa880c 100644
--- a/apps/agent-forge/src/observe/observeClient.ts
+++ b/apps/agent-forge/src/observe/observeClient.ts
@@ -12,7 +12,10 @@
 import { STUDIO_TOKEN_HEADER, loadStudioToken } from '../runtime/studioToken';
 import type {
   ObserveAgentRow,
+  NewHubEntry,
   ObserveHealth,
+  ObserveHubEntry,
+  ObserveHubScope,
   ObserveInsights,
   ObservePromptHistory,
   ObservePromptLabelMove,
@@ -127,6 +130,14 @@ export interface NewScore {
   comment?: string;
 }
 
+/** `GET /api/v1/hub` params. `agent_id` is required: the daemon enforces scope against it (no `scope` = every fleet entry plus that agent's private ones; max `limit` 1000). */
+export interface HubEntryFilter {
+  agent_id: string;
+  namespace?: string;
+  scope?: ObserveHubScope;
+  limit?: number;
+}
+
 export interface InsightsFilter {
   days?: number;
   since?: number;
@@ -274,6 +285,17 @@ export class ObserveClient {
     });
   }
 
+  /** `GET /api/v1/hub` - live (unexpired) Context Hub entries visible to `agent_id`, newest first. */
+  async listHubEntries(filter: HubEntryFilter): Promise<ObserveHubEntry[]> {
+    const body = await this.request<{ entries: ObserveHubEntry[] }>('/api/v1/hub', { query: { ...filter } });
+    return body.entries;
+  }
+
+  /** `POST /api/v1/hub` - upsert one entry (per namespace, agent_id, key); republishing resets `created_at`, so the TTL restarts. */
+  publishHubEntry(entry: NewHubEntry): Promise<{ entry: ObserveHubEntry | undefined; created: boolean }> {
+    return this.request('/api/v1/hub', { method: 'POST', body: entry });
+  }
+
   /** `GET /api/v1/scores` - eval/judge/human score rows. */
   async listScores(filter: ScoreListFilter = {}): Promise<ObserveScoreRow[]> {
     const body = await this.request<{ scores: ObserveScoreRow[] }>('/api/v1/scores', { query: { ...filter } });
diff --git a/apps/agent-forge/src/observe/types.ts b/apps/agent-forge/src/observe/types.ts
index f9e6b29a..01c5856f 100644
--- a/apps/agent-forge/src/observe/types.ts
+++ b/apps/agent-forge/src/observe/types.ts
@@ -224,3 +224,31 @@ export interface ObservePromptLabelMove {
   version: number;
   previous_version: number | null;
 }
+
+/** A Context Hub entry's visibility: `private` to its writer, or `fleet`-wide. */
+export type ObserveHubScope = 'private' | 'fleet';
+
+/** One row of `GET /api/v1/hub`. `value` is the stored text: JSON-encoded unless it was published as a string. `ttl` is a lifetime in ms from `created_at` (the last publish). */
+export interface ObserveHubEntry {
+  entry_id: string;
+  namespace: string;
+  /** The writer. */
+  agent_id: string | null;
+  key: string;
+  value: string | null;
+  scope: ObserveHubScope;
+  created_at: number;
+  ttl: number | null;
+  expires_at: number | null;
+}
+
+/** `POST /api/v1/hub` body: one entry per (namespace, agent_id, key), upserted; republishing restarts the TTL clock. */
+export interface NewHubEntry {
+  agent_id: string;
+  namespace: string;
+  key: string;
+  /** Any JSON value; a string is stored verbatim. */
+  value: unknown;
+  scope?: ObserveHubScope;
+  ttl?: number;
+}
diff --git a/apps/agent-forge/src/observe/useObserve.ts b/apps/agent-forge/src/observe/useObserve.ts
index 3eed3fd2..4248a14a 100644
--- a/apps/agent-forge/src/observe/useObserve.ts
+++ b/apps/agent-forge/src/observe/useObserve.ts
@@ -6,10 +6,11 @@
  * duplicating effect logic.
  */
 import { useCallback, useEffect, useRef, useState } from 'react';
-import { observeClient, ObserveDaemonDownError, type InsightsFilter, type ScoreListFilter, type SessionListFilter, type TraceListFilter } from './observeClient';
+import { observeClient, ObserveDaemonDownError, type HubEntryFilter, type InsightsFilter, type ScoreListFilter, type SessionListFilter, type TraceListFilter } from './observeClient';
 import type {
   ObserveAgentRow,
   ObserveHealth,
+  ObserveHubEntry,
   ObserveInsights,
   ObservePromptHistory,
   ObservePromptRow,
@@ -172,3 +173,11 @@ export function usePrompts(refreshKey?: unknown): ObserveQuery<ObservePromptRow[
 export function usePromptVersions(name: string, refreshKey?: unknown): ObserveQuery<ObservePromptHistory | undefined> {
   return useObserveQuery(() => observeClient.promptVersions(name), [name, refreshKey]);
 }
+
+/** `GET /api/v1/hub`; `filter` undefined (no viewer agent yet) skips the request and resolves to `[]`. */
+export function useHubEntries(filter: HubEntryFilter | undefined, refreshKey?: unknown): ObserveQuery<ObserveHubEntry[]> {
+  return useObserveQuery(
+    () => (filter === undefined ? Promise.resolve([]) : observeClient.listHubEntries(filter)),
+    [JSON.stringify(filter), refreshKey]
+  );
+}
diff --git a/apps/agent-forge/src/screens/hub/HubEntry.tsx b/apps/agent-forge/src/screens/hub/HubEntry.tsx
new file mode 100644
index 00000000..136f9832
--- /dev/null
+++ b/apps/agent-forge/src/screens/hub/HubEntry.tsx
@@ -0,0 +1,135 @@
+/**
+ * One selected Context Hub entry: its full value (JSON through JsonView, any
+ * other string preformatted) and, for a fleet entry, the "Edit" inline editor.
+ *
+ * Saving republishes the entry as its writer (`POST /api/v1/hub` with the
+ * entry's own `agent_id`, scope `fleet` and original `ttl`) through the studio
+ * proxy's write allowlist. The daemon resets `created_at` on every publish, so
+ * an edit restarts the TTL clock - the editor says so next to the TTL.
+ */
+import { useState } from 'react';
+import { observeClient } from '../../observe/observeClient';
+import type { ObserveHubEntry } from '../../observe/types';
+import { JsonView } from '../../ui/JsonView';
+import { useToast } from '../../ui/Toast';
+import { editableText, fmtSpan, parseEditedValue, parseValue } from './hubModel';
+
+function ValueView({ value }: { value: string | null }) {
+  const parsed = parseValue(value);
+  return (
+    <div className="hub-value">
+      {parsed.json ? <JsonView value={parsed.parsed} /> : <pre className="hub-value-text">{parsed.text}</pre>}
+    </div>
+  );
+}
+
+function Editor({
+  entry,
+  writer,
+  onClose,
+  onSaved,
+}: {
+  entry: ObserveHubEntry & { agent_id: string };
+  writer: string;
+  onClose: () => void;
+  onSaved: () => void;
+}) {
+  const toast = useToast();
+  const wasJson = parseValue(entry.value).json;
+  const [text, setText] = useState(() => editableText(entry.value));
+  const [invalid, setInvalid] = useState(false);
+  const [saving, setSaving] = useState(false);
+
+  const save = async () => {
+    const parsed = parseEditedValue(text, wasJson);
+    if (!parsed.ok) {
+      setInvalid(true);
+      return;
+    }
+    setSaving(true);
+    try {
+      await observeClient.publishHubEntry({
+        agent_id: entry.agent_id,
+        namespace: entry.namespace,
+        key: entry.key,
+        value: parsed.value,
+        scope: 'fleet',
+        ...(entry.ttl === null ? {} : { ttl: entry.ttl }),
+      });
+      toast.show({ tone: 'success', message: `Saved ${entry.key}.` });
+      onSaved();
+      onClose();
+    } catch (error) {
+      toast.show({ tone: 'error', message: `Could not save ${entry.key}: ${(error as Error).message}` });
+      setSaving(false);
+    }
+  };
+
+  const ttlNote =
+    entry.ttl === null
+      ? 'No TTL: the entry does not expire.'
+      : `TTL ${fmtSpan(entry.ttl)}. Saving restarts the TTL clock: the entry expires ${fmtSpan(entry.ttl)} after the save.`;
+
+  return (
+    <form
+      className="hub-editor"
+      onSubmit={(e) => {
+        e.preventDefault();
+        void save();
+      }}
+    >
+      <label className="hub-editor-label" htmlFor={`hub-edit-${entry.entry_id}`}>
+        Value (republished as {writer}, scope fleet)
+      </label>
+      <textarea
+        id={`hub-edit-${entry.entry_id}`}
+        className="hub-editor-text"
+        value={text}
+        rows={Math.min(16, Math.max(4, text.split('\n').length + 1))}
+        aria-invalid={invalid || undefined}
+        aria-describedby={`hub-edit-${entry.entry_id}-note`}
+        onChange={(e) => {
+          setText(e.target.value);
+          setInvalid(false);
+        }}
+      />
+      <p className="hub-note" id={`hub-edit-${entry.entry_id}-note`}>
+        {invalid && <span className="hub-invalid" role="alert">This entry holds JSON; the text does not parse. </span>}
+        {ttlNote}
+      </p>
+      <div className="hub-editor-actions">
+        <button type="submit" className="btn" disabled={saving}>
+          Save
+        </button>
+        <button type="button" className="btn btn-ghost" onClick={onClose} disabled={saving}>
+          Cancel
+        </button>
+      </div>
+    </form>
+  );
+}
+
+/** The selected entry's value and, for a fleet entry with a known writer, the Edit affordance. */
+export function HubEntryDetail({ entry, writer, onSaved }: { entry: ObserveHubEntry; writer: string; onSaved: () => void }) {
+  const [editing, setEditing] = useState(false);
+  const editable = entry.scope === 'fleet' && entry.agent_id !== null;
+  return (
+    <section className="hub-entry" aria-label={`Entry ${entry.key}`}>
+      <div className="hub-entry-head">
+        <h3 className="hub-section-title">
+          <code>{entry.key}</code>
+        </h3>
+        {editable && !editing && (
+          <button type="button" className="btn" onClick={() => setEditing(true)}>
+            Edit
+          </button>
+        )}
+      </div>
+      {editing && editable ? (
+        <Editor entry={{ ...entry, agent_id: entry.agent_id! }} writer={writer} onClose={() => setEditing(false)} onSaved={onSaved} />
+      ) : (
+        <ValueView value={entry.value} />
+      )}
+    </section>
+  );
+}
diff --git a/apps/agent-forge/src/screens/hub/HubScreen.tsx b/apps/agent-forge/src/screens/hub/HubScreen.tsx
new file mode 100644
index 00000000..a0739e5e
--- /dev/null
+++ b/apps/agent-forge/src/screens/hub/HubScreen.tsx
@@ -0,0 +1,243 @@
+/**
+ * `#/hub` - the Context Hub's namespaces - and `#/hub/:namespace`, one
+ * namespace's key/value entries (URL shapes in `hubModel.ts`).
+ *
+ * The daemon has no namespace endpoint and reads hub entries only on behalf
+ * of an agent (`GET /api/v1/hub?agent_id=`: every fleet entry plus that
+ * agent's own private ones), so the screen asks "Viewing as" which agent, and
+ * derives the namespace list client-side from up to 1000 entries. Filter
+ * edits replace the history entry; opening a namespace pushes one. Behind the
+ * daemon-down state, which keeps the URL and swaps back in by itself.
+ */
+import './hub.css';
+import { useMemo, useState } from 'react';
+import { matchRoute, navigate } from '../../router/router';
+import { useRoute } from '../../router/useRoute';
+import { useAgents, useDaemonHealth, useHubEntries } from '../../observe/useObserve';
+import { ObserveDaemonDown, ObserveError } from '../../observe/chrome';
+import { ObserveDaemonDownError, type HubEntryFilter } from '../../observe/observeClient';
+import type { ObserveAgentRow, ObserveHubEntry } from '../../observe/types';
+import { fmtDateTime, fmtInt, fmtStarted } from '../../observe/format';
+import { DataTable, type Column } from '../../ui/DataTable';
+import { EmptyState } from '../../ui/EmptyState';
+import { StatusPill } from '../../ui/StatusPill';
+import { Clip } from '../listFilters';
+import { HubEntryDetail } from './HubEntry';
+import {
+  HUB_LIMIT,
+  agentLabel,
+  groupNamespaces,
+  hubPath,
+  parseHubQuery,
+  sortAgents,
+  ttlText,
+  valuePreview,
+  type HubNamespaceRow,
+  type HubUrlState,
+} from './hubModel';
+
+const NAMESPACE_COLUMNS: Column<HubNamespaceRow>[] = [
+  { key: 'namespace', header: 'Namespace', width: 240, render: (n) => <Clip text={n.namespace} /> },
+  { key: 'entries', header: 'Entries', align: 'right', width: 90, render: (n) => fmtInt(n.entries) },
+  { key: 'fleet', header: 'Fleet', align: 'right', width: 80, render: (n) => fmtInt(n.fleet) },
+  { key: 'private', header: 'Private', align: 'right', width: 80, render: (n) => fmtInt(n.private) },
+  { key: 'updated', header: 'Last updated', width: 140, hideBelow: 640, render: (n) => fmtDateTime(n.updated) },
+];
+
+function entryColumns(writerName: (id: string | null) => string, now: number): Column<ObserveHubEntry>[] {
+  return [
+    { key: 'key', header: 'Key', width: 180, render: (e) => <Clip text={e.key} /> },
+    { key: 'value', header: 'Value', width: 280, render: (e) => <Clip text={valuePreview(e.value)} className="list-clip hub-preview" /> },
+    { key: 'scope', header: 'Scope', width: 96, render: (e) => <StatusPill status={e.scope} /> },
+    { key: 'writer', header: 'Writer', width: 130, hideBelow: 720, render: (e) => <Clip text={writerName(e.agent_id)} /> },
+    { key: 'updated', header: 'Updated', width: 140, hideBelow: 900, render: (e) => fmtStarted(e.created_at, now) },
+    { key: 'ttl', header: 'TTL', width: 180, hideBelow: 1000, render: (e) => ttlText(e, now) },
+  ];
+}
+
+/** The viewer and scope pickers, plus what the viewer means for private entries. */
+function HubBar({
+  agents,
+  viewer,
+  state,
+  onChange,
+}: {
+  agents: ObserveAgentRow[];
+  viewer: string;
+  state: HubUrlState;
+  onChange: (patch: HubUrlState) => void;
+}) {
+  const known = agents.some((a) => a.agent_id === viewer);
+  const viewerName = agents.find((a) => a.agent_id === viewer);
+  return (
+    <div className="hub-bar">
+      <label className="hub-field">
+        <span>Viewing as</span>
+        <select className="select" aria-label="Viewing as" value={viewer} onChange={(e) => onChange({ agent: e.target.value })}>
+          {!known && <option value={viewer}>{viewer}</option>}
+          {agents.map((a) => (
+            <option key={a.agent_id} value={a.agent_id}>
+              {agentLabel(a)}
+            </option>
+          ))}
+        </select>
+      </label>
+      <label className="hub-field">
+        <span>Scope</span>
+        <select
+          className="select"
+          aria-label="Scope"
+          value={state.scope ?? ''}
+          onChange={(e) => onChange({ scope: e.target.value === 'private' || e.target.value === 'fleet' ? e.target.value : undefined })}
+        >
+          <option value="">Private and fleet</option>
+          <option value="private">Private</option>
+          <option value="fleet">Fleet</option>
+        </select>
+      </label>
+      <p className="hub-note">
+        Private entries shown are {viewerName ? agentLabel(viewerName) : viewer}'s; other agents' private entries are never readable.
+      </p>
+    </div>
+  );
+}
+
+function NamespaceEntries({
+  namespace,
+  state,
+  entries,
+  loading,
+  writerName,
+  onSaved,
+}: {
+  namespace: string;
+  state: HubUrlState;
+  entries: ObserveHubEntry[];
+  loading: boolean;
+  writerName: (id: string | null) => string;
+  onSaved: () => void;
+}) {
+  const [selectedId, setSelectedId] = useState<string | undefined>();
+  const now = useMemo(() => Date.now(), [entries]);
+  const selected = entries.find((e) => e.entry_id === selectedId);
+  return (
+    <>
+      <p className="hub-crumbs">
+        <a href={`#${hubPath(undefined, state)}`}>All namespaces</a>
+      </p>
+      <h3 className="hub-title">
+        <code>{namespace}</code>
+      </h3>
+      <DataTable
+        id="hub-entries"
+        columns={entryColumns(writerName, now)}
+        rows={entries}
+        rowKey={(e) => e.entry_id}
+        selectedKey={selectedId}
+        onRowOpen={(e) => setSelectedId(e.entry_id)}
+        loading={loading}
+        empty={<EmptyState title="No entries in this namespace" hint="Expired entries are hidden; try the other scope or viewer." />}
+      />
+      {selected && (
+        <HubEntryDetail key={selected.entry_id} entry={selected} writer={writerName(selected.agent_id)} onSaved={onSaved} />
+      )}
+    </>
+  );
+}
+
+function NamespaceList({ rows, state, loading }: { rows: ObserveHubEntry[]; state: HubUrlState; loading: boolean }) {
+  return (
+    <DataTable
+      id="hub-namespaces"
+      columns={NAMESPACE_COLUMNS}
+      rows={groupNamespaces(rows)}
+      rowKey={(n) => n.namespace}
+      onRowOpen={(n) => navigate(hubPath(n.namespace, state))}
+      loading={loading}
+      empty={
+        <EmptyState
+          title="No hub entries"
+          hint="Agents publish shared context with hub().publish or the hub_publish tool (or POST /api/v1/hub); namespaces appear here."
+        />
+      }
+    />
+  );
+}
+
+/** The URL state, the sorted agents and the viewer (the `agent` param, else the first agent by name). */
+function useHubViewer() {
+  const route = useRoute();
+  const queryString = route.query.toString();
+  const state = useMemo(() => parseHubQuery(route.query), [queryString]);
+  const agents = useAgents();
+  const sorted = useMemo(() => sortAgents(agents.data ?? []), [agents.data]);
+  return { state, agents, sorted, viewer: state.agent ?? sorted[0]?.agent_id };
+}
+
+function HubContent({ namespace }: { namespace: string | undefined }) {
+  const { state, agents, sorted, viewer } = useHubViewer();
+  const [refreshKey, setRefreshKey] = useState(0);
+  const filter: HubEntryFilter | undefined =
+    viewer === undefined ? undefined : { agent_id: viewer, namespace, scope: state.scope, limit: HUB_LIMIT };
+  const entries = useHubEntries(filter, refreshKey);
+
+  if (agents.error instanceof ObserveDaemonDownError || entries.error instanceof ObserveDaemonDownError) return <ObserveDaemonDown />;
+  if (viewer === undefined) {
+    if (agents.loading || agents.error) return <ObserveError error={agents.error} />;
+    return (
+      <EmptyState
+        title="No agents yet"
+        hint="Agents publish shared context with hub().publish or the hub_publish tool (LOUSHO_OBSERVE set); once one reports to this daemon, its namespaces show up here."
+      />
+    );
+  }
+
+  const names = new Map(sorted.map((a) => [a.agent_id, agentLabel(a)]));
+  const writerName = (id: string | null) => (id === null ? '-' : (names.get(id) ?? id));
+  // Changing the viewer to the default drops `agent`; any filter edit replaces the history entry.
+  const update = (patch: HubUrlState) => {
+    const next = { ...state, ...patch };
+    if (next.agent === sorted[0]?.agent_id) delete next.agent;
+    navigate(hubPath(namespace, next), { replace: true });
+  };
+  const rows = entries.data ?? [];
+
+  return (
+    <>
+      <HubBar agents={sorted} viewer={viewer} state={state} onChange={update} />
+      <ObserveError error={entries.error} />
+      {rows.length >= HUB_LIMIT && (
+        <p className="hub-note" role="status">
+          The daemon returned its {fmtInt(HUB_LIMIT)}-entry limit; this list may be incomplete.
+        </p>
+      )}
+      {namespace === undefined ? (
+        <NamespaceList rows={rows} state={state} loading={entries.loading || agents.loading} />
+      ) : (
+        <NamespaceEntries
+          key={JSON.stringify([viewer, namespace])}
+          namespace={namespace}
+          state={state}
+          entries={rows}
+          loading={entries.loading}
+          writerName={writerName}
+          onSaved={() => setRefreshKey((k) => k + 1)}
+        />
+      )}
+    </>
+  );
+}
+
+/** `#/hub` and `#/hub/:namespace`, behind the daemon-down state. */
+export function HubScreen() {
+  const { path } = useRoute();
+  const health = useDaemonHealth();
+  if (health.down) return <ObserveDaemonDown />;
+  const namespace = matchRoute(`#${path}`, ['/hub/:namespace'])?.params.namespace;
+  return (
+    <section className="hub-screen" aria-label="Context Hub">
+      <h2 className="visually-hidden">Context Hub</h2>
+      <HubContent namespace={namespace} />
+    </section>
+  );
+}
diff --git a/apps/agent-forge/src/screens/hub/__tests__/hub.test.tsx b/apps/agent-forge/src/screens/hub/__tests__/hub.test.tsx
new file mode 100644
index 00000000..3e3debca
--- /dev/null
+++ b/apps/agent-forge/src/screens/hub/__tests__/hub.test.tsx
@@ -0,0 +1,295 @@
+import { act } from 'react';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+
+import { HubScreen } from '../HubScreen';
+import { fmtSpan, groupNamespaces, parseEditedValue } from '../hubModel';
+import { render } from '../../../ui/__tests__/render';
+import { ToastProvider } from '../../../ui/Toast';
+import type { ObserveAgentRow, ObserveHubEntry } from '../../../observe/types';
+
+const NOW = Date.now();
+
+const agent = (agent_id: string, name: string | null): ObserveAgentRow => ({
+  agent_id,
+  project: null,
+  name,
+  version: null,
+  first_seen: NOW - 86_400_000,
+  last_heartbeat: NOW,
+  status: 'healthy',
+  heartbeat_age_ms: 0,
+  heartbeat_interval_ms: 10_000,
+  hostname: null,
+  pid: null,
+  dropped: null,
+  runs_today: 0,
+  error_rate_today: 0,
+});
+
+const entry = (e: Partial<ObserveHubEntry> & Pick<ObserveHubEntry, 'namespace' | 'key' | 'scope' | 'agent_id'>): ObserveHubEntry => {
+  const created_at = e.created_at ?? NOW - 60_000;
+  const ttl = e.ttl ?? null;
+  return {
+    entry_id: `${e.namespace}/${e.agent_id}/${e.key}`,
+    value: '"x"',
+    created_at,
+    ttl,
+    expires_at: ttl === null ? null : created_at + ttl,
+    ...e,
+  };
+};
+
+// The writer of the fleet entry is "zeta" (a-2); the viewer defaults to "alpha" (a-1, first by name).
+const README = entry({ namespace: 'docs', key: 'readme', scope: 'fleet', agent_id: 'a-2', value: '{"title":"Hi","tags":["a","b"]}', ttl: 3_600_000 });
+const DRAFT = entry({ namespace: 'docs', key: 'draft', scope: 'private', agent_id: 'a-1', value: 'plain words here', created_at: NOW - 30_000 });
+const CACHE = entry({ namespace: 'cache', key: 'warm', scope: 'fleet', agent_id: 'a-1', value: 'true', created_at: NOW - 120_000 });
+
+let entries: ObserveHubEntry[];
+let agents: ObserveAgentRow[];
+let hubRequests: URL[];
+let posts: unknown[];
+
+function stubDaemon() {
+  entries = [DRAFT, README, CACHE];
+  agents = [agent('a-2', 'zeta'), agent('a-1', 'alpha')];
+  hubRequests = [];
+  posts = [];
+  vi.stubGlobal(
+    'fetch',
+    vi.fn(async (input: RequestInfo | URL, init?: RequestInit) => {
+      const url = new URL(String(input), 'http://x');
+      const json = (body: unknown, status = 200) => new Response(JSON.stringify(body), { status });
+      if (url.pathname.endsWith('/health')) return json({ service: 'lousho-observe', ok: true });
+      if (url.pathname.endsWith('/api/v1/agents')) return json({ agents });
+      if (url.pathname.endsWith('/api/v1/hub') && init?.method === 'POST') {
+        posts.push(JSON.parse(String(init.body)));
+        return json({ entry: undefined, created: false });
+      }
+      if (url.pathname.endsWith('/api/v1/hub')) {
+        hubRequests.push(url);
+        const q = url.searchParams;
+        const viewer = q.get('agent_id');
+        const scope = q.get('scope');
+        const ns = q.get('namespace');
+        const rows = entries.filter(
+          (e) =>
+            (ns === null || e.namespace === ns) &&
+            (scope === 'fleet' ? e.scope === 'fleet' : scope === 'private' ? e.scope === 'private' && e.agent_id === viewer : e.scope === 'fleet' || e.agent_id === viewer)
+        );
+        return json({ entries: rows });
+      }
+      return json({ error: 'unexpected' }, 500);
+    })
+  );
+}
+
+async function flush() {
+  for (let i = 0; i < 5; i++) {
+    await act(async () => {
+      await new Promise((resolve) => setTimeout(resolve, 0));
+    });
+  }
+}
+
+async function mountAt(hash: string) {
+  window.history.replaceState(null, '', `/${hash}`);
+  const container = render(
+    <ToastProvider>
+      <HubScreen />
+    </ToastProvider>
+  );
+  await flush();
+  return container;
+}
+
+const rows = (c: HTMLElement) => [...c.querySelectorAll('tbody tr')] as HTMLTableRowElement[];
+const rowFor = (c: HTMLElement, text: string) => rows(c).find((r) => r.textContent?.includes(text))!;
+const buttonNamed = (c: HTMLElement, name: string) => [...c.querySelectorAll('button')].find((b) => b.textContent?.trim() === name);
+const lastHub = () => hubRequests[hubRequests.length - 1].searchParams;
+
+async function open(row: HTMLTableRowElement) {
+  act(() => row.click());
+  await flush();
+}
+
+function typeInto(el: HTMLTextAreaElement, value: string) {
+  const setter = Object.getOwnPropertyDescriptor(HTMLTextAreaElement.prototype, 'value')!.set!;
+  act(() => {
+    setter.call(el, value);
+    el.dispatchEvent(new Event('input', { bubbles: true }));
+  });
+}
+
+beforeEach(stubDaemon);
+afterEach(() => {
+  vi.unstubAllGlobals();
+  window.history.replaceState(null, '', '/');
+});
+
+describe('hubModel', () => {
+  it('groups entries by namespace with fleet/private counts and the newest update', () => {
+    expect(groupNamespaces([DRAFT, README, CACHE])).toEqual([
+      { namespace: 'cache', entries: 1, fleet: 1, private: 0, updated: CACHE.created_at },
+      { namespace: 'docs', entries: 2, fleet: 1, private: 1, updated: DRAFT.created_at },
+    ]);
+  });
+
+  it('parses an edit: JSON when it parses, the string for a plain-string entry, invalid for a JSON entry', () => {
+    expect(parseEditedValue('{"a":1}', true)).toEqual({ ok: true, value: { a: 1 } });
+    expect(parseEditedValue('just text', false)).toEqual({ ok: true, value: 'just text' });
+    expect(parseEditedValue('{"a":', true)).toEqual({ ok: false });
+  });
+
+  it('formats a span in its two largest units', () => {
+    expect(fmtSpan(3_600_000)).toBe('1h');
+    expect(fmtSpan(5_400_000)).toBe('1h 30m');
+    expect(fmtSpan(45_000)).toBe('45s');
+    expect(fmtSpan(2 * 86_400_000 + 3_600_000)).toBe('2d 1h');
+  });
+});
+
+describe('HubScreen', () => {
+  it("#/hub lists namespaces derived from the viewer agent's entries (first agent by name)", async () => {
+    const c = await mountAt('#/hub');
+    expect(lastHub().get('agent_id')).toBe('a-1');
+    expect(lastHub().get('limit')).toBe('1000');
+    expect(lastHub().get('namespace')).toBeNull();
+    const viewer = c.querySelector('select[aria-label="Viewing as"]') as HTMLSelectElement;
+    expect(viewer.value).toBe('a-1');
+    expect([...viewer.options].map((o) => o.textContent)).toEqual(['alpha', 'zeta']);
+    expect(rows(c).map((r) => r.querySelector('td')?.textContent)).toEqual(['cache', 'docs']);
+    const docs = [...rowFor(c, 'docs').querySelectorAll('td')].map((td) => td.textContent);
+    expect(docs.slice(0, 4)).toEqual(['docs', '2', '1', '1']);
+    expect(c.textContent).toContain("Private entries shown are alpha's");
+    expect(c.textContent).not.toContain('may be incomplete');
+  });
+
+  it('opening a namespace goes to #/hub/:namespace and keeps the query', async () => {
+    const c = await mountAt('#/hub?scope=fleet');
+    await open(rowFor(c, 'docs'));
+    expect(window.location.hash).toBe('#/hub/docs?scope=fleet');
+  });
+
+  it('notes when the daemon returned the 1000-row cap', async () => {
+    entries = Array.from({ length: 1000 }, (_, i) => entry({ namespace: `ns${i % 3}`, key: `k${i}`, scope: 'fleet', agent_id: 'a-1' }));
+    const c = await mountAt('#/hub');
+    expect(c.textContent).toContain('may be incomplete');
+  });
+
+  it('the scope filter: ?scope=fleet is sent to the daemon, and picking a scope writes the URL', async () => {
+    let c = await mountAt('#/hub/docs?scope=fleet');
+    expect(lastHub().get('scope')).toBe('fleet');
+    expect(lastHub().get('namespace')).toBe('docs');
+    expect(rows(c).map((r) => r.textContent)).toHaveLength(1);
+
+    c = await mountAt('#/hub/docs');
+    expect(lastHub().get('scope')).toBeNull();
+    const scope = c.querySelector('select[aria-label="Scope"]') as HTMLSelectElement;
+    expect(scope.value).toBe('');
+    act(() => {
+      scope.value = 'private';
+      scope.dispatchEvent(new Event('change', { bubbles: true }));
+    });
+    await flush();
+    expect(window.location.hash).toBe('#/hub/docs?scope=private');
+    expect(lastHub().get('scope')).toBe('private');
+
+    const s2 = c.querySelector('select[aria-label="Scope"]') as HTMLSelectElement;
+    act(() => {
+      s2.value = '';
+      s2.dispatchEvent(new Event('change', { bubbles: true }));
+    });
+    await flush();
+    expect(window.location.hash).toBe('#/hub/docs');
+  });
+
+  it('switching the viewer writes ?agent= (the default writes nothing)', async () => {
+    const c = await mountAt('#/hub/docs');
+    const viewer = c.querySelector('select[aria-label="Viewing as"]') as HTMLSelectElement;
+    act(() => {
+      viewer.value = 'a-2';
+      viewer.dispatchEvent(new Event('change', { bubbles: true }));
+    });
+    await flush();
+    expect(window.location.hash).toBe('#/hub/docs?agent=a-2');
+    expect(lastHub().get('agent_id')).toBe('a-2');
+  });
+
+  it('the key/value table shows key, preview, scope, writer name, updated and TTL', async () => {
+    const c = await mountAt('#/hub/docs');
+    const readme = rowFor(c, 'readme');
+    expect(readme.textContent).toContain('{"title":"Hi"');
+    expect(readme.querySelector('.status-pill')?.textContent).toBe('fleet');
+    expect(readme.textContent).toContain('zeta');
+    expect(readme.textContent).toMatch(/1h - expires in 5[89]m/);
+    const draft = rowFor(c, 'draft');
+    expect(draft.querySelector('.status-pill')?.textContent).toBe('private');
+    expect(draft.textContent).toContain('alpha');
+    expect(draft.textContent).toContain('never');
+    // Updated carries seconds.
+    expect(draft.textContent).toMatch(/\d\d:\d\d:\d\d/);
+  });
+
+  it('a JSON value renders with JsonView; a plain string renders as preformatted text', async () => {
+    const c = await mountAt('#/hub/docs');
+    await open(rowFor(c, 'readme'));
+    const detail = c.querySelector('.hub-value')!;
+    expect(detail.querySelector('.json-node')).not.toBeNull();
+    expect(detail.textContent).toContain('title');
+    expect(detail.querySelector('pre')).toBeNull();
+
+    await open(rowFor(c, 'draft'));
+    const plain = c.querySelector('.hub-value')!;
+    expect(plain.querySelector('.json-node')).toBeNull();
+    expect(plain.querySelector('pre')?.textContent).toBe('plain words here');
+  });
+
+  it('private entries have no Edit; fleet entries do', async () => {
+    const c = await mountAt('#/hub/docs');
+    await open(rowFor(c, 'draft'));
+    expect(buttonNamed(c, 'Edit')).toBeUndefined();
+    await open(rowFor(c, 'readme'));
+    expect(buttonNamed(c, 'Edit')).toBeDefined();
+  });
+
+  it("Edit on a fleet entry POSTs the writer's agent_id, scope fleet and the original ttl, then refreshes", async () => {
+    const c = await mountAt('#/hub/docs');
+    await open(rowFor(c, 'readme'));
+    act(() => buttonNamed(c, 'Edit')!.click());
+    const textarea = c.querySelector('textarea') as HTMLTextAreaElement;
+    expect(JSON.parse(textarea.value)).toEqual({ title: 'Hi', tags: ['a', 'b'] });
+    expect(c.textContent).toContain('restarts the TTL clock');
+
+    // Invalid JSON stays in the editor and sends nothing.
+    typeInto(textarea, '{"title":');
+    act(() => buttonNamed(c, 'Save')!.click());
+    await flush();
+    expect(posts).toHaveLength(0);
+    expect(c.querySelector('textarea')).not.toBeNull();
+
+    typeInto(c.querySelector('textarea') as HTMLTextAreaElement, '{"title":"Bye"}');
+    const before = hubRequests.length;
+    act(() => buttonNamed(c, 'Save')!.click());
+    await flush();
+    expect(posts).toEqual([{ agent_id: 'a-2', namespace: 'docs', key: 'readme', value: { title: 'Bye' }, scope: 'fleet', ttl: 3_600_000 }]);
+    expect(c.querySelector('textarea')).toBeNull();
+    expect(hubRequests.length).toBeGreaterThan(before);
+    expect(document.body.textContent).toContain('Saved readme');
+  });
+
+  it('Cancel closes the editor without a request', async () => {
+    const c = await mountAt('#/hub/docs');
+    await open(rowFor(c, 'readme'));
+    act(() => buttonNamed(c, 'Edit')!.click());
+    act(() => buttonNamed(c, 'Cancel')!.click());
+    expect(c.querySelector('textarea')).toBeNull();
+    expect(posts).toHaveLength(0);
+  });
+
+  it('no agents: an empty state explaining that agents publish to the hub, and no hub request', async () => {
+    agents = [];
+    const c = await mountAt('#/hub');
+    expect(c.textContent).toContain('No agents yet');
+    expect(hubRequests).toHaveLength(0);
+  });
+});
diff --git a/apps/agent-forge/src/screens/hub/hub.css b/apps/agent-forge/src/screens/hub/hub.css
new file mode 100644
index 00000000..fd270cf3
--- /dev/null
+++ b/apps/agent-forge/src/screens/hub/hub.css
@@ -0,0 +1,104 @@
+/* Context Hub (#/hub, #/hub/:namespace). Tokens only. */
+.hub-screen {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  min-width: 0;
+  padding: 12px 16px;
+}
+.hub-bar {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px 16px;
+}
+.hub-field {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  font-size: 13px;
+  color: var(--text-muted);
+}
+.hub-note,
+.hub-crumbs {
+  margin: 0;
+  font-size: 13px;
+  color: var(--text-muted);
+}
+.hub-invalid {
+  color: var(--danger);
+}
+.hub-title,
+.hub-section-title {
+  margin: 0;
+  font-size: 15px;
+  font-weight: 600;
+  overflow-wrap: anywhere;
+}
+.hub-section-title {
+  font-size: 13px;
+}
+.hub-title code,
+.hub-section-title code {
+  font-family: var(--font-mono);
+  font-size: 13px;
+}
+.hub-preview {
+  font-family: var(--font-mono);
+  font-size: 12px;
+}
+.hub-entry {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 12px;
+  border: 1px solid var(--border);
+  border-radius: 6px;
+  background: var(--surface);
+  min-width: 0;
+}
+.hub-entry-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+}
+.hub-value {
+  overflow: auto;
+  max-height: 480px;
+  font-family: var(--font-mono);
+  font-size: 12px;
+}
+.hub-value-text {
+  margin: 0;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+.hub-editor {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+.hub-editor-label {
+  font-size: 13px;
+  font-weight: 600;
+}
+.hub-editor-text {
+  width: 100%;
+  box-sizing: border-box;
+  font-family: var(--font-mono);
+  font-size: 12px;
+  padding: 8px;
+  border: 1px solid var(--border);
+  border-radius: 4px;
+  background: var(--bg);
+  color: var(--text);
+  resize: vertical;
+}
+.hub-editor-text[aria-invalid='true'] {
+  border-color: var(--danger);
+}
+.hub-editor-actions {
+  display: flex;
+  gap: 8px;
+}
diff --git a/apps/agent-forge/src/screens/hub/hubModel.ts b/apps/agent-forge/src/screens/hub/hubModel.ts
new file mode 100644
index 00000000..b6b8c281
--- /dev/null
+++ b/apps/agent-forge/src/screens/hub/hubModel.ts
@@ -0,0 +1,131 @@
+/**
+ * Pure pieces of the Context Hub screen: its URL state, the namespace list
+ * derived from entry rows (the daemon has no namespace endpoint), value
+ * parsing for display and editing, and TTL text.
+ *
+ * URL shapes: `#/hub` (namespaces) and `#/hub/:namespace` (its entries), both
+ * taking `?agent=<agent_id>` (the "Viewing as" identity; absent = the first
+ * agent by name) and `?scope=private|fleet` (absent = both). Defaults are
+ * never written.
+ */
+import type { ObserveAgentRow, ObserveHubEntry, ObserveHubScope } from '../../observe/types';
+
+/** The daemon's max `limit`; a page this full may be cut short. */
+export const HUB_LIMIT = 1000;
+
+/** The parsed hub query; absent fields are the defaults. */
+export interface HubUrlState {
+  agent?: string;
+  scope?: ObserveHubScope;
+}
+
+/** Read `agent` and `scope` from the hub query; an unknown scope is dropped. */
+export function parseHubQuery(query: URLSearchParams): HubUrlState {
+  const state: HubUrlState = {};
+  const agent = query.get('agent');
+  const scope = query.get('scope');
+  if (agent) state.agent = agent;
+  if (scope === 'private' || scope === 'fleet') state.scope = scope;
+  return state;
+}
+
+/** The hash path for the namespace list (no namespace) or one namespace, with the non-default query. */
+export function hubPath(namespace: string | undefined, state: HubUrlState): string {
+  const params = new URLSearchParams();
+  if (state.agent) params.set('agent', state.agent);
+  if (state.scope) params.set('scope', state.scope);
+  const qs = params.toString();
+  return `/hub${namespace === undefined ? '' : `/${encodeURIComponent(namespace)}`}${qs ? `?${qs}` : ''}`;
+}
+
+/** The display name of an agent: its registered name, else a short id. */
+export const agentLabel = (a: ObserveAgentRow): string => a.name ?? a.agent_id.slice(0, 8);
+
+/** Agents sorted by display name, the "Viewing as" option order (the first is the default viewer). */
+export const sortAgents = (agents: readonly ObserveAgentRow[]): ObserveAgentRow[] =>
+  [...agents].sort((a, b) => agentLabel(a).localeCompare(agentLabel(b)) || a.agent_id.localeCompare(b.agent_id));
+
+/** One row of the namespace list. */
+export interface HubNamespaceRow {
+  namespace: string;
+  entries: number;
+  fleet: number;
+  private: number;
+  /** Newest `created_at` (last publish) in the namespace. */
+  updated: number;
+}
+
+/** Group entry rows by namespace, sorted by name. */
+export function groupNamespaces(entries: readonly ObserveHubEntry[]): HubNamespaceRow[] {
+  const groups = new Map<string, HubNamespaceRow>();
+  for (const e of entries) {
+    const row = groups.get(e.namespace) ?? { namespace: e.namespace, entries: 0, fleet: 0, private: 0, updated: 0 };
+    row.entries += 1;
+    if (e.scope === 'fleet') row.fleet += 1;
+    else row.private += 1;
+    row.updated = Math.max(row.updated, e.created_at);
+    groups.set(e.namespace, row);
+  }
+  return [...groups.values()].sort((a, b) => a.namespace.localeCompare(b.namespace));
+}
+
+/** A stored value: parsed JSON when it parses, else the raw string. */
+export type HubValue = { json: true; parsed: unknown } | { json: false; text: string };
+
+export function parseValue(value: string | null): HubValue {
+  if (value === null) return { json: true, parsed: null };
+  try {
+    return { json: true, parsed: JSON.parse(value) as unknown };
+  } catch {
+    return { json: false, text: value };
+  }
+}
+
+/** The editor's starting text: pretty JSON for a JSON value, else the string as stored. */
+export function editableText(value: string | null): string {
+  const parsed = parseValue(value);
+  return parsed.json ? JSON.stringify(parsed.parsed, null, 2) : parsed.text;
+}
+
+/**
+ * The value to publish from edited text: JSON when it parses; otherwise the
+ * text itself for an entry that was a plain string, and invalid for an entry
+ * that held JSON (it stays JSON).
+ */
+export function parseEditedValue(text: string, wasJson: boolean): { ok: true; value: unknown } | { ok: false } {
+  try {
+    return { ok: true, value: JSON.parse(text) as unknown };
+  } catch {
+    return wasJson ? { ok: false } : { ok: true, value: text };
+  }
+}
+
+/** One line of the stored value for the table, whitespace collapsed. */
+export const valuePreview = (value: string | null): string => (value === null ? 'null' : value.replace(/\s+/g, ' ').trim().slice(0, 300));
+
+const UNITS: [string, number][] = [
+  ['d', 86_400],
+  ['h', 3_600],
+  ['m', 60],
+  ['s', 1],
+];
+
+/** A span in its two largest non-zero units, to the second: `1h 30m`, `45s`, `2d 1h`. */
+export function fmtSpan(ms: number): string {
+  let rest = Math.max(0, Math.round(ms / 1000));
+  const parts: string[] = [];
+  for (const [unit, size] of UNITS) {
+    const n = Math.floor(rest / size);
+    rest -= n * size;
+    if (n > 0 || parts.length > 0) parts.push(`${n}${unit}`);
+    if (parts.length === 2) break;
+  }
+  const shown = parts.filter((p, i) => i === 0 || !p.startsWith('0'));
+  return shown.length > 0 ? shown.join(' ') : '0s';
+}
+
+/** The TTL cell: `never`, or the lifetime and the time left. */
+export function ttlText(entry: ObserveHubEntry, now: number): string {
+  if (entry.ttl === null || entry.expires_at === null) return 'never';
+  return `${fmtSpan(entry.ttl)} - expires in ${fmtSpan(entry.expires_at - now)}`;
+}
diff --git a/apps/agent-forge/src/screens/routes.tsx b/apps/agent-forge/src/screens/routes.tsx
index a5ca2ec1..61c76ac6 100644
--- a/apps/agent-forge/src/screens/routes.tsx
+++ b/apps/agent-forge/src/screens/routes.tsx
@@ -6,6 +6,7 @@ import { SettingsPanel } from '../components/SettingsPanel';
 import { TracesScreen } from './traces/TracesScreen';
 import { ThreadsScreen } from './threads/ThreadsScreen';
 import { PromptsScreen } from './prompts/PromptsScreen';
+import { HubScreen } from './hub/HubScreen';
 import { AgentsScreen } from './agents/AgentsScreen';
 import { TraceScreen } from './traces/TraceScreen';
 import { MonitoringScreen } from './monitoring/MonitoringScreen';
@@ -69,7 +70,6 @@ export function useScreen(): ScreenId {
 
 const PLACEHOLDERS: Partial<Record<ScreenId, { title: string; blurb: string }>> = {
   evals: { title: 'Evaluations', blurb: 'Datasets, evaluators and annotation queues for scoring runs.' },
-  hub: { title: 'Context Hub', blurb: 'The shared context namespaces your agents read from, browsable by namespace.' },
 };
 
 /** `#/traces/:traceId`: the trace id comes from the hash; a new id remounts the screen. */
@@ -104,6 +104,7 @@ export function Screens() {
   else if (screen === 'playground') content = <PlaygroundRoute />;
   else if (screen === 'threads') content = <ThreadsScreen />;
   else if (screen === 'prompts') content = <PromptsScreen />;
+  else if (screen === 'hub') content = <HubScreen />;
   else if (placeholder) content = <Placeholder {...placeholder} />;
   else
     content = (