payload of bindAsyncAction worker args is action ? or payload ?

actions.ts

import actionCreatorFactory from "typescript-fsa";

import { Image } from "services/api/models";

const actionCreator = actionCreatorFactory();

export const getImages = actionCreator<
  { page: number } | void
>("GET_IMAGES");

export const getImagesAsync = actionCreator.async<
  { page: number } | void,
  { images: Image[]; page: number }
>("GET_IMAGES");

sagas.ts

import { SagaIterator } from "redux-saga";
import { fork, call, takeLatest } from "redux-saga/effects";
import { bindAsyncAction } from "typescript-fsa-redux-saga";

import { getImages, getImagesAsync } from "actions";
import { fetchImages } from "api";

const getImagesWorker = bindAsyncAction(getImagesAsync)(
  function* (payload): SagaIterator {
    console.log(payload);  // {type: "GET_IMAGES", payload: {page: 1}} why ??
    return yield call(fetchImages, payload);
  },
);

function* saga() {
  yield takeLatest(getImages, getImagesWorker);
}

export default fork(saga);

component.tsx

import * as React from "react";
import { connect, ConnectedProps } from "react-redux";
import { compose } from "recompose";
import { Dispatch, bindActionCreators } from "redux";

import { getImages } from "actions";

interface IProps {
}

const mapDispatchToProps = (dispatch: Dispatch) => bindActionCreators(
  { getImages },
  dispatch,
);

const connector = connect(null, mapDispatchToProps);

type ComposedProps = IProps & ConnectedProps<typeof connector>;

export class RootIndexPage extends React.Component<ComposedProps> {
  componentDidMount() {
    this.props.getImages({page: 1});
  }

  render() {
    return (
      <div>
        hoge
      </div>
    );
  }
}

export default compose<IProps, IProps>(
  connector,
)(RootIndexPage);

Why is the action argument passed to the worker instead of payload?

aikoven / typescript-fsa-redux-saga

payload of bindAsyncAction worker args is action ? or payload ? #14

actions.ts

sagas.ts

component.tsx