Update params navigation-shared-element [REACT NATIVE]

Question

I'm working to an images list using this library, but I'm not able to update the navigation params, like in the source code provided by the author, so I don't get the correct animation. Here's exactly what I mean: https://drive.google.com/file/d/1p0VZd5ODe4OYSx5_Hnq4dK8KqOwS_99F/view?usp=sharing. As you see if I open the first image and the scroll to another, when I try to dismiss the animation still occur on the first image. And here's my code:

const renderItem = ({ item }) => {
    return (
      <TouchableOpacity
        key={`item.${item.id}`}
        onPress={() => onPressItem(item)}
      >
        <SharedElement
          id={`image.${item.id}`}
          navigation={navigation}
        >
          <Image style={styles.image} source={item.source} resizeMode="cover" />
        </SharedElement>
      </TouchableOpacity>
    );
  };

  const onPressItem = (item) => 
    navigation.push("Detail", { item });

  return (
      <FlatList
        numColumns={2}
        data={images}
        renderItem={renderItem}
        keyExtractor={(item) => item.id.toString()}
      />
  );
}

// ImageDetail.js

const DetailScreen = ({ navigation, route }) => {
  const { item, items } = route.params;

  const initialIndex = items.findIndex(({ id }) => id === item.id);

  const renderItem = ({ item }) => {
    return (
      <View key={`item.${item.id}`}>
        <SharedElement
          id={`image.${item.id}`}
          navigation={navigation}
        >
          <Image style={styles.image} source={item.source} />
        </SharedElement>
      </View>
    );
  };

  const getItemLayout = (item, index) => {
    return {
      length: width,
      offset: width * index,
      index,
    };
  };

  const onScroll = ({
    nativeEvent: {
      contentOffset: { x },
    },
  }) => {
    const index = Math.floor(x / width);
    navigation.setParams({ item: items[index] });
  };

  return (
    <View style={styles.container}>
      <FlatList
        data={items}
        horizontal
        pagingEnabled
        contentOffset={{ x: width * initialIndex }}
        renderItem={renderItem}
        onScroll={onScroll}
        getItemLayout={getItemLayout}
        keyExtractor={(item) => item.id.toString()}
      />
    </View>
  );
};

ImageDetail.sharedElements = (route) => {
  const { item } = route.params;
  return [{ id: `image.${item.id}`, animation: "move", resize: "clip" }];
};