I have made 3 different custom buttons:
<TouchableOpacity onPress={selectClosed}>
<Text>Closed</Text>
</TouchableOpacity>
<TouchableOpacity onPress={selectPending}>
<Text>Pending</Text>
</TouchableOpacity>
<TouchableOpacity onPress={selectComplete}>
<Text>Complete</Text>
</TouchableOpacity>
and their onPress functions:
const selectClosed = () => {
getShiftDetails.bind(null, 'closed');
};
const selectPending = () => {
getShiftDetails.bind(null, 'pending');
};
const selectComplete = () => {
getShiftDetails.bind(null, 'complete');
};
Below is how I am making my api call:
const getShiftDetails = useCallback(
(
page = 1,
limit = 20,
mode: 'pending' | 'complete' | 'closed' = 'complete',
) => {
const payload = {
page,
limit,
status: [mode],
};
ApiFunctions.post(apiUrl + '/shift', payload)
.then(
// other stuff
)
.catch((err: any) => {
// other stuff
});
},
[user],
);
By default my api call is being done with mode
as complete
. Now if I click on pending
button then another api call should be made with mode
as pending
. But this is not happening. I am not sure where I went wrong.