#28 Создал редюсер и экшен на получение задач

planner-front/src/containers/MonthCalendar/MonthCalendar.js

 import { Container } from '@mui/material';
 import { useEffect, useState } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
 import MonthCalendarBody from '../../components/MonthCalendarBody/MonthCalendarBody';
 import MonthCalendarHeader from '../../components/MonthCalendarHeader/MonthCalendarHeader';
+import { fetchTasks } from '../../store/actions/tasksActions';
 
 function MonthCalendar() {
+  const dispatch = useDispatch();
+  const { tasks } = useSelector(state => state.tasks);
+
   const [month, setMonth] = useState('')
   const [year, setYear] = useState('')
   const [worker, setWorker] = useState('');
@@ -13,7 +18,9 @@ function MonthCalendar() {
   useEffect(()=>{
     setMonth(new Date().getMonth())
     setYear(new Date().getFullYear())
-  },[])
+    dispatch(fetchTasks())
+  }, [dispatch])
+  console.log(tasks)
   const onChangeWorkerHandler = (event) => {
     setWorker(event.target.value);
   };

planner-front/src/index.js

@@ -5,6 +5,7 @@ import App from './App';
 import { configureStore } from '@reduxjs/toolkit';
 import { Provider } from 'react-redux';
 import usersReducer from './store/reducers/usersReducer';
+import tasksReducer from './store/reducers/tasksReducer';
 import axios from 'axios';
 
 const localStorageMiddleware = ({getState}) => (next) => (action) => {
@@ -31,6 +32,7 @@ axios.interceptors.request.use(config=>{
 const store = configureStore({
   reducer: {
     users: usersReducer,
+    tasks: tasksReducer
   },
   preloadedState: loadFromLocalStorage(),
   middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(localStorageMiddleware)

planner-front/src/store/actionTypes/tasksTypes.js

+export const FETCH_TASKS_REQUEST = "FETCH_TASKS_REQUEST";
+export const FETCH_TASKS_SUCCESS = "FETCH_TASKS_SUCCESS";
+export const FETCH_TASKS_FAILURE = "FETCH_TASKS_FAILURE";
\ No newline at end of file

planner-front/src/store/actions/tasksActions.js

+import { FETCH_TASKS_FAILURE, FETCH_TASKS_REQUEST, FETCH_TASKS_SUCCESS } from "../actionTypes/tasksTypes";
+import axios from '../../axiosPlanner'
+
+const fetchTasksRequest = () => {
+  return {type:  FETCH_TASKS_REQUEST}
+};
+
+const fetchTasksSuccess = (tasks) => {
+  return {type: FETCH_TASKS_SUCCESS, tasks}
+};
+
+const fetchTasksFailure = (error) => {
+  return {type: FETCH_TASKS_FAILURE, error}
+};
+
+export const fetchTasks = () => {
+  return async (dispatch) => {
+      dispatch(fetchTasksRequest());
+      try {
+        const response = await axios.get("/tasks");
+        console.log(response.data)
+        dispatch(fetchTasksSuccess(response.data))
+      } catch (error) {
+        dispatch(fetchTasksFailure(error.response.data));
+      }
+  }
+}

planner-front/src/store/reducers/tasksReducer.js

+import { FETCH_TASKS_FAILURE, FETCH_TASKS_REQUEST, FETCH_TASKS_SUCCESS } from "../actionTypes/tasksTypes";
+
+const initialState = {
+    tasks: [],
+    loading: false,
+    error: null
+};
+
+const tasksReduсer = (state = initialState, action) => {
+  switch(action.type) {
+    case FETCH_TASKS_REQUEST:
+        return {...state, loading: true};
+    case FETCH_TASKS_SUCCESS:
+        return {...state, loading: false, tasks: action.tasks};
+    case FETCH_TASKS_FAILURE:
+        return {...state, loading: false, error: action.error};
+    default: 
+        return state;
+}
+};
+
+export default tasksReduсer;
\ No newline at end of file

planner-front/src/store/reducers/usersReducer.js

@@ -5,14 +5,14 @@ const initialState = {
         name: 'Ivan',
         surname: 'Petrov',
         email: 'test@gmail.com',
-        role: 'user'
+        role: 'superuser'
       },
     registerError: null,
     loginError: null,
     loading: false
 };
 
-const usersReduser = (state = initialState, action) => {
+const usersReducer = (state = initialState, action) => {
     switch(action.type) {
         case REGISTER_USER_REQUEST:
             return {...state, loading: true};
@@ -31,4 +31,4 @@ const usersReduser = (state = initialState, action) => {
     }
 };
 
-export default usersReduser;
+export default usersReducer;