├── store.js
└── action.ts


/store.js:
--------------------------------------------------------------------------------
 1 | import { createStore, applyMiddleware } from 'redux';
 2 | import { composeWithDevTools } from 'redux-devtools-extension';
 3 | import thunk from 'redux-thunk';
 4 | import rootReducer from './reducers';
 5 | 
 6 | const initialState = {};
 7 | 
 8 | const middleware = [thunk];
 9 | 
10 | const store = createStore(
11 |   rootReducer,
12 |   initialState,
13 |   composeWithDevTools(applyMiddleware(...middleware))
14 | );
15 | 
16 | export default store;
17 | 


--------------------------------------------------------------------------------
/action.ts:
--------------------------------------------------------------------------------
 1 | import axios from 'axios';
 2 | import { Dispatch } from 'redux';
 3 | import { TodoAction, TodoActioTypes } from '../../types/todo';
 4 | 
 5 | export const fetchTodos =
 6 |   (page = 1, limit = 10) =>
 7 |   async (dispatch: Dispatch<TodoAction>) => {
 8 |     try {
 9 |       dispatch({ type: TodoActioTypes.FETCH_TODOS });
10 |       const response = await axios.get(
11 |         'https://jsonplaceholder.typicode.com/todos',
12 |         {
13 |           params: { _page: page, _limit: limit },
14 |         }
15 |       );
16 |       dispatch({
17 |         type: TodoActioTypes.FETCH_TODOS_SUCCESS,
18 |         payload: response.data,
19 |       });
20 |     } catch (err) {
21 |       dispatch({
22 |         type: TodoActioTypes.FETCH_TODOS_ERROR,
23 |         payload: 'Error while loading todos',
24 |       });
25 |     }
26 |   };
27 | 
28 | export const setTodoPage = (page: number): TodoAction => {
29 |   return { type: TodoActioTypes.SET_TODO_PAGE, payload: page };
30 | };
31 | 


--------------------------------------------------------------------------------