GraphQL query header with variable not setting on first render

GraphQL query header with variable not setting on first render


0

I am using graphQL in react native project. I am passing headers (cookie/authorization) in context object of query, in useMutation or useQuery. [Problem is only on iOS App]

The basic system of the app is user signup the profile, and verify, on initial signup the property finishedAccountSetup: false is false. so when they log in on very first time, then the active navigation stack is setup navigation stack. When they fills up the information its calls updateuser mutation. this mutation requires header to pass in query. So once the user reach to last screen to setup and submit the information even though the jwt is not undefined the mutation not passing the jwt, seems undefined is passed. the jwt is fetching from the redux store, also tried to pass as navigation parameters, I was guessing if at the very beginning of render useMutation finding the jwt is undefined when it not finished fetching from store. But passing via parameter it should be there in very beginning. But it does not works there as well.

The second case is, if the account is marked setup from database and try logging in first time, when user successfully logging in the navigation stack is changed to home navigation stack and the user redirecting to the home page. Where there is useQuery mutation and the jwt is passing the same way. But the jwt is not passing once logged in. But if I kill the session of app and re open the app, its working fine. It passing jwt and query returning results. Once the app is killed and re open the query and jwt is working on all screens. But at very first time after logging in and coming to the home screen its not passing jwt even though the variable is not undefined.

The problem is only seeing in iOS device not on android. Its working fine on android.

useMutations: variable jwt is never undefined during first render, tried checking this with console.log(jwt)

  const { jwt, pushToken } = useSelector((state: RootState) => state.auth);

  const [updateUser, updateUserData] = useMutation(UPDATE_USER_MUTATION, {
     context: {
       headers: {
         cookie: `jwt=${jwt}`,
         authorization: jwt ? `Bearer ${jwt}` : '',
       },
     },
  });

useQuery: Using this query in home page, when user logs in first time from ios device, then the jwt is not passing to the header. variable jwt is never undefined during first render though, tried checking this with console.log(jwt). But if the user kill the app session and re open the app then the query is working perfectly. But when logging in the navigation state changing and transferring to home stack navigator and on first render even though the jwt is not undefined its not passing as header.

  const { jwt, user, pushToken } = useSelector(
    (state: RootState) => state.auth
  );

  const {
    data: my_info,
    error: my_infoError,
    loading: my_infoLoading,
    refetch: my_infoRefetch,
  } = useQuery(GET_ME, {
        context: {
           headers: {
              cookie: `jwt=${jwt}`,
              authorization: jwt ? `Bearer ${jwt}` : '',
            },
        },
  });

What could be the possible reason for this? Is there any way to register useQuery or useMutation one first render after few seconds? I tried refetch query after few seconds using useEffect that doesn’t work though.

I am not sure now, when the query is registered by the react engine that its finding the jwt is undefined? or not setting the context object. Is there any way to find out the issue or is there any solution for this?

Thank You


Load 6 more related questions


Show fewer related questions

0



Leave a Reply

Your email address will not be published. Required fields are marked *