I am running a graphql query inside getFriendId()
that returns an id, followed by a mutation (inside addFriend()
, which uses the id, along with an input (email) that the user types in. The problem is that on the first attempt, the mutation works fine and with correct values. However, when I change the email address on the input and run the query/mutation again, the values from my previous attempt are being used.
For instance, in the second attempt, the mutation is still using the id that we got in the first attempt. So basically, the values with setId
and setEmail aren't being updated timely. How can I fix this?
const [id, setId] = useState('');const [friendEmail, setFriendEmail] = useState('');const [loadUsers, { loading, data, error }] = useLazyQuery(LoadUsersQuery);const [createUserRelationMutation, { data: addingFriendData, loading: addingFriendLoading, error: addingFriendError }] = useCreateUserRelationMutation(); const getFriendId = () => { console.log('Email', friendEmail.toLocaleLowerCase()); loadUsers({ variables: { where: { email: friendEmail.toLocaleLowerCase() }, }, }); if (data) { console.log('ID', data.users.nodes[0].id); setId(data.users.nodes[0].id); } addFriend(); }; const addFriend = () => { console.log('Whats the Id', Number(id)); createUserRelationMutation({ variables: { input: {relatedUserId: Number(id), type: RelationType.Friend, userId: 7 } }, }); if (addingFriendData){ console.log('Checking') console.log(data); } if(addingFriendError){ console.log('errorFriend', addingFriendError.message); setErrorMessage(addingFriendError.message); } }const handleSubmit = () => { getFriendId(); };
The return looks like something like this:
<Input placeholder="Email" onChangeText={(text) => setFriendEmail(text)} value={friendEmail} /><Button rounded onPress={() => handleSubmit()}> Add Friend{''}</Button>