fix(react): use stable keys for dynamic lists

[j15z]

Summary

Dynamic lists now keep each row's identity through duplicate values, deletion, filtering, and redaction-stage changes. This prevents focus, entered text, or submitted data from moving to the wrong row after React reconciles a changed list.

This is stack PR 2 of 3. It depends on #6839 and is followed by #6841.

Metric	Parent	This PR
React Doctor total findings	3,532	3,488
Array-index key warnings	44	0

Type of Change

• Bug fix
• New feature
• Breaking change
• Documentation
• Other: ___________

Testing

• npx react-doctor@latest --verbose: 3,488 findings; no-array-index-as-key is 0
• Sim focused suites: 207 tests passed across 9 files
• EMCN focused suites: 21 tests passed across 2 files
• Type checks passed for @sim/app, @sim/emcn, @sim/workflow-renderer, and docs
• Added controlled rerender coverage for stable PII pattern-row identity

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

Screenshots/Videos

Not captured. The behavior is covered by focused tests that add, remove, and rerender controlled rows.

Post-Deploy Monitoring & Validation

• Validation window: first 24 hours after deploy; owner: PR author
• Healthy signal: no increase in client errors on affected list and editor surfaces, and no wrong-row reports
• Failure signal: a reproducible focus, value, or action transfer between sibling rows
• Mitigation trigger: revert this PR if stable identity causes a list regression

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
docs	Ready	Preview	Aug 19, 2026 3:08am

[cursor]

PR Summary

Low Risk
Mostly React list-key and typing changes with no auth, data, or API contract changes beyond optional id on UI action objects; broad surface area but low behavioral risk outside list rendering stability.

Overview
Replaces array index keys across the app with stable identities so React does not remount list children when items are added, removed, or reordered—fixing focus loss, animation glitches, and incorrect reconciliation.

Patterns introduced: generated id fields on upload errors, MCP header rows, PII pattern rows, and TagItem; content signatures with occurrence counters for duplicate-safe keys (legal blocks, FAQ, fork sync rows, interaction recaps); source offsets for text-split spans (OG titles, mentions, search highlights); and domain ids where they already exist (tool calls, options segments, file id/key, status-bar timestamp).

Design system: TagItem now requires id; ChipModalFooterSecondaryAction requires id on footer secondary actions; ChipEmailsInput assigns ids when syncing from external value.

Tests updated for upload-error message mapping and duplicate-error id uniqueness; CustomPatternsEditor test asserts focus preservation when rows are appended/removed.

^{Reviewed by Cursor Bugbot for commit 63337d3. Bugbot is set up for automated code reviews on this repo. Configure here.}

[greptile-apps]

Greptile Summary

This PR replaces positional React keys with stable identities across dynamic lists in the Sim UI, documentation site, and shared component packages.

• Adds generated IDs to editable tags, headers, upload errors, and PII pattern rows.
• Derives deterministic keys from source offsets or domain data for rendered text and display-only collections.
• Requires stable IDs for modal secondary actions and tag items, updating consumers accordingly.
• Adds tests covering duplicate upload-error identities and preservation of PII editor rows.

Confidence Score: 5/5

The PR appears safe to merge, with no concrete blocking or independently actionable non-blocking defects identified.

The changed list keys are derived from stable IDs, source positions, or deterministic domain signatures, and the updated component contracts and consumers remain aligned.

Important Files Changed

Filename	Overview
packages/emcn/src/components/tag-input/tag-input.tsx	Makes stable identity part of the TagItem contract and uses it when rendering editable tags.
packages/emcn/src/components/chip-modal/chip-modal.tsx	Requires IDs for secondary footer actions and replaces positional fragment keys.
apps/sim/components/pii/custom-patterns-editor.tsx	Tracks row identities through local add and remove operations while preserving controlled pattern values.
apps/sim/app/workspace/[workspaceId]/home/components/message-content/message-content.tsx	Derives option-group keys from block and option identity instead of render position.
apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx	Assigns content-derived identities to inline and special-tag render groups during streaming.
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/chat/hooks/use-chat-file-upload.ts	Gives each upload error a generated identity so duplicate messages reconcile independently.

_{Reviews (1): Last reviewed commit: "fix(react): use stable keys for dynamic ..." | Re-trigger Greptile}

[cursor]

Cursor Bugbot has reviewed your changes using high effort and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 63337d3. Configure here.}

[cursor]

Pattern fallback keys change while editing

Medium Severity

When patternIds is shorter than patterns (parent append, or ids not updated), row identity falls back to name, regex, and replacement. Editing those fields changes the React key, so the row remounts and the input loses focus and in-progress text.

 

^{Reviewed by Cursor Bugbot for commit 63337d3. Configure here.}