InstaNode-dev
diff --git a/‎src/api/index.ts‎
Lines changed: 71 additions & 0 deletions b/‎src/api/index.ts‎
Lines changed: 71 additions & 0 deletions
diff --git a/‎src/components/AuditPanel.test.tsx‎
Lines changed: 112 additions & 0 deletions b/‎src/components/AuditPanel.test.tsx‎
Lines changed: 112 additions & 0 deletions
@@ -554,6 +554,77 @@ export async function getResourceMetrics(
   return r
 }
 
+// ─── Resource audit ─────────────────────────────────────────────────────
+//
+// W7-C/W11: the team-level audit log (GET /api/v1/audit) returns rows
+// scoped to either `team_id = caller_team` OR `metadata.resource_id`
+// pointing at a resource the caller owns. There is no per-resource
+// endpoint yet — instead we fetch the team window and filter client-side
+// for rows whose metadata.resource_id matches the resource we're looking
+// at. The endpoint enforces a tier-derived hard lookback floor (Hobby
+// 30d, Pro 90d, Team unlimited; anonymous/free 402s), so this surface
+// renders an "upgrade required" state on 402 rather than throwing.
+//
+// Wire shape (from auditEventToMap):
+//   { id, kind, created_at, metadata, actor_user_id, actor_email_masked }
+//
+// `metadata` is unmarshalled JSON or null. We surface metadata.resource_id
+// and metadata.summary when present; everything else lands in the raw
+// metadata JSON column on the table for transparency.
+export interface ResourceAuditEvent {
+  id: string
+  kind: string
+  created_at: string
+  actor_user_id: string | null
+  actor_email_masked: string | null
+  metadata: Record<string, unknown> | null
+}
+
+export interface ResourceAuditResponse {
+  ok: true
+  items: ResourceAuditEvent[]
+  total_returned: number
+  next_cursor: string | null
+  lookback_days: number
+  tier: string
+}
+
+/**
+ * Fetch audit rows scoped to a single resource over the last `sinceHours`
+ * hours. Implementation: call GET /api/v1/audit?since=<iso>&limit=200 and
+ * filter client-side for rows whose metadata.resource_id matches. The
+ * team-level endpoint already enforces ownership (rows are returned only
+ * if `team_id = caller_team` OR the metadata.resource_id points at a
+ * resource the caller owns), so the client-side filter is a precision
+ * cut, not a security boundary.
+ *
+ * On 402 (anonymous/free tier) the call propagates so the caller can
+ * render an upgrade prompt instead of an error banner.
+ */
+export async function fetchResourceAudit(
+  resourceId: string,
+  sinceHours: number = 24,
+  limit: number = 200,
+): Promise<ResourceAuditResponse> {
+  const sinceIso = new Date(Date.now() - sinceHours * 60 * 60 * 1000).toISOString()
+  const path = `/api/v1/audit?since=${encodeURIComponent(sinceIso)}&limit=${limit}`
+  const r = await call<ResourceAuditResponse>(path)
+  const items = (r.items ?? []).filter((ev) => {
+    if (!ev.metadata || typeof ev.metadata !== 'object') return false
+    const ridRaw = (ev.metadata as Record<string, unknown>).resource_id
+    if (typeof ridRaw !== 'string') return false
+    return ridRaw === resourceId
+  })
+  return {
+    ok: true,
+    items,
+    total_returned: items.length,
+    next_cursor: r.next_cursor ?? null,
+    lookback_days: r.lookback_days ?? 0,
+    tier: r.tier ?? '',
+  }
+}
+
 // ─── Stacks / deployments ───
 // GET /api/v1/stacks returns one row per stack including the real env
 // (production / staging / dev / ...) and parent_stack_id linkage. We adapt
 
