feat: intermediate commit

src/containers/Dashboard.tsx

@@ -1,4 +1,5 @@
 import { Carousel } from 'antd';
+import { useSelector } from 'react-redux';
 import styled from 'styled-components';
 
 const StyledCarousel = styled(Carousel)``;
@@ -12,21 +13,24 @@ const Slide1 = styled.h3`
 const Slide2 = styled(Slide1)`
   background: url('https://vypechka-online.ru/wp-content/uploads/2019/09/EQgJ4p77Aeo.jpg');
 `;
-const DashboardContainer: React.FunctionComponent = () => (
-  <StyledCarousel autoplay>
-    <div>
-      <Slide1>1</Slide1>
-    </div>
-    <div>
-      <Slide2>2</Slide2>
-    </div>
-    <div>
-      <Slide1>3</Slide1>
-    </div>
-    <div>
-      <Slide1>4</Slide1>
-    </div>
-  </StyledCarousel>
-);
-
+const DashboardContainer: React.FunctionComponent = () => {
+  const movies = useSelector((store) => store.movies);
+  console.log('Axios', movies);
+  return (
+    <StyledCarousel autoplay>
+      <div>
+        <Slide1>1</Slide1>
+      </div>
+      <div>
+        <Slide2>2</Slide2>
+      </div>
+      <div>
+        <Slide1>3</Slide1>
+      </div>
+      <div>
+        <Slide1>4</Slide1>
+      </div>
+    </StyledCarousel>
+  );
+};
 export default DashboardContainer;

src/redux/app/actions.ts

@@ -1,5 +1,7 @@
 import { Dispatch } from 'react';
 
+import { mostPopularMovies } from '../../services/api';
+import { MostPopularMovie, MoviesResponse } from '../../services/types';
 import { Fighter } from './reducer';
 import { AppActionTypes, AppActions } from './types';
 
@@ -25,3 +27,9 @@ export const loadFighters = () => async (dispatch: Dispatch<AppActionTypes>) =>
   const data = await result.json();
   dispatch(setFighters(data));
 };
+
+export const loadMovies =
+  () =>
+    async (dispatch: Dispatch<AppActionTypes>): Promise<MoviesResponse<MostPopularMovie>> => {
+      dispatch(mostPopularMovies());
+    };

src/redux/app/reducer.ts

@@ -1,3 +1,4 @@
+import { MostPopularMovie, MoviesResponse } from '../../services/types';
 import { AppActionTypes, AppActions } from './types';
 
 export interface Fighter {
@@ -11,11 +12,13 @@ export interface Fighter {
 export interface AppStore {
   counter: number;
   fighters: Fighter[];
+  movies: MoviesResponse<MostPopularMovie>[];
 }
 
 const initialStore: AppStore = {
   counter: 0,
   fighters: [],
+  movies: [],
 };
 
 const app = (store = initialStore, action: AppActionTypes) => {
@@ -26,6 +29,8 @@ const app = (store = initialStore, action: AppActionTypes) => {
       return { ...store, counter: store.counter - action.payload };
     case AppActions.SET_FIGHTERS:
       return { ...store, fighters: action.payload };
+    case AppActions.SET_MOVIES:
+      return { ...store, movies: action.payload };
     default:
       return store;
   }

src/redux/app/types.ts

@@ -1,9 +1,11 @@
+import { MostPopularMovie, MoviesResponse } from '../../services/types';
 import { Fighter } from './reducer';
 
 export enum AppActions {
   INC_COUNTER = 'INC_COUNTER',
   DEC_COUNTER = 'DEC_COUNTER',
   SET_FIGHTERS = 'SET_FIGHTERS',
+  SET_MOVIES = 'SET_MOVIES',
 }
 
 interface IncreaseCounterAction {
@@ -20,5 +22,13 @@ interface AddFightersAction {
   type: AppActions.SET_FIGHTERS;
   payload: Fighter[];
 }
+interface SetMoviesDataAction {
+  type: AppActions.SET_MOVIES;
+  payload: MoviesResponse<MostPopularMovie>[];
+}
 
-export type AppActionTypes = IncreaseCounterAction | DecreaseCounterAction | AddFightersAction;
+export type AppActionTypes =
+  | IncreaseCounterAction
+  | DecreaseCounterAction
+  | AddFightersAction
+  | SetMoviesDataAction;