How do I initialize a variable in Apollo Client 3 - react-apollo

Question

Hey I'm trying to learn Apollo Client v3 but I can't wrap my head around the docs and the new local state management.
I want to have a state which remembers the month and the year last used.
This is what I have in my old Apollo when I create a new ApolloClient
clientState: {
defaults: {
currentMonth: 8,
currentYear: 2020,
},
},
So trying to understand the new docs this is what I tried
const cache = new InMemoryCache({
typePolicies: {
clientState: {
fields: {
month: 8,
year: 2020,
},
},
},
});
But with no luck. I feel really dumb for not understanding the docs but it's hard to find anything that resembles my question.
Right now I'm really close to swap to Redux but still hoping for a solution.

Answer 1

You can use reactive variables in the Apollo Client 3.
https://www.apollographql.com/docs/react/local-state/reactive-variables/#:~:text=New%20in%20Apollo%20Client%203,application%20without%20using%20GraphQL%20syntax.
For your example:
Define
import { makeVar } from '#apollo/client';
export const currentMonth = makeVar(8);
export const currentYear = makeVar(2020);
Get
import { currentMonth, currentYear } from "./yourPath/yourFile";
// Output: 8
console.log(currentMonth());
// Output: 2020
console.log(currentYear());
Set
import { currentMonth, currentYear } from "./yourPath/yourFile";
currentMonth(9);
// Output: 9
console.log(currentMonth());
currentYear(2021);
// Output: 2021
console.log(currentYear());