@startsimpli/ui 0.4.80 → 0.4.82

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startsimpli/ui",
-  "version": "0.4.80",
+  "version": "0.4.82",
   "description": "Shared UI components package for StartSimpli applications",
   "main": "./src/index.ts",
   "types": "./src/index.ts",
@@ -44,7 +44,7 @@
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0",
     "@startsimpli/auth": "^0.4.31",
-    "@startsimpli/api": "^0.5.49"
+    "@startsimpli/api": "^0.5.51"
   },
   "peerDependenciesMeta": {
     "@startsimpli/api": {

package/src/components/ActivityTimeline.tsx

@@ -119,6 +119,21 @@ function actorName(actor?: ActivityTimelineActor): string {
   return (actor?.name ?? '').trim() || (actor?.email ?? '').trim();
 }
 
+/**
+ * The second half of the identity — the address, when the display name is
+ * something else (startsim-768w.19.8).
+ *
+ * A display name is free text: an account called "QA Foundry" reads exactly
+ * like the name of a FOUNDRY, so a correct feed looked to its owner like it was
+ * showing another tenant's activity. The email is the unambiguous handle, and
+ * it is what turns a name that could be anything into a person. Empty when the
+ * name IS the email, because printing it twice is noise.
+ */
+function actorHandle(actor?: ActivityTimelineActor): string {
+  const email = (actor?.email ?? '').trim();
+  return email && email !== actorName(actor) ? email : '';
+}
+
 function dayKey(iso: string): string {
   const d = new Date(iso);
   return Number.isNaN(d.getTime()) ? 'unknown' : d.toDateString();
@@ -181,6 +196,7 @@ function TimelineEntry({
     (tone ? TONE_MARKER[tone] : undefined) ||
     'bg-muted text-muted-foreground';
   const who = actorName(activity.actor);
+  const handle = actorHandle(activity.actor);
   // With no icon the marker itself becomes the avatar, so the metadata line
   // shows the name alone rather than the same initials twice.
   const markerIsAvatar = !Icon && !!initials;
@@ -224,13 +240,14 @@ function TimelineEntry({
 
         <div className="flex flex-wrap items-center gap-x-4 gap-y-1 text-sm text-muted-foreground">
           {who && (
-            <span className="flex items-center gap-1.5">
+            <span className="flex flex-wrap items-center gap-x-1.5">
               {initials && !markerIsAvatar && (
                 <span className="flex h-5 w-5 items-center justify-center rounded-full bg-muted text-[10px] font-medium text-muted-foreground">
                   {initials}
                 </span>
               )}
-              {who}
+              <span>{who}</span>
+              {handle && <span className="text-xs text-muted-foreground/80">{handle}</span>}
             </span>
           )}
 

package/src/components/activity/AccountActivityPanel.tsx

@@ -0,0 +1,55 @@
+'use client';
+
+/**
+ * AccountActivityPanel — the PLATFORM-SCOPE activity composer
+ * (startsim-768w.19.1.5).
+ *
+ * The same event stream as `ActivityFeedPanel` renders for one foundry, at the
+ * scope ABOVE any foundry: the rows that belong to no single one of them.
+ * Sign-ins are the whole population today — central auth mints tokens for every
+ * app, so a login is recorded once, for the person, with an empty tenant slug.
+ * A user with access to N foundries would otherwise get N duplicate rows or one
+ * arbitrarily-attributed one; the row is right, and it needed a reader with a
+ * scope of its own.
+ *
+ * DELIBERATELY ALMOST NOTHING. The paging, filtering, day grouping, infinite
+ * scroll and three empty states are `ActivityFeedPanel`'s, and the rendering is
+ * `ActivityTimeline`'s — both already built to render whatever the stream
+ * returns and to humanise an action they have never seen. What this adds is the
+ * COPY: an account-scope surface has to say why its rows name no foundry, and
+ * has to describe an empty page without claiming nothing happened, because the
+ * server answers a caller who may not read sign-ins with an empty page rather
+ * than a 403. Every prop stays overridable — a host that wants different words
+ * passes them, it does not fork the panel.
+ *
+ * The consuming app supplies `{ list: (p) => api.foundry.accountActivity(p) }`
+ * and its theme classNames. Nothing else — rule #9.
+ */
+import { ActivityFeedPanel, type ActivityFeedPanelProps } from './ActivityFeedPanel';
+
+/** Same props as the feed it composes: there is no account-only knob, and a
+ *  `slug` would be a lie — these events have no foundry. */
+export type AccountActivityPanelProps = ActivityFeedPanelProps;
+
+/** Cache namespace for the platform-scope stream. Deliberately NOT under a
+ *  foundry key, so invalidating one foundry never refetches it and vice versa. */
+export const ACCOUNT_ACTIVITY_QUERY_KEY = ['account', 'activity'] as const;
+
+export function AccountActivityPanel(props: AccountActivityPanelProps) {
+  return (
+    <ActivityFeedPanel
+      queryKey={ACCOUNT_ACTIVITY_QUERY_KEY}
+      title="Account activity"
+      description="Sign-ins across your account, newest first. These belong to the person rather than to one foundry, so they live here instead of on a foundry's own Activity tab."
+      // NOT "nothing has happened": an admin, member or viewer gets an empty
+      // page rather than a 403 (a 403 would confirm the rows exist), so copy
+      // that asserted the stream was empty would be wrong for most readers.
+      emptyTitle="No account activity to show"
+      emptyDescription="Sign-ins show up here. Sign-in history — who signed in, when and from where — is visible to foundry owners."
+      filteredEmptyTitle="No account activity matches these filters"
+      filteredEmptyDescription="Widen the date range or clear a filter to see more."
+      errorTitle="Could not load account activity"
+      {...props}
+    />
+  );
+}

package/src/components/activity/ActivityFeedPanel.tsx

@@ -101,7 +101,12 @@ export function ActivityFeedPanel({
   pageSize = 25,
   refetchInterval = false,
   title = 'Activity',
-  description = 'Everything that happened here, newest first — as much as your access level allows.',
+  // WHO DID WHAT — the user's own framing of this surface, and the line that
+  // separates it from a deployment/run history (startsim-768w.19.8). The old
+  // copy hedged with "as much as your access level allows", which named a
+  // constraint the reader cannot act on; the permission filtering is invisible
+  // and correct by design, so it does not belong in the description.
+  description = 'Who did what here, newest first — sign-ins, invites and role changes, settings and pipeline edits, and who started each build.',
   headerAside,
   renderFooter,
   showFilters = true,

package/src/components/activity/__tests__/account-activity.test.tsx

@@ -0,0 +1,153 @@
+/**
+ * startsim-768w.19.1.5 (RED) — the PLATFORM-SCOPE activity surface.
+ *
+ * `record_login()` writes a `member_login` row for every successful sign-in,
+ * with `tenant_slug=""` because a control-plane login belongs to the PERSON, not
+ * to one of the N foundries they can reach. The only reader was the per-foundry
+ * feed, which filters by slug — so the row was captured, permissioned and
+ * unreachable in every UI.
+ *
+ * THE SURFACE IS A CONSUMER, NOT A SECOND FEED. Everything here already exists:
+ * `ActivityFeedPanel` (paging, filters, day grouping, three empty states) over
+ * `ActivityTimeline` (the primitive), both built to render whatever the stream
+ * returns and to humanise an action they have never seen. The account scope
+ * differs by ONE thing — which client call it makes — plus the copy that says
+ * why these rows name no foundry. A second timeline here would be the bug.
+ */
+import * as fs from 'node:fs'
+import * as path from 'node:path'
+import { render, screen, waitFor, within } from '@testing-library/react'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+
+import {
+  AccountActivityPanel,
+  activityLabel,
+  activityTarget,
+  toActivityTimelineItems,
+  type ActivityEvent,
+  type ActivityPage,
+  type ActivityQuery,
+} from '../index'
+
+function login(over: Partial<ActivityEvent> & { id: string }): ActivityEvent {
+  return {
+    action: 'member_login',
+    type: 'member_login',
+    target_type: 'user',
+    target_id: '3f1c9e40-2b7a-4a11-9c33-8f0b2a5d61ee',
+    metadata: { app: 'foundry', method: 'credentials', user_agent: 'Firefox/141.0' },
+    actor: { id: 'u-1', email: 'ada@x.com', name: 'Ada Lovelace' },
+    actor_email: 'ada@x.com',
+    state: null,
+    previous_state: null,
+    source: '',
+    reason: '',
+    error: '',
+    run_id: '',
+    run_kind: '',
+    created_at: '2026-07-27T19:38:00Z',
+    ...over,
+  }
+}
+
+function page(results: ActivityEvent[], over: Partial<ActivityPage> = {}): ActivityPage {
+  return { count: results.length, next: null, previous: null, results, ...over }
+}
+
+function withQuery(ui: React.ReactElement) {
+  const qc = new QueryClient({ defaultOptions: { queries: { retry: false } } })
+  return render(<QueryClientProvider client={qc}>{ui}</QueryClientProvider>)
+}
+
+function timeline() {
+  return within(screen.getByTestId('activity-timeline'))
+}
+
+describe('AccountActivityPanel', () => {
+  it('renders a login the per-foundry feed could never reach', async () => {
+    const list = jest.fn(async () => page([login({ id: 'e1' })]))
+    withQuery(<AccountActivityPanel client={{ list }} />)
+
+    await waitFor(() => expect(timeline().getByText('Member login')).toBeInTheDocument())
+    expect(timeline().getByText('Ada Lovelace')).toBeInTheDocument()
+  })
+
+  it('says which app the sign-in was for', async () => {
+    const list = jest.fn(async () => page([login({ id: 'e2' })]))
+    withQuery(<AccountActivityPanel client={{ list }} />)
+
+    // `app` is the row's own descriptor for what it touched. Without it the
+    // target app is captured on the row and invisible on the page — the same
+    // shape of bug one level down.
+    await waitFor(() => expect(timeline().getByText('foundry')).toBeInTheDocument())
+  })
+
+  it('pages server-side (rule #8) rather than asking for everything', async () => {
+    const list = jest.fn(async (_p: ActivityQuery) => page([login({ id: 'e3' })]))
+    withQuery(<AccountActivityPanel client={{ list }} />)
+
+    await waitFor(() => expect(list).toHaveBeenCalled())
+    const params = list.mock.calls[0][0] as ActivityQuery
+    expect(params.page).toBe(1)
+    expect(typeof params.pageSize).toBe('number')
+  })
+
+  it('takes no slug — the events belong to no foundry', () => {
+    const list = jest.fn(async () => page([]))
+    // A slug prop would be a type error; the runtime check is that the panel
+    // renders from the injected client alone.
+    withQuery(<AccountActivityPanel client={{ list }} />)
+    expect(screen.getByTestId('activity-feed-panel')).toBeInTheDocument()
+  })
+
+  it('explains an empty page without claiming nothing happened', async () => {
+    const list = jest.fn(async () => page([]))
+    withQuery(<AccountActivityPanel client={{ list }} />)
+
+    // An admin/member/viewer gets an empty page rather than a 403, so the copy
+    // must not assert "no sign-ins have happened".
+    await screen.findByText(/no account activity/i)
+    const body = screen.getByTestId('activity-feed-panel').textContent ?? ''
+    expect(body).toMatch(/sign-in/i)
+    expect(body).toMatch(/owner/i)
+    expect(body).not.toMatch(/nothing recorded/i)
+  })
+
+  it('lets a host override the shared copy', async () => {
+    const list = jest.fn(async () => page([]))
+    withQuery(<AccountActivityPanel client={{ list }} title="Sign-in history" />)
+    await waitFor(() => expect(screen.getByText('Sign-in history')).toBeInTheDocument())
+  })
+})
+
+describe('the platform scope reuses the shared feed', () => {
+  it('humanises member_login with no new vocabulary', () => {
+    expect(activityLabel(login({ id: 'e4' }))).toBe('Member login')
+  })
+
+  it('renders the app instead of the opaque user id', () => {
+    expect(activityTarget(login({ id: 'e5' }))).toBe('foundry')
+    // No app on the row -> nothing, never the UUID.
+    expect(activityTarget(login({ id: 'e6', metadata: { method: 'sso' } }))).toBe('')
+  })
+
+  it('maps a login onto the same timeline item shape as any other row', () => {
+    const [item] = toActivityTimelineItems([login({ id: 'e7' })])
+    expect(item.title).toBe('Member login')
+    expect(item.actor?.email).toBe('ada@x.com')
+    expect(item.occurredAt).toBe('2026-07-27T19:38:00Z')
+  })
+
+  it('does not render its own list — it composes ActivityFeedPanel', () => {
+    const src = fs.readFileSync(
+      path.resolve(__dirname, '..', 'AccountActivityPanel.tsx'), 'utf8')
+    expect(src).toMatch(/<ActivityFeedPanel/)
+    // No list of its own, no second query, no second timeline. (The doc comment
+    // may NAME the timeline; what it may not do is import or render one.)
+    const banned = [/\.map\(/, /useInfiniteQuery/, /<ActivityTimeline/,
+                    /from '\.\.\/ActivityTimeline'/]
+    for (const re of banned) {
+      expect(`${re.source}:${re.test(src)}`).toBe(`${re.source}:false`)
+    }
+  })
+})

package/src/components/activity/__tests__/activity-labels.test.tsx

@@ -0,0 +1,229 @@
+/**
+ * startsim-768w.19.8 (RED) — the activity feed LABELS a row honestly.
+ *
+ * The user reported "activity in marketing agents foundry is showing me the
+ * activity of a different foundry". It was not a filtering bug: every row
+ * carried the right tenant. It was a LABELLING bug that mimics a data leak
+ * perfectly, and all three parts of it live in this layer:
+ *
+ *   1. THE ACTOR CHIP NAMED SOMETHING THAT LOOKS LIKE AN ORG. The account's
+ *      display name is "QA Foundry", which collides with a DIFFERENT foundry's
+ *      name — so a correct feed reads as cross-tenant contamination. A row must
+ *      identify the PERSON unambiguously, which means the email is never
+ *      dropped in favour of a name that could be anything.
+ *   2. THE TARGET WAS A RAW UUID — "membership · dc0d739f-a622-…" tells nobody
+ *      anything. Resolve it to a human string from the row's own metadata, and
+ *      when it cannot be resolved render NOTHING rather than a UUID.
+ *   3. RESENDS WERE INDISTINGUISHABLE FROM ORIGINAL INVITES. The same invitee
+ *      appeared twice; the second carried `metadata.resend` and rendered
+ *      identically, so a correct trail read as a duplicate.
+ *
+ * DESIGN GUARD, same as the rest of this layer: nothing below branches on a
+ * known action. Target resolution reads generic DESCRIPTOR keys off `metadata`,
+ * so a brand-new event type is labelled the moment the backend records one.
+ */
+import { render, screen, within } from '@testing-library/react'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+
+import { ActivityTimeline } from '../../ActivityTimeline'
+import {
+  ActivityFeedPanel,
+  activityNote,
+  activityTarget,
+  toActivityTimelineItems,
+  type ActivityEvent,
+} from '../index'
+
+const emptyPage = { count: 0, next: null, previous: null, results: [] }
+
+function event(over: Partial<ActivityEvent> & { id: string }): ActivityEvent {
+  return {
+    action: 'state_changed',
+    type: 'state_changed',
+    target_type: 'state',
+    target_id: '',
+    metadata: {},
+    actor: null,
+    actor_email: null,
+    state: null,
+    previous_state: null,
+    source: 'orchestrator',
+    reason: '',
+    error: '',
+    run_id: '',
+    run_kind: '',
+    created_at: '2026-07-20T12:00:00Z',
+    ...over,
+  }
+}
+
+const INVITE = event({
+  id: 'ev-1',
+  action: 'member_invited',
+  type: 'member_invited',
+  target_type: 'membership',
+  target_id: 'dc0d739f-a622-431d-beb2-de169acda594',
+  metadata: { email: 'nordby@ogmc.ai', role: 'admin', auto_created: true },
+  actor: { id: 'u-qa', email: 'qa-foundry@startsimpli.com', name: 'QA Foundry' },
+  actor_email: 'qa-foundry@startsimpli.com',
+})
+
+// --------------------------------------------------------------------------
+// 1. THE ACTOR IS A PERSON, and says so
+// --------------------------------------------------------------------------
+
+describe('the actor chip identifies a PERSON, not an org', () => {
+  it('shows the email alongside a display name that could be read as a company', () => {
+    render(<ActivityTimeline activities={toActivityTimelineItems([INVITE])} />)
+    // Both halves of the identity. Without the email, "QA Foundry" is
+    // indistinguishable from the name of another foundry, which is exactly what
+    // the user read as cross-tenant contamination.
+    expect(screen.getByText('QA Foundry')).toBeInTheDocument()
+    expect(screen.getByText('qa-foundry@startsimpli.com')).toBeInTheDocument()
+  })
+
+  it('does not print the same identity twice when there is no display name', () => {
+    const rows = toActivityTimelineItems([
+      event({ ...INVITE, id: 'ev-2', actor: { id: 'u-2', email: 'ada@x.com', name: '' } }),
+    ])
+    render(<ActivityTimeline activities={rows} />)
+    expect(screen.getAllByText('ada@x.com')).toHaveLength(1)
+  })
+
+  it('treats a name the server derived from the email as no name at all', () => {
+    // Some backends fall back to the email inside the display name. Echoing it
+    // twice is noise, not identity.
+    const rows = toActivityTimelineItems([
+      event({ ...INVITE, id: 'ev-3', actor: { id: 'u-3', email: 'ada@x.com', name: 'ada@x.com' } }),
+    ])
+    render(<ActivityTimeline activities={rows} />)
+    expect(screen.getAllByText('ada@x.com')).toHaveLength(1)
+  })
+
+  it('still renders a row the control plane recorded itself, with no actor', () => {
+    const rows = toActivityTimelineItems([event({ id: 'ev-4', state: 'live', actor: null })])
+    render(<ActivityTimeline activities={rows} />)
+    expect(screen.getByText('Live')).toBeInTheDocument()
+  })
+})
+
+// --------------------------------------------------------------------------
+// 2. THE TARGET IS A HUMAN STRING, or nothing
+// --------------------------------------------------------------------------
+
+describe('activityTarget resolves what was touched', () => {
+  it('names the invitee instead of the membership UUID', () => {
+    expect(activityTarget(INVITE)).toBe('nordby@ogmc.ai')
+    expect(activityTarget(INVITE)).not.toMatch(/dc0d739f/)
+  })
+
+  it('renders NOTHING rather than a UUID when nothing human is recorded', () => {
+    const opaque = event({
+      id: 'ev-5',
+      action: 'thing_happened',
+      type: 'thing_happened',
+      target_type: 'membership',
+      target_id: 'dc0d739f-a622-431d-beb2-de169acda594',
+      metadata: {},
+    })
+    expect(activityTarget(opaque)).toBe('')
+  })
+
+  it('keeps a target id a human can actually use', () => {
+    const pr = event({
+      id: 'ev-6',
+      action: 'app_ui_proposed',
+      type: 'app_ui_proposed',
+      target_type: 'pull_request',
+      target_id: '42',
+      metadata: {},
+    })
+    expect(activityTarget(pr)).toBe('pull_request · 42')
+  })
+
+  it('labels an event type it has never heard of from that row own metadata', () => {
+    // No vocabulary: a new backend event only has to record a descriptor.
+    const fresh = event({
+      id: 'ev-7',
+      action: 'schema_type_created',
+      type: 'schema_type_created',
+      target_type: 'schema_type',
+      target_id: 'b1f0f2c4-7f24-4a2f-9d69-6a0f0e9a1111',
+      metadata: { name: 'Artist' },
+    })
+    expect(activityTarget(fresh)).toBe('Artist')
+  })
+
+  it('prefers the row own reason or error over the target, as before', () => {
+    const failed = event({
+      id: 'ev-8',
+      action: 'lifecycle_failed',
+      type: 'lifecycle_failed',
+      error: 'CodeBuild step exited 1',
+      target_type: 'run',
+      target_id: 'f496dea4-0000-0000-0000-000000000000',
+    })
+    const [item] = toActivityTimelineItems([failed])
+    expect(item.detail).toBe('CodeBuild step exited 1')
+  })
+
+  it('puts the resolved target on the timeline item instead of the UUID', () => {
+    const [item] = toActivityTimelineItems([INVITE])
+    expect(item.detail).toBe('nordby@ogmc.ai')
+    expect(String(item.detail)).not.toMatch(/dc0d739f/)
+  })
+})
+
+// --------------------------------------------------------------------------
+// 3. A RESEND IS NOT A SECOND INVITE
+// --------------------------------------------------------------------------
+
+describe('a resend is distinguishable from the original', () => {
+  const RESEND = event({
+    ...INVITE,
+    id: 'ev-9',
+    metadata: { email: 'nordby@ogmc.ai', role: 'admin', resend: true },
+    created_at: '2026-07-21T12:00:00Z',
+  })
+
+  it('marks the resent row', () => {
+    expect(activityNote(RESEND)).toBe('resend')
+    expect(activityNote(INVITE)).toBeUndefined()
+  })
+
+  it('keeps the source note for a transition nobody fired', () => {
+    const drift = event({ id: 'ev-10', state: 'paused', source: 'reconcile' })
+    expect(activityNote(drift)).toBe('detected by drift reconcile')
+  })
+
+  it('renders the two invites for the same person differently', () => {
+    render(<ActivityTimeline activities={toActivityTimelineItems([RESEND, INVITE])} />)
+    const rows = document.querySelectorAll('[data-activity-id]')
+    expect(rows).toHaveLength(2)
+    const first = within(rows[0] as HTMLElement)
+    const second = within(rows[1] as HTMLElement)
+    expect(first.getByText('resend')).toBeInTheDocument()
+    expect(second.queryByText('resend')).toBeNull()
+  })
+})
+
+// --------------------------------------------------------------------------
+// 4. THE COPY states the tab scope, without an unactionable hedge
+// --------------------------------------------------------------------------
+
+describe('the default panel copy', () => {
+  it('no longer hedges about the reader access level', () => {
+    // The default description is a plain statement of what the tab holds. The
+    // permission filtering is invisible and correct by design — naming it only
+    // tells the reader about a constraint they cannot act on.
+    const qc = new QueryClient({ defaultOptions: { queries: { retry: false } } })
+    render(
+      <QueryClientProvider client={qc}>
+        <ActivityFeedPanel client={{ list: jest.fn().mockResolvedValue(emptyPage) }} />
+      </QueryClientProvider>,
+    )
+    const panel = within(screen.getByTestId('activity-feed-panel'))
+    expect(panel.queryByText(/access level/i)).toBeNull()
+    expect(panel.getByText(/who did what/i)).toBeInTheDocument()
+  })
+})

package/src/components/activity/activity-events.ts

@@ -9,7 +9,11 @@
  * a humanised sentence with a neutral tone; it never falls through to a wrong
  * label like "State changed", and it is never dropped.
  */
-import type { ActivityTimelineItem, ActivityTone } from '../ActivityTimeline';
+import type {
+  ActivityTimelineActor,
+  ActivityTimelineItem,
+  ActivityTone,
+} from '../ActivityTimeline';
 import type {
   ActivityEvent,
   ActivityFilterOption,
@@ -113,13 +117,92 @@ export function activityHead(
   return (events ?? []).find((e) => actionOf(e) === 'state_changed' && !!e.state);
 }
 
+/** A machine id nobody can read — a UUID. Printing one where a human string
+ *  belongs ("membership · dc0d739f-a622-…") tells the reader nothing, so it is
+ *  the one value this layer refuses to render (startsim-768w.19.8). */
+const OPAQUE_ID = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
+
+/**
+ * Generic DESCRIPTOR keys — the names an event uses for "the human string for
+ * the thing I touched". Deliberately a naming convention, NOT a per-action map:
+ * a member invite records `email`, a schema change records `name`, a pipeline
+ * change records `source`/`source_key`, and an event type nobody has written
+ * yet is labelled the moment it records any of them. Nothing here branches on
+ * an action, so registering an event type still needs no UI change.
+ */
+const TARGET_DESCRIPTORS = [
+  'email', 'name', 'title', 'label', 'source', 'source_name',
+  // `app` is what a platform-scope row touched: a sign-in records which app it
+  // minted a token for, and its `target_id` is the actor's own UUID, so without
+  // this key the app is captured on the row and invisible on the page
+  // (startsim-768w.19.1.5). Same convention, not a login special case.
+  'app',
+  'repo', 'slug', 'path', 'source_key', 'provider_key', 'credential_type',
+];
+
+/**
+ * What this event touched, in words a person can read — the invitee's email,
+ * the source's name, the schema type — resolved from the row's OWN metadata.
+ *
+ * Falls back to `type · id` only for an id a human can actually use (a PR
+ * number), and to the EMPTY STRING for an opaque one. Rendering nothing is
+ * strictly more informative than rendering a UUID.
+ */
+export function activityTarget(event: ActivityEvent): string {
+  const meta = event.metadata ?? {};
+  for (const key of TARGET_DESCRIPTORS) {
+    const value = meta[key];
+    if (typeof value !== 'string') continue;
+    const text = value.trim();
+    if (text && !OPAQUE_ID.test(text)) return text;
+  }
+  const id = String(event.target_id ?? '').trim();
+  if (!id || OPAQUE_ID.test(id)) return '';
+  return [event.target_type, id].filter(Boolean).join(' · ');
+}
+
+/**
+ * The small pill next to the title — the thing that makes two otherwise
+ * identical rows different.
+ *
+ * A RESENT invite is the case that mattered: the same invitee appeared twice
+ * and the second row rendered identically to the first, so a correct trail read
+ * as a duplicated one. `metadata.resend` is the flag the writer already
+ * records; this is where it becomes visible. The lifecycle source notes explain
+ * a state the operator did not fire themselves (startsim-bq7s.1).
+ */
+export function activityNote(event: ActivityEvent): string | undefined {
+  if (event.metadata?.resend === true) return 'resend';
+  return event.source ? SOURCE_NOTE[event.source] : undefined;
+}
+
+/**
+ * The PERSON behind a row — never an org.
+ *
+ * The display name is free text a user typed, so it can read exactly like the
+ * name of a foundry ("QA Foundry"), and a correct feed then looks like
+ * cross-tenant contamination. The email is the one unambiguous handle, so it is
+ * carried alongside the name rather than replaced by it; a `name` that is only
+ * the email echoed back is dropped, because saying it twice is not identity.
+ */
+export function activityActor(event: ActivityEvent): ActivityTimelineActor | undefined {
+  const raw = event.actor ?? (event.actor_email ? { email: event.actor_email } : undefined);
+  if (!raw) return undefined;
+  const email = (raw.email ?? '').trim();
+  const name = (raw.name ?? '').trim();
+  return { ...raw, email: email || undefined, name: name && name !== email ? name : undefined };
+}
+
 /** The body line for a row: the failure message, else the stated reason, else
- *  what was touched. */
+ *  what was touched, in words. */
 function detailOf(event: ActivityEvent): string {
   if (event.error) return event.error;
   if (event.reason) return event.reason;
-  const target = [event.target_type, event.target_id].filter(Boolean).join(' · ');
-  return actionOf(event) === 'state_changed' ? '' : target;
+  // A lifecycle transition already names its outcome in the TITLE, so echoing
+  // the target ("state · live") underneath it is noise. Derived from the row
+  // carrying a state, not from its action string.
+  if (event.state) return '';
+  return activityTarget(event);
 }
 
 /** Map any stream row onto the shared timeline's item shape. Nothing in here
@@ -129,17 +212,16 @@ export function toActivityTimelineItems(
 ): ActivityTimelineItem[] {
   return (events ?? []).map((event) => {
     const tone = activityTone(event);
-    const actor = event.actor ?? (event.actor_email ? { email: event.actor_email } : undefined);
     const detail = detailOf(event);
     return {
       id: event.id,
       type: actionOf(event),
       title: activityLabel(event),
       occurredAt: event.created_at,
-      actor: actor ?? undefined,
+      actor: activityActor(event),
       tone,
       subtitle: event.previous_state && event.state ? `from ${event.previous_state}` : undefined,
-      note: event.source ? SOURCE_NOTE[event.source] : undefined,
+      note: activityNote(event),
       detail: detail || undefined,
       detailTone: event.error ? 'error' : 'muted',
     };

package/src/components/activity/index.ts

@@ -12,6 +12,11 @@
  * never seen rather than dropping or mislabelling it.
  */
 export { ActivityFeedPanel, type ActivityFeedPanelProps } from './ActivityFeedPanel';
+export {
+  AccountActivityPanel,
+  ACCOUNT_ACTIVITY_QUERY_KEY,
+  type AccountActivityPanelProps,
+} from './AccountActivityPanel';
 export {
   ACTIVITY_FEED_PANEL_DEFAULTS,
   type ActivityFeedPanelClassNames,
@@ -35,6 +40,9 @@ export {
   activityLabel,
   activityTone,
   activityHead,
+  activityActor,
+  activityNote,
+  activityTarget,
   toActivityTimelineItems,
   deriveActivityFilterOptions,
 } from './activity-events';