@@ -0,0 +1,112 @@
+/* AuditPanel.test.tsx — per-resource audit tab renderer.
+ *
+ * The panel calls api.fetchResourceAudit(resourceId, 24) on mount. The
+ * underlying api helper hits GET /api/v1/audit?since=<24h-ago>&limit=200
+ * and filters client-side for rows whose metadata.resource_id matches —
+ * the panel doesn't re-filter, it trusts the helper.
+ *
+ * State pins:
+ *   - loading → renders <skel>
+ *   - ready + 0 rows → empty state with `audit-empty` testid
+ *   - ready + N rows → table with `audit-row-<id>` per row
+ *   - 402 → upgrade-required CTA
+ *   - other error → error banner
+ */
+
+import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest'
+import { render, screen, waitFor, cleanup } from '@testing-library/react'
+import { AuditPanel } from './AuditPanel'
+
+vi.mock('../api', async () => {
+  const actual = await vi.importActual<typeof import('../api')>('../api')
+  return {
+    ...actual,
+    fetchResourceAudit: vi.fn(),
+  }
+})
+import * as api from '../api'
+const mockFetch = api.fetchResourceAudit as unknown as ReturnType<typeof vi.fn>
+
+beforeEach(() => mockFetch.mockReset())
+afterEach(() => cleanup())
+
+describe('AuditPanel — load states', () => {
+  it('shows the skeleton while the audit fetch is in flight', () => {
+    mockFetch.mockReturnValueOnce(new Promise(() => { /* never resolves */ }))
+    render(<AuditPanel resourceId="res_abc" />)
+    expect(screen.getByTestId('audit-loading')).toBeTruthy()
+  })
+
+  it('shows the empty state when the fetch resolves with zero events', async () => {
+    mockFetch.mockResolvedValueOnce({
+      ok: true,
+      items: [],
+      total_returned: 0,
+      next_cursor: null,
+      lookback_days: 90,
+      tier: 'pro',
+    })
+    render(<AuditPanel resourceId="res_abc" />)
+    await waitFor(() => expect(screen.getByTestId('audit-empty')).toBeTruthy())
+    // Empty-state copy must NOT lie ("No audit events"). Sanity-check.
+    expect(screen.getByTestId('audit-empty').textContent).toMatch(/no audit events/i)
+  })
+
+  it('renders one row per event when the fetch resolves with data', async () => {
+    mockFetch.mockResolvedValueOnce({
+      ok: true,
+      items: [
+        {
+          id: 'ev_1',
+          kind: 'resource.rotate',
+          created_at: '2026-05-14T10:00:00Z',
+          actor_user_id: 'u1',
+          actor_email_masked: 'm***@example.com',
+          metadata: { resource_id: 'res_abc', source: 'agent' },
+        },
+        {
+          id: 'ev_2',
+          kind: 'resource.delete',
+          created_at: '2026-05-14T11:00:00Z',
+          actor_user_id: null,
+          actor_email_masked: null,
+          metadata: { resource_id: 'res_abc' },
+        },
+      ],
+      total_returned: 2,
+      next_cursor: null,
+      lookback_days: 90,
+      tier: 'pro',
+    })
+    render(<AuditPanel resourceId="res_abc" />)
+    await waitFor(() => expect(screen.getByTestId('audit-table')).toBeTruthy())
+    expect(screen.getByTestId('audit-row-ev_1')).toBeTruthy()
+    expect(screen.getByTestId('audit-row-ev_2')).toBeTruthy()
+    expect(screen.getByTestId('audit-row-ev_1').textContent).toContain('resource.rotate')
+    expect(screen.getByTestId('audit-row-ev_1').textContent).toContain('m***@example.com')
+    // Rows with no actor render "system" rather than a blank cell.
+    expect(screen.getByTestId('audit-row-ev_2').textContent).toContain('system')
+  })
+
+  it('renders the upgrade-required CTA on 402', async () => {
+    const err: any = new Error('Audit log export requires the Hobby plan or higher.')
+    err.status = 402
+    mockFetch.mockRejectedValueOnce(err)
+    render(<AuditPanel resourceId="res_abc" />)
+    await waitFor(() => expect(screen.getByTestId('audit-upgrade-required')).toBeTruthy())
+    // The CTA must surface the pricing link so users have a path forward.
+    const link = screen
+      .getByTestId('audit-upgrade-required')
+      .querySelector('a[href*="pricing"]') as HTMLAnchorElement
+    expect(link).toBeTruthy()
+  })
+
+  it('renders an error banner on a non-402 failure', async () => {
+    const err: any = new Error('db_failed')
+    err.status = 503
+    mockFetch.mockRejectedValueOnce(err)
+    render(<AuditPanel resourceId="res_abc" />)
+    await waitFor(() => expect(screen.getByTestId('audit-error')).toBeTruthy())
+    expect(screen.getByTestId('audit-error').textContent).toContain('db_failed')
+  })
+})