Ramonda

RMD031 — A list item that is not an element

// reported: a nested list() is a descriptor, not an element
list(pages, (page: Post[]) => list(page, (item) => <PostRow item={item} />));

// the way: a component, which is ONE item and renders the inner rows
list(pages, (item) => <PostPage item={item} />);

One item becomes exactly one element. The element is what carries the row's key and what the diff matches rows on, so a string, a number, an array or a nested list() has nowhere to carry its identity — the item is skipped, and the page renders one row short.

For plain values, wrap them: list(names, (name) => <li>{name}</li>). For a nested list — a list of pages, each holding rows — put a component between them, as nested lists shows: the component is one item to the outer list, and the rows are what it renders.

TypeScript rejects all of this at the call site; this fires when the build has no types.

Next