meliorence / react-native-image-gallery

Pure JavaScript image gallery component for iOS and Android with high-performance and native feeling in mind

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

The Gallery seems to break after removing the last image

DontBeEvilBen opened this issue · comments

I have the gallery with a button to remove the current image off the list. It works well usually. if I remove any of images other than the last one, it automatically scrolls to the next one. But when I remove the nth item, it shows a blank gallery and the swipes don't work anymore, when there are other images on the list. There is no warning or error in the console.
I am using this with react native expo.

Sample code:

  const removeAsset = () => {
    let updatedListing = { ...listing };
    updatedListing.assets.splice(currentAsset, 1);
    setListing(updatedListing);

    let updatedIndex = currentAsset;
    if(updatedIndex == listing.assets.length) {
        updatedIndex = 0;
    } else {
        updatedIndex += 1;
    }

    setCurrentAsset(updatedIndex);
  };

....

 {
    listing.assets?.length > 0 ?
      <View style={styles.gallery}>
        <TransparentView style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', paddingHorizontal: 5 }}>
          <FontAwesome name="times-circle" size={20} color={Colors.purple} onPress={removeAsset} />
          <PoppinsText style={{ color: Colors.purple, fontSize: 10 }}>{currentAsset + 1 || 1} of {listing.assets?.length}</PoppinsText>
        </TransparentView>
        <Gallery style={{ height: 200 }} initialPage={currentAsset} images={listing.assets} onPageSelected={(index) => setCurrentAsset(index)} />
      </View>
      : null
  }

I am able to fix this by using the gallery reference and scroll to a certain page in the gallery.
#125 (comment)