Give nested sections and paragraphs one structural contract
The outline view handles top-level paragraphs but crashes when a section contains another section. The current arrays do not distinguish leaves from containers or validate imported structure.
- Focused work estimate
- 2h + prerequisites
- Priority in the scenario
- Medium
- Engineering practice
- Tree modeling · Input validation · Component composition
Estimated field mix
- Frontend80%
- System design20%
Field percentages are editorial estimates of the ticket's engineering focus. They total 100%; they are not measured time, proficiency scores, or ownership evidence.
Pattern topics
- CompositeApply
Give leaf paragraphs and nested section containers a consistent traversal contract without coupling the document tree to rendered UI elements.
Review it, then add it to your workspace.
The board opens an editable draft; nothing is saved until you confirm it. Sign-in and workspace permissions apply, and Demo boards remain ephemeral.
Project context
A fictional support team edits reusable troubleshooting documents with paragraphs, links, and nested sections. The browser prototype has separate toolbar and keyboard handlers, an unreliable undo stack, and mutable shared formatting objects. Create a local editor and synthetic documents; no starter assets, rich-text engine, collaborative backend, or production service is supplied.
Setup prerequisites
- Browser events
- Immutable updates
- Accessible form controls
Preceding work
No earlier ticket is required. Complete the project setup above.
Acceptance criteria
- Represent paragraphs as leaves and sections as containers with stable node identities and explicit discriminated types.
- Render and count text nodes consistently through three nested section levels.
- Reject duplicate node identities, cycles in programmatic input, and depth above the declared maximum of twenty.
Implementation constraints
- A Composite may use plain immutable data rather than classes. Keep document structure separate from React elements and DOM nodes.
Verification to include
- Render empty, flat, and nested synthetic documents and compare outline counts.
- Feed a duplicate identity and a cyclic structure to validation and assert bounded rejection without rendering.
Deliverables
- Document model, validator, and nested outline example
Rollout and recovery
Enable the new model only after validating local sample documents; preserve an untouched input copy when migration rejects a document.
Value of the work
For the engineer: Practice relating object and state patterns to real UI behavior, including undo semantics, bounded traversal, lifecycle cleanup, and memory tradeoffs.
For the team: Review whether editor changes preserve user work, keep controls consistent, and reduce maintenance effort without concealing document corruption.
Evidence boundaries
Outcome Evidence: Tests, patches, and runbooks are requested deliverables. They become Outcome Evidence only through a qualified Mission and immutable Evidence IDs.
Ownership Evidence: Independent adaptation must be observed under a declared verification policy and cite immutable Evidence IDs. Completing a planning ticket establishes no Ownership Evidence.