My reactive variable won't maintain its value

Help
,
1

I’m trying to store the logged user into a reactive variable so I can access to it in several components in my app but it always returns the default value.
This is my cache inside my Apollo Client config file:

interface MeInterface {
  id: number;
  username: string;
  email: string;
}

export const meVar = makeVar<MeInterface | undefined>(undefined);

cache: new InMemoryCache({
      typePolicies: {
        Query: {
          fields: {
            me: {
              read() {
                return meVar();
              },
            },
          },
        },
      },
    })

And then inside a form I write in the cache and set the values for the reactive variable (if console log, it shows the values):

const response = await login({
            variables: values,
            update: (cache, { data }) => {
              cache.writeQuery({
                query: MeDocument,
                data: {
                  __typename: "Query",
                  me: data?.login.user,
                },
              });
              meVar(data!.login.user);
            },
          });
const client = useReactiveVar(meVar)
console.log(meVar)

But when I want to print the reactive variable inside a functional component in other file I get an undefined (the default value):

const dd = useReactiveVar(meVar);
console.log(dd);

Is there any thing I’m doing wrong?