redux toolkit

Redux query

chain api call

  const [login, { isLoading, error: loginError, isSuccess: isLoginSuccess }] =
    useLoginMutation();
  const { isLoading: isGetMeLoading } = useGetMeQuery(undefined, {
    skip: !isLoginSuccess,
  }); // run after login success

Prepend authorization header

export const rootApi = createApi({
  baseQuery: fetchBaseQuery({
    baseUrl: API_HOST,
    prepareHeaders: (headers, { getState }) => {
      const token = (getState() as RootState).auth.accessToken;
      if (token) {
        headers.set('Authorization', `Bearer ${token}`);
      }
      return headers;
    },
  }),
  endpoints: () => ({}),
});

code spliiting

export const userApi = rootApi.injectEndpoints({
  ...
})