Reacting to a store change outside the context of a root or render function

export const [userStore, setUserStore] = makePersisted(
  createStore<UserStoreState>({
    user: null,
    tokens: null,
    accessToken: '',
  }),
  { name: 'linkerly-user-store', storageOptions: { type: 'localStorage' } },
);

const getAccessToken = () => {
  return userStore.accessToken;
};

export const linkerlyApi = wretch(API_URI)
  .headers({ 'Content-Type': 'application/json' })
  .auth(`Bearer ${getAccessToken() ?? 'no'}`)

setUserStore(
        produce((draft) => {
          draft.user = loginResponse.user;
          draft.tokens = loginResponse.tokens;
          draft.accessToken = loginResponse.tokens.accessToken;
        }),
      );

userStore.accessToken