Skip to content

Upgrade @gorhom/bottom-sheet to v4 #1053

Closed

Description

@andreibarabas

Describe the bug
v3 of the bottom sheet uses some legacy React Native APIs which are deprecated in RN 67

Dev environment info (please complete/provide the following information):

  • "stream-chat-react-native": "~3.10.2",
  • RN 0.67
  • All Devices / Simulators

To Reproduce
Steps to reproduce the behavior:

  1. Upgrade to RN 0.67.0-rc.5
  2. Unmount the chat
  3. when it unmounts, you should see this warning

According to the Bottom Sheet changelog, this has been fixed in 4.1

Screenshots
Simulator Screen Shot - iPhone 13 Pro - 2021-12-15 at 05 21 10

gz#17590

Activity

  1. madsroskar commented on Dec 15, 2021

    @madsroskar
    Contributor

    Thanks for creating the issue!

    We have a task to upgrade the dependency in our backlog, but I don't yet know how fast we'll be able to prioritize this just yet. This should not break anything in your application, and for the time being you could suppress the warning by passing it as a string in an array to the React Native LogBox (Something like LogBox.ignoreLogs(["EventEmitter.removeListener"]) for example) until we have a release ready that handles the deprecation.

    We'll get back to you when we have more information on this.

    Link so this is referenced In our Jira issue: CRNS-494

  2. izakfilmalter commented on Dec 15, 2021

    @izakfilmalter

    I just did this as a patch, lol. It does break the app forcing @gorhom/bottom-sheet@4.1.5. It's a fairly easy upgrade though.

    I had to do the following:

    1. Add enablePanDownToClose to both instances of BottomSheet.
    2. The api for snapTo changed to snapToIndex:
      -      bottomSheetRef.current.snapTo(1);
      +      bottomSheetRef.current.snapToIndex(0);
    
    1. I also had to do the following to ImageGallery.tsx
    -  const snapPoints = React.useMemo(() => [0, (screenHeight * 9) / 10], []);
    +  const snapPoints = React.useMemo(() => [(screenHeight * 9) / 10], []);
    

    That seemed to do the tick for me. I think the real upgrade would be changing these to both be Modals, but that was a larger refactor than what I wanted as a patch. The nice thing about it all is that I was able to use BottomSheetModalProvider and useBottomSheet without any other changes to this lib.

  3. madsroskar commented on Dec 15, 2021

    @madsroskar
    Contributor

    Thanks for reporting back with the changes you made for it to work, that's very helpful.

    I think the real upgrade would be changing these to both be Modals

    The modal wrapper in v4 does look nice, we'll look into that as part of the upgrade.

  4. andreibarabas commented on Dec 17, 2021

    @andreibarabas
    ContributorAuthor

    Thanks guys. @izakfilmalter for the patch

  5. vishalnarkhede commented on Mar 1, 2022

    @vishalnarkhede
    Contributor

    Hey @andreibarabas we have published our next major version of RN Chat SDK - v4.1.0 🎉.

    This release includes the fix for this issue. Please take a look at Release Notes for details.

  6. andreibarabas commented on Mar 1, 2022

    @andreibarabas
    ContributorAuthor

    Yes. I can confirm it's upgraded and working now. Thanks @vishalnarkhede

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Labels

EnhancementNew feature or request

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions