Skip to content

fix(recycling): place item separator correctly in inverted lists - #1

Closed
HoshangDEV wants to merge 1 commit into
mainfrom
fix/inverted-item-separator-placement
Closed

fix(recycling): place item separator correctly in inverted lists#1
HoshangDEV wants to merge 1 commit into
mainfrom
fix/inverted-item-separator-placement

Conversation

@HoshangDEV

@HoshangDEV HoshangDEV commented Aug 14, 2026

Copy link
Copy Markdown
Owner

Description

In an inverted list, ItemSeparatorComponent lands on the wrong side of the item: every separator shifts one slot toward the start, the last two items sit flush, and a stray separator dangles off the start edge.

inverted applies a flip transform to both the scroller and each cell, so the two cancel inside the cell but the cells themselves are mirrored — a cell's trailing edge points at index − 1, not index + 1. Fix is placement only: render the separator ahead of the item when inverted. leadingItem/trailingItem semantics, last-row suppression, and measured cell size are all unchanged.

Related to Shopify#638, which reported this against 1.3.0 and still reproduces on 2.3.2.

Reviewers' hat-rack 🎩

  • Worth confirming the double-flip reasoning independently — it's the whole basis of the fix.
  • Grid and masonry (numColumns > 1) should follow the same argument but have no dedicated coverage here.

Test plan

  • yarn test (189 passed), yarn type-check, yarn lint
  • New InvertedSeparator.test.tsx — confirmed failing on unmodified main
  • iOS simulator — not done
  • Android emulator — not done

In an inverted list both the scroller and each cell carry a flip transform, so
a cell's trailing separator visually lands between items i and i-1. Every
separator shifts one slot toward the start of the list, the two items at the
far end sit flush against each other, and a stray separator dangles off the
start edge.

Render the separator ahead of the item when inverted so it still falls between
items i and i+1.

Related to Shopify#638
@HoshangDEV

Copy link
Copy Markdown
Owner Author

Superseded by Shopify#2441.

@HoshangDEV HoshangDEV closed this Aug 14, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant