const addListRequest = (): Action => ({
  type: ActionTypes.ADD_LIST_REQUEST
});
const addListSuccess = (list: string): Action => ({
  type: ActionTypes.ADD_LIST_SUCCESS,
  payload: list
});
const addListError = (error: Error): Action => ({
  type: ActionTypes.ADD_LIST_ERROR,
  payload: error.message
});

export function addList(spHttpClient: SPHttpClient, currentWebUrl: string, listTitle: string) {
  return async (dispatch: any) => {

    //Fire the 'request' action if you want to update the state to specify that an ajax request is being made.
    //This can be used to show a loading screen or a spinner.
    dispatch(addListRequest());

    const spOpts: ISPHttpClientOptions = {
      body: `{ Title: '${listTitle}', BaseTemplate: 100 }`
    };

    try {
      const response: SPHttpClientResponse = await spHttpClient.post(`${currentWebUrl}/_api/web/lists`, SPHttpClient.configurations.v1, spOpts);
      const list: IODataList = await response.json();

      //Fire the 'success' action when you want to update the state based on a successfull request.  
      dispatch(addListSuccess(list.Title));

    } catch (error) {
      //Fire the 'error' action when you want to update the state based on an error request.
      dispatch(addListError(error));
    }
  };
 }