Как правильно записать проверку контекста next-redux-wrapper?

Question

[Youngtype Pavel]

В makeStore принимаю ctx из next-redux-wrapper как аргумент у которого тип

type Context = NextPageContext | AppContext | GetStaticPropsContext | GetServerSidePropsContext;

и передаю этот контекст в middleware, thunk extraArgument

export const makeStore = (ctx: Context) => {
  return configureStore({
    reducer: rootReducer,
    middleware: (gDM) =>
      gDM<MyDefaultMiddlewareOptions>({
        thunk: {
          // https://github.com/reduxjs/redux-toolkit/issues/2228#issuecomment-1095409011
          extraArgument: ctx,
        },
      }).concat(botApi.middleware, authApi.middleware),
    devTools: process.env.NODE_ENV !== 'production',
  });
};

После чего я принимаю этот контекст в fetchBaseQuery из api как extra и хочу достать из этого контекста req и res если запрос на backend отправляется с сервера, но в зависиимости от того где я вызываю эту query меняется нахождения NextPageContext.

Как более минималистично и правильнее можно это записать?

const baseQuery = fetchBaseQuery({
  baseUrl: 'http://localhost:7777/api/auth',
  prepareHeaders: (headers, api) => {
    const ctx = api.extra as Context;
    let req: IncomingMessage | undefined;
    if (ctx !== undefined) {
      if ((ctx as NextPageContext)?.req !== undefined) {
        req = (ctx as NextPageContext)?.req;
      } else if ((ctx as AppContext)?.ctx?.req !== undefined) {
        req = (ctx as AppContext)?.ctx?.req;
      }
    }

    if (req !== undefined) {
      // We take cookies from the client's browser and set it as ours (server-side)
      headers.set('Cookie', req.headers.cookie || '');
    }

    return headers;
  },
  credentials: 'include',
});

Буду благодарен за любой совет по улучшению этого кода

Answer 1

[Aetae]

Глубоко не вникал, но наверное тут логично испрользовать тайп гарды:

// какая-то проверка достаточная чтобы сказать, что у нас тут NextPageContext;
const isNextPageContext = (ctx: unknown): ctx is NextPageContext => false; 
// аналогично для AppContext
const isAppContext = (ctx: unknown): ctx is AppContext => false; 

const baseQuery = fetchBaseQuery({
  baseUrl: 'http://localhost:7777/api/auth',
  prepareHeaders: (headers, { extra }) => {
    let req;

    if (isNextPageContext(extra)) {
      req = extra.req;
    } else if (isAppContext(extra)) {
      req = extra.ctx?.req;
    }

    if (req) {
      headers.set('Cookie', req.headers.cookie || '');
    }

    return headers;
  },
  credentials: 'include',
});