Earlier on, I was calling my addFriend
function (which runs a graphql mutation) from within another function getFriendId
. It worked perfectly.
const getFriendId = React.useCallback( (data: UsersLazyQueryHookResult) => { if (data) { if (data.users.nodes.length == 0) { Alert.alert('User Not Found'); } else { setUserData(data); setNumberOfUsers(data.users.nodes.length); //showUsers(data, Number(numberOfUsers)); //addFriend(Number(data.users.nodes[0].id)); } } }, [addFriend], );
However, now I call it from within my ShowUsers function which first displays all returned users and shows a button with each of them. I am trying this:
const showUsers = React.useCallback( (data: UsersLazyQueryHookResult, numberOfUsers: Number) => { for (var i = 0; i < numberOfUsers; i++) { const userId = data.users.nodes[i].id; const userName = data.users.nodes[i].firstName .concat('') .concat(data.users.nodes[i].lastName); return (<View ><View ><Text >{userName}</Text><Button onPress={addFriend(Number(data.users.nodes[0].id))}></Button></View></View> ); } }, [createUserRelationMutation], );
However, I get an issue on the button's onPress that:
No overload matches this call. Overload 1 of 2, '(props: Readonly<Button>): Button', gave the following error. Type 'void' is not assignable to type '(() => void) | undefined'. Overload 2 of 2, '(props: Button, context?: any): Button', gave the following error. Type 'void' is not assignable to type '(() => void) | undefined'.ts(2769)
This is my addFriend function:
const addFriend = React.useCallback( (id: Number) => { createUserRelationMutation({ variables: { input: { relatedUserId: id, type: RelationType.Friend, userId: 7 }, }, }); }, [createUserRelationMutation], );
And this is how I use showUsers
in my main return jsx
{showUsers(userData, Number(numberOfUsers))}