The first action creator we will implement will be for getting unanswered questions. So, let's get started by carrying out the following steps: 

1. Let's start by importing the following additional types from the Redux core library:

import { Action, ActionCreator, Dispatch } from 'redux';

2. Next, let's implement the action creator, which will gather unanswered questions:

export const getUnansweredQuestionsActionCreator = () => {
  return async (dispatch: Dispatch) => {
    // TODO - dispatch the GettingUnansweredQuestions action 
    // TODO - get the questions from server
    // TODO - dispatch the GotUnansweredQuestions action 
  };
};

This is an asynchronous action creator and returns a function that will dispatch two actions. So, the returned function has a dispatch parameter, which is used to dispatch the actions.

3. Let's dispatch the GettingUnansweredQuestions action:

export const getUnansweredQuestionsActionCreator = () => {
  return async (dispatch: Dispatch) => {
    const gettingUnansweredQuestionsAction: 
    GettingUnansweredQuestionsAction = {
      type: 'GettingUnansweredQuestions'
    };
    dispatch(gettingUnansweredQuestionsAction);
    // TODO - get the questions from server
    // TODO - dispatch the GotUnansweredQuestions action 
  };
};

Using the GettingUnansweredQuestionsAction type annotation helps us ensure the action is defined correctly. We simply use the dispatch parameter to dispatch the action. 

4. Now, let's get the unanswered questions from the server by importing the function that does this:

import { QuestionData, getUnansweredQuestions } from './QuestionsData';

5. Now, we can use this function to get the unanswered questions from the server in our action creator:

export const getUnansweredQuestionsActionCreator = () => {
  return async (dispatch: Dispatch) => {
    const gettingUnansweredQuestionsAction: 
    GettingUnansweredQuestionsAction = {
      type: 'GettingUnansweredQuestions'
    };
    dispatch(gettingUnansweredQuestionsAction);
    const questions = await getUnansweredQuestions();
    // TODO - dispatch the GotUnansweredQuestions action 
  };
};

6. Let's dispatch the GotUnansweredQuestions action containing the unanswered questions and return this action:

export const getUnansweredQuestionsActionCreator = () => {
  return async (dispatch: Dispatch) => {
    const gettingUnansweredQuestionsAction: 
    GettingUnansweredQuestionsAction = {
      type: 'GettingUnansweredQuestions'
    };
    dispatch(gettingUnansweredQuestionsAction);
    const questions = await getUnansweredQuestions();
    const gotUnansweredQuestionAction: GotUnansweredQuestionsAction 
    = {
      questions,
      type: 'GotUnansweredQuestions'
    };
    dispatch(gotUnansweredQuestionAction);
  };
};

7. Our final task for this action creator is to add type annotation. First, we need to import ThunkAction from the Redux Thunk core library:

import { ThunkAction } from 'redux-thunk';

8. We can use this type in our type annotation:

export const getUnansweredQuestionsActionCreator: ActionCreator<
  ThunkAction<
    Promise<void>,
    QuestionData[],
    null,
    GotUnansweredQuestionsAction
  >
> = () => {
  ...
};

ActionCreator is a generic type from the core Redux library that takes in a parameter for the type of action that is created. 

The type of action that's created isn't straightforward because the action creator is asynchronous, so we use the ThunkAction type from the Redux Thunk library, which is another generic type that has four parameters:

• The first parameter is the return type for the inner function, which is Promise<void> in this case.
• The second parameter is the type of data within the last action, which is QuestionData[] in this case.
• The third parameter is the type for the parameter that is passed into the nested function. In this case, this is null because there is no parameter.
• The last parameter is the type of the last action to be dispatched, which is GotUnansweredQuestionsAction in this case.

That completes the implementation of our first action creator.