... i have some data in json format which i want to render in Flatlist For every item there is button pending .When user click on pending button a Modal is open with two button accept and reject.
... I want when I click on reject button modal close and when click on accept button then pending button convert in accepted
... I try many times But i was unable to change every item button in accepted
... It change only one item button not every button as accepted
... Here is my code
...this is render function
const BookingData = [
{
id: '1',
image:require('../../../assets/Ellipse4.png'),
title: 'Sweets Pan Cakes',
date: '29/05/2022 || 09:30',
restaurant:require('../../../assets/Ellipse4.png'),
review: '5',
bowl:require('../../../assets/hat.png'),
listing:'Kalyan'
},
{
id: '2',
image:require('../../../assets/sneha.png'),
title: 'Sweets Pan Cakes',
date: '15/05/2022 || 09:30',
restaurant:require('../../../assets/restaurant.png'),
review: '10',
bowl:require('../../../assets/hat.png'),
listing:'Kuldeep'
},
];
....Flatlist code start here
```<FlatList
data={BookingData}
keyExtractor={item =>
item.id}
renderItem={()=>(
<Modal
transparent={true}
visible={!active}
onRequestClose={() => {
console.warn("closed");
}}>
<View style={styles.containerModal}>
<View style={{height:48, width:"40%"}}>
<Pressable style={styles.nextbtn} onPress={() => setAccept(accept)}>
<Text style={styles.nextbtntext}>Accept</Text>
</Pressable>
</View>
<View style={{height:48, width:"40%"}}>
<Pressable style={styles.rejectbtn} onPress={()=>{setactive(!active)}}>
<Text style={styles.nextbtntext}>Reject</Text>
</Pressable>
</View>
</Modal>
... <TouchableOpacity onPress={()=>{setactive(!active)}}>
{ accept ?
(
<View style={styles.pendingBtn}>
<Image source={require('../../../assets/pending.png')} style={{height:24,width:16}}/>
<Text>Pending</Text>
</View>
)
:
(
<View style={styles.aceptBtn}>
<Image source={require('../../../assets/Ok.png')} style={{height:24,width:16}}/>
<Text>Accepted</Text>
</View>
)}
</TouchableOpacity>
</View>
</View>
)}```