Change Item of Flatlist on click of button which is outside of it in react native

I have an array of images which I am able to display using FlatList, also when clicked on an image it also displayed in bigger size which is outside FlatList. I have a left and right icon beside the bigger image, which should be used to show the next or previous image from the current image shown.

Below is my code:

const [selectedImage, setSelectedImage] = useState(img1);const [imageSet, setImageSet] = useState([img1,img2,img3,img4]);return (<SafeAreaView><View          style={{height: 400,width: 100}}><TouchableOpacity            onPress={() => {                //What should I do here            }}><Icon name={'chevron-left'} color={Colors.primary} size={54} />     // left press icon</TouchableOpacity><Image style={{height: 350, width: 300}} source={selectedImage} /><TouchableOpacity            onPress={() => {                //What should I do here            }}><Icon name={'chevron-right'} color={Colors.primary} size={54} />     // right press icon    </TouchableOpacity></View><FlatList    horizontal={true}    showsHorizontalScrollIndicator={false}    data={imageSet}    renderItem={({item, index}) => (<View><TouchableOpacity              onPress={() => {              setSelectedImage(item);              }}><Image                source={item}                key={index}                style={{                  width: 60,                  height: 60,                  resizeMode: 'contain',                }}              /></TouchableOpacity></View>    )}    /></SafeAreaView>);

I am unable to figure out how to show next or previous image . Please help.