Munchable's result screen, after you scan something, is a stack of rows. Some are about the conditions you told it you have . Some are about allergies. One is about a thing we call healthy shopping, which is the reader's own list of what they would rather not buy: preservatives, artificial colours, sweeteners, that shape of preference.

All three look the same. A glyph, a title, one word on the right, and the detail one tap away. That sameness is deliberate, and so is every place the three diverge. This post is about the divergences, because every one of them is a copy decision with a reason, and none of them are visible in a screenshot.

The rows are alike because they are alike from where the reader sits

The component comment states the goal before the code does:

/** * What healthy shopping found, in the same shape as an allergy row and a * condition row: glyph, what it is, the outcome word on the right, the detail * one tap away.…