Add scrollTo examples for FlatList and FlashList

[MatiPl01]

Summary

This PR adds FlatList and FlashList examples in the example app showing the usage of the scrollTo function. It also mentions the FlatList (yet only this) support in docs.

Example recordings

Paper	Fabric
Simulator.Screen.Recording.-.iPhone.15.Pro.-.2024-07-04.at.16.21.36.mp4	Simulator.Screen.Recording.-.iPhone.15.Pro.-.2024-07-04.at.23.35.19.mp4

Remarks

• FlashList supports scrollTo only on paper,
• fabric doesn't support it yet. This PR will fix the issue.

[szydlovsky]

Overall nice work! Got some suggestions though

[szydlovsky]

Intuitive and clean, like it!

[Yusang-park]

@tomekzaw Scroll from UI is not working for FlashList.

[MatiPl01]

@tomekzaw Scroll from UI is not working for FlashList.

Hey @Yusang-park!

It looks like they still haven't merged this PR from @j-piasecki which is required for the scrollTo to work properly. You can fix it on your side by patching the library. Please follow these steps:

1. Add this method in node_modules/@shopify/flash-list/src/FlashList.tsx (e.g. below the getScrollableNode method):

  public getNativeScrollRef(): React.ElementRef<
    typeof ScrollViewComponent
  > | null {
    return this.rlvRef?.getNativeScrollRef?.() || null;
  }

2. Add this to the node_modules/@shopify/flash-list/package.json:

"react-native": "src/index.ts",

It will ensure that the FlashList code is read from source files instead of the built js code in the dist directory.

I will ask someone from shopify if we can merge the necessary changes. I hope the next release of the flash-list will include these changes.

Let me know if it helps.