Open linked message at top #93403
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,104 @@ | ||
| diff --git a/node_modules/@shopify/flash-list/dist/FlashListProps.d.ts b/node_modules/@shopify/flash-list/dist/FlashListProps.d.ts | ||
| index fa786bf..586014c 100644 | ||
| --- a/node_modules/@shopify/flash-list/dist/FlashListProps.d.ts | ||
| +++ b/node_modules/@shopify/flash-list/dist/FlashListProps.d.ts | ||
| @@ -127,10 +127,12 @@ export interface FlashListProps<TItem> extends Omit<ScrollViewProps, "maintainVi | ||
| /** | ||
| * Additional configuration for initialScrollIndex. | ||
| * Use viewOffset to apply an offset to the initial scroll position as defined by initialScrollIndex. | ||
| + * Use viewPosition to position the item within the viewport (0 = start, 0.5 = center, 1 = end), mirroring scrollToIndex. | ||
| * Ignored if initialScrollIndex is not set. | ||
| */ | ||
| initialScrollIndexParams?: { | ||
| viewOffset?: number; | ||
| + viewPosition?: number; | ||
| } | null | undefined; | ||
| /** | ||
| * Used to extract a unique key for a given item at the specified index. | ||
| diff --git a/node_modules/@shopify/flash-list/dist/recyclerview/RecyclerViewManager.js b/node_modules/@shopify/flash-list/dist/recyclerview/RecyclerViewManager.js | ||
| index 3b69234..41bfb84 100644 | ||
| --- a/node_modules/@shopify/flash-list/dist/recyclerview/RecyclerViewManager.js | ||
| +++ b/node_modules/@shopify/flash-list/dist/recyclerview/RecyclerViewManager.js | ||
| @@ -294,11 +294,26 @@ export class RecyclerViewManager { | ||
| // re-estimate unmeasured items with an updated average height, changing | ||
| // the target item's position. Reading before recompute would capture a | ||
| // stale offset, causing the wrong items to be rendered. | ||
| - this.layoutManager.recomputeLayouts(0, initialScrollIndex); | ||
| + this.layoutManager.recomputeLayouts(0, this.getDataLength() - 1); | ||
| const initialItemLayout = this.layoutManager.getLayout(initialScrollIndex); | ||
| - const initialItemOffset = this.propsRef.horizontal | ||
| + let initialItemOffset = this.propsRef.horizontal | ||
| ? initialItemLayout.x | ||
| : initialItemLayout.y; | ||
| + // Anchor the initial render window according to initialScrollIndexParams.viewPosition so the | ||
| + // first painted frame already shows the target item at the requested position in the viewport. | ||
| + const initialScrollIndexParams = this.propsRef.initialScrollIndexParams; | ||
| + const viewPosition = initialScrollIndexParams === null || initialScrollIndexParams === void 0 ? void 0 : initialScrollIndexParams.viewPosition; | ||
| + if (viewPosition !== undefined) { | ||
| + const windowSize = this.propsRef.horizontal | ||
| + ? this.getWindowSize().width | ||
| + : this.getWindowSize().height; | ||
| + const itemSize = this.propsRef.horizontal | ||
| + ? initialItemLayout.width | ||
| + : initialItemLayout.height; | ||
| + if (windowSize > 0) { | ||
| + initialItemOffset = Math.max(0, initialItemOffset - (windowSize - itemSize) * viewPosition); | ||
| + } | ||
| + } | ||
| this.engagedIndicesTracker.scrollOffset = initialItemOffset; | ||
| } | ||
| else { | ||
| diff --git a/node_modules/@shopify/flash-list/dist/recyclerview/hooks/useRecyclerViewController.js b/node_modules/@shopify/flash-list/dist/recyclerview/hooks/useRecyclerViewController.js | ||
| index 18e59ce..17c8063 100644 | ||
| --- a/node_modules/@shopify/flash-list/dist/recyclerview/hooks/useRecyclerViewController.js | ||
| +++ b/node_modules/@shopify/flash-list/dist/recyclerview/hooks/useRecyclerViewController.js | ||
| @@ -566,10 +566,45 @@ export function useRecyclerViewController(recyclerViewManager, ref, scrollViewRe | ||
| }, 500); | ||
| pauseOffsetCorrection.current = true; | ||
| const additionalOffset = (_c = initialScrollIndexParams === null || initialScrollIndexParams === void 0 ? void 0 : initialScrollIndexParams.viewOffset) !== null && _c !== void 0 ? _c : 0; | ||
| - const offset = horizontal | ||
| - ? recyclerViewManager.getLayout(initialScrollIndex).x + additionalOffset | ||
| - : recyclerViewManager.getLayout(initialScrollIndex).y + | ||
| - additionalOffset; | ||
| + const initialItemLayout = recyclerViewManager.getLayout(initialScrollIndex); | ||
| + let offset = (horizontal ? initialItemLayout.x : initialItemLayout.y) + | ||
| + additionalOffset; | ||
| + // Position the target item within the viewport (0 = start, 0.5 = center, 1 = end), mirroring scrollToIndex. | ||
| + const viewPosition = initialScrollIndexParams === null || initialScrollIndexParams === void 0 ? void 0 : initialScrollIndexParams.viewPosition; | ||
| + if (viewPosition !== undefined) { | ||
| + const containerSize = horizontal | ||
| + ? recyclerViewManager.getWindowSize().width | ||
| + : recyclerViewManager.getWindowSize().height; | ||
| + const itemSize = horizontal | ||
| + ? initialItemLayout.width | ||
| + : initialItemLayout.height; | ||
| + if (containerSize > 0) { | ||
| + offset = Math.max(0, offset - (containerSize - itemSize) * viewPosition); | ||
| + } | ||
| + } | ||
| + // Make it clear there are more items to scroll to underneath the bottom edge. | ||
| + // If the bottom item is (essentially) fully visible against the bottom edge AND there | ||
| + // is an item underneath it, nudge the bottom edge up so CROP_OFFSET px of the current | ||
| + // bottom item gets cropped, signalling that more content can be scrolled into view. | ||
| + if (viewPosition !== undefined && !horizontal && recyclerViewManager.props.inverted && offset > 0) { | ||
| + const CROP_OFFSET = 10; | ||
| + let bottomIndex = -1; | ||
| + for (let i = initialScrollIndex; i >= 0; i--) { | ||
| + if (recyclerViewManager.getLayout(i).y <= offset) { | ||
| + bottomIndex = i; | ||
| + break; | ||
| + } | ||
| + } | ||
| + if (bottomIndex > 0) { | ||
| + const bottomItemLayout = recyclerViewManager.getLayout(bottomIndex); | ||
| + const hiddenPortion = offset - bottomItemLayout.y; | ||
| + // 8px is bottom padding of every item | ||
| + if (hiddenPortion <= 8) { | ||
| + // Crop the current bottom item rather than letting it sit flush against the edge. | ||
| + offset = bottomItemLayout.y + CROP_OFFSET; | ||
| + } | ||
| + } | ||
| + } | ||
| handlerMethods.scrollToOffset({ | ||
| offset, | ||
| animated: false, |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
When a linked/unread chat opens near the newest edge and
hasNewerActionsis true, this now forwards the realonStartReachedon the very first FlashList mount; the removed scroll-key hook used to replace it with a no-op during the initial positioning handoff. WithonStartReachedThreshold={0.75}, FlashList can immediately callloadNewerChatsAfterTransitions, prepend newer actions, and move the target away from the requested top offset before the initial anchor has settled. Consider deferring/suppressingonStartReacheduntil the initial linked-message positioning has completed.Useful? React with 👍 / 👎.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Previously
onStartReachedwas supressed cause with oldinitialScrollKeylogic, the reportActions array was cut off initially, and user always started at bottom ->onStartReachedwas always triggered by mistake.Since we have changed the approach, I think we don't need this guard anymore.