Use API Facade instead of request url

In my project, I use API Facades to fetch data and saga looks like

export const handleGetItem: Saga = function*({
  payload,
}: PayloadAction<typeof ActionEnum.API_GET_REQUEST, Payload>): IterableIterator<any> {
  const { id }: Payload = payload;
  const facade: Facade = yield getContext(SagaContextEnum.facade);

  try {
    const storeItem: IItem = yield call(() => facade.getItem(id));
    yield put(actions.successGetItem(storeItem));
  } catch (err) {
    yield put(actions.errorGetItem(err));
  }
};

How can I pass facade.getItem(id) to the redux-saga-request action creator?? Is it possible to implement this feature in this library??

[klis87]

@strdr4605 I am surprised as

const x = () => {
  return new Promise(resolve => resolve(1));
};

does not show any TS errors.

Anyway, I am closing this issue in favour of #244

[klis87]

@strdr4605 of course, if you dispatch request action like yield put(getItems(id)), then id can be from yield select ( I know you mentioned u dont wanna have id in action payload, for this see below methods)

personally though, If I had some id which is part of many request actions, I would just use redux thunk, which makes your sagas clean, or works if you dispatch actions from react too:

function getItems() {
  return (dispatch, getState) => {
    const id = idSelector(getState());
    
    return dispatch({
      type: 'GET_ITEMS',
      request: {
        url: `/${id}/list`
      }
    };
  };
}

In my apps I sometimes do also another thing, kind of magical but I find it very convenient:

import { mapRequest } from 'redux-saga-requests/lib/helpers';

const interpolatePlaceholders = (config, { user }) => {
  if (config.url.includes('{user}')) {
    config = { ...config, url: config.url.replace('{user}', user) };
  }

  return config;
};


function* onRequest(request) {
  const user = yield select(userIdSelector);

  return mapRequest(request, config =>
    interpolatePlaceholders(config, { user }),
  );
}

By using request interceptor, I can then define actions like:

const getItems = () => ({
  type: 'GET_ITEMS',
  request: {
    url: '/{user}/list'
  }
});