I am in need of assistance implementing a global variable that changes after an Apollo query is run so that the changed value can be passed as a header in a second query. In the code below, I change the variable reqType after receiving the first query data, but the changed value does not appear in the backend (the original variable remains) I have the following React page:

import { useEffect, useState } from "react";
import { useQuery } from "@apollo/client";
import { useCookies } from "react-cookie";
import { useNavigate } from "react-router-dom";
import { useSelector } from 'react-redux';
import { VALIDATE_SESSION } from "../../queries/accountQueries";
import { LOAD_CLIENT_DATA } from "../../queries/clientQueries";
import { auth } from "../../index";

import Header from '../components/Header';
import InputField from "../components/InputField";
import NewClientPopup from "../components/NewClientPopup";
import Nav from '../components/Nav';
import ClientButton from "../components/ClientButton";

import "../../style/nav.css";
import "../../style/clients.css";
import "../../style/forms.css";

function Clients() {
    const [ verifiedsession, setVerifiedSession ] = useState(false)
    const [ cookies, setCookie ] = useCookies(['session']);

    const [ searchValue, setSearchValue ] = useState("");
    const [ newClient, setNewClient ] = useState(false);

    const id = useSelector((state) => state.id);
    const token = useSelector((state) => state.token);

    auth.id = id;
    auth.token = token;

    if (!verifiedsession) auth.reqType = "session";
    else auth.reqType = null;

    const navigate = useNavigate();

    function openNewClientPopup() {
        if (!newClient)
            setNewClient(true);
        else setNewClient(false);
    }

    const { data:sessionData, loading:loadingSession, error:errorLoadingSession} = useQuery(VALIDATE_SESSION, {
        enabled: !verifiedsession,
        variables: {
            session: cookies.session,
            id: id
        }
    });
    
    const { data:clientData, loading:loadingClientData, error:errorLoadingClientData, refetch } = useQuery(LOAD_CLIENT_DATA, {
        enabled: verifiedsession && auth.reqType == null
    })

    if (loadingSession) return ( <p> Loading session... </p>)
    if (loadingClientData) return ( <p> Loading data... </p>)
    if (errorLoadingSession) return <p>Error :({JSON.stringify(errorLoadingSession, null, 2)}</p>;
    if (errorLoadingClientData) return <p>Error :({JSON.stringify(errorLoadingClientData, null, 2)}</p>;

    if (sessionData != undefined) {
        auth.reqType = null;

        if (sessionData.validateSession.response == "Session token validated") {
            if (!verifiedsession) {
                setVerifiedSession(true);


                console.log(sessionData);

                auth.reqType = null;
                auth.session = cookies.session
            }

            if (clientData != undefined && clientData.clients.clients != null) {
                return ( 
                    <>
                        <Header view={false} />
    
                        <div className="content centered flex row">
                            <Nav />
                            <div className="main-content">
                                <div className="flex row">
                                    <InputField label="Search" value={searchValue} onChangeState={setSearchValue} />
                                    <p onClick={openNewClientPopup}>Add client</p>
                                </div>
                                <div className="client-list">
                                    <div className="client-list-header flex row">
                                        <p>Name</p>
                                        <p>Business name</p>
                                        <p>Email</p>
                                        <p>Phone</p>
                                    </div>
                                    {
                                        clientData.clients.clients.map(client => {
                                            return <ClientButton clientData={client} />
                                        })
                                    }
                                </div>
                            </div>
                        </div>
                        
                        <NewClientPopup newClient={newClient} setNewClient={setNewClient} />
                    </>
                )
            } else {
                return ( <p>Error</p>)
            }
    
           
        } else {
            navigate('/sign-in');
        }
    }
}

export default Clients;

I'd like reqType to change to null after the VALIDATE_SESSION query is complete, so I have the lines:

if (sessionData != undefined) {
    auth.reqType = null;
}

I pass reqType to a setContext function to pass headers to an Apollo query:

const authLink = setContext((_, { headers }) => {
  return {
    headers: {
      ...headers,
      reqtype: auth.reqType
    }
  }
})

However, in the backend, the reqType header received is still "session" instead of "null" in the LOAD_CLIENT_DATA query. How can I properly change reqType after the VALIDATE_SESSION query so that the second query to run (LOAD_CLIENT_DATA) passes null in headers instead of "session"? Thank you.