Issue when navigate to a screen while current screen has shared-element

[MarcHbb]

Context :

I have my Feed screen, with a list of items that has image When I press on one item, it navigate to the detail screen with react-navigation-shared-element transition. When I want to navigate to the next screen in the stack, the image freeze while navigation transition is happening. See the video below

https://user-images.githubusercontent.com/15633836/230051165-2bda05e9-fb17-41ea-86ff-b2a0c100a1db.MP4

[unknwngera]

same issue

[unknwngera]

@MarcHbb solved this problem by passing the following code to all screens that can be reached from this screen (in Stack.Navigator):

        sharedElements={() => {
          return [`none`]
        }}

in my case its looks like this:

      <Stack.Screen
        name={'ContentShareScreen'}
        component={ContentShareScreen}
        options={{
          header: () => <NewHeader title={'Отправить'} canBack />,
        }}
        sharedElements={() => {
          return [`none`]
        }}
      />

[GhostWalker562]

Navigating back, the shared element is disappears until the transition finishes. How did you solve this @unknwngera?

[mazurGit]

@GhostWalker562 try this :

export const getSharedElement = (
  route: SharedElementCompatRoute,
  otherRoute: SharedElementCompatRoute,
) => {
  if (
    [ScreensWithoutSharedElement].includes(otherRoute.name  )
  ) {
    return ["none"]
  }
 }