#153 добавил селект для сортировки по проектам

planner-api/src/routers/tasks.ts

@@ -380,10 +380,16 @@ router.post('/project',async (req: Request, res: Response):Promise<Response>=>{
     const tasks = await
      dataSource
     .getRepository(Task)
+    
     .createQueryBuilder('task')
     .innerJoinAndSelect( 'task.project', 'project')
+    .innerJoinAndSelect('task.author', 'users')
+    .innerJoinAndSelect('task.executor', 'userss')
+    .innerJoinAndSelect( 'task.dateTimeTasks', 'DateTimeTask')
     .where('task.project IN(:...projects)', {projects:projectArray})
     .getMany()
+    
+
     return res.send({tasks})
 }) 
 

planner-front/src/components/UI/MultipleSelect/MultipleSelect.js

@@ -29,7 +29,6 @@ function getStyles(name, personName, theme) {
 }
 
 export default function MultipleSelect({projects,onCloseFilterByProjects}) {
-
   const theme = useTheme();
   const [listProjectIds, setListProjectIds ] = React.useState([])
   const handleChange = (event) => {
@@ -48,10 +47,10 @@ export default function MultipleSelect({projects,onCloseFilterByProjects}) {
         <InputLabel placeholder='Choose Project' 
         label='I am a really really long green TextField label' 
         id="demo-multiple-name-label" sx={{color:'white', padding:'1' }}
-        >Project</InputLabel>
+        >Проекты</InputLabel>
         <Select
           labelId="demo-multiple-name-label"
-          label='Choose Project'
+          label='Выберите проект'
           name='Choose Project'
           id="demo-multiple-name"
           multiple

planner-front/src/components/UsersTasksCompoments/UsersTasksTableContainer/DateTimePicker/DateTimePicker.js

@@ -11,9 +11,6 @@ import moment from "moment";
 
 export default function MaterialUIPickers({ task, name, onChange, currentTask }) {
   const [state, setState] = useState(null)
-  let fullYear = new Date().getFullYear()
-  let month = new Date().getMonth()
-  let day = new Date().getDate();
   useEffect(() => {
     if (!task.dateTimeDeadLine) setState(null)
     if (currentTask) setState(moment(task.dateTimeDeadLine).utc())

planner-front/src/components/UsersTasksCompoments/UsersTasksTableContainer/UsersTasksTableBody/UsersTasksRow/UsersTasksRow.js

@@ -28,7 +28,7 @@ function UsersTasksRow({ row, deleteTaskHandler, calendarOpen, deleteCopyTaskHan
   const [editMode, setEditMode] = useState(false);
 
   const dateTimeTasks = useMemo(() => {
-    if (row.dateTimeTasks.length === 1) {
+    if (row?.dateTimeTasks?.length === 1) {
       const date = moment(row.dateTimeTasks[0].dateTimeStart).utc().format('DD.MM')
       const start = moment(row.dateTimeTasks[0].dateTimeStart).utc().format('HH:mm')
       let end
@@ -60,7 +60,7 @@ function UsersTasksRow({ row, deleteTaskHandler, calendarOpen, deleteCopyTaskHan
         }
 
       </Box>
-    } else if (row.dateTimeTasks.length > 1) {
+    } else if (row?.dateTimeTasks?.length > 1) {
       return (<>
         <IconButton
           aria-label="expand row"
@@ -82,7 +82,7 @@ function UsersTasksRow({ row, deleteTaskHandler, calendarOpen, deleteCopyTaskHan
             : null
         }
       </>)
-    } else if (row.dateTimeTasks.length === 0) {
+    } else if (row?.dateTimeTasks?.length === 0) {
       return (<>
         Копий нет
         {

planner-front/src/components/UsersTasksCompoments/UsersTasksTableToolbar/UsersTasksTableToolbar.js

 import { AppBar, Box, Typography } from "@mui/material";
-import { memo } from "react";
+import { memo, useMemo } from "react";
+import MultipleSelect from "../../UI/MultipleSelect/MultipleSelect";
 import CreateTaskFromButton from "./CreateTaskFromButton/CreateTaskFromButton";
 
 
-function UsersTasksTableToolbar({ addFormStatus, createTaskFromButtonHandler }) {
+function UsersTasksTableToolbar({ addFormStatus, createTaskFromButtonHandler, projects, onCloseFilterByProjects, projectIdListForTaskSelect, setProjectIdListForTaskSelect}) {
 
-  return (
-    <AppBar position="static" sx={{ padding: 3 }}>
-      <Box sx={{ display: 'flex', alignItems: 'center' }}>
-        <Typography
-          sx={{ flex: '1 1 100%' }}
-          variant="h6"
-          id="tableTitle"
-          component="div"
-        >
-          Задачи сотрудников
-        </Typography>
-        <CreateTaskFromButton
-          addFormStatus={addFormStatus}
-          onClick={() => { createTaskFromButtonHandler() }}
-        />
-      </Box>
-    </AppBar>
-  );
+  const projectsFilter = useMemo(() => {
+    if (Array.isArray(projects)) {
+      return <MultipleSelect
+        projects={projects}
+        onCloseFilterByProjects={onCloseFilterByProjects}
+        projectIdListForTaskSelect={projectIdListForTaskSelect}
+        setProjectIdListForTaskSelect={setProjectIdListForTaskSelect}
+      />
+    } else {
+      return null
+    }
+}, [projects, onCloseFilterByProjects, projectIdListForTaskSelect, setProjectIdListForTaskSelect])
+
+return (
+  <AppBar position="static" sx={{ padding: 3 }}>
+    <Box sx={{ display: 'flex', alignItems: 'center' }}>
+      <Typography
+        sx={{ flex: '1 1 100%' }}
+        variant="h6"
+        id="tableTitle"
+        component="div"
+      >
+        Задачи сотрудников
+      </Typography>
+      {projectsFilter}
+      <CreateTaskFromButton
+        addFormStatus={addFormStatus}
+        onClick={() => { createTaskFromButtonHandler() }}
+      />
+    </Box>
+  </AppBar>
+);
 }
 
 export default memo(UsersTasksTableToolbar)
\ No newline at end of file

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

@@ -2,10 +2,10 @@ import Paper from '@mui/material/Paper';
 import UsersTasksTableToolbar from '../../components/UsersTasksCompoments/UsersTasksTableToolbar/UsersTasksTableToolbar';
 import UsersTasksTablePagination from '../../components/UsersTasksCompoments/UsersTasksTablePagination/UsersTasksTablePagination';
 import UsersTasksTableContainer from '../../components/UsersTasksCompoments/UsersTasksTableContainer/UsersTasksTableContainer';
-import { activateCreateCopyTasksMode, addTaskToUserTasksTable, deleteDateTimeTaskUsers, deleteTaskUsers, editTaskUsers, fetchAllTasksByMembership } from '../../store/actions/tasksActions';
+import { activateCreateCopyTasksMode, addTaskToUserTasksTable, deleteDateTimeTaskUsers, deleteTaskUsers, editTaskUsers, fetchAllTasksByMembership, sortTaskByProjects } from '../../store/actions/tasksActions';
 import { shallowEqual, useDispatch, useSelector } from 'react-redux';
 import { useCallback, useEffect, useState } from 'react';
-import { fetchAllUserProjects } from '../../store/actions/projectsActions';
+import { fetchAllUserProjects, fetchProjects } from '../../store/actions/projectsActions';
 import moment from 'moment';
 import { useNavigate } from 'react-router-dom';
 
@@ -13,8 +13,8 @@ export default function EnhancedTable() {
   const dispatch = useDispatch();
   const navigate = useNavigate()
 
-  const { tasks } = useSelector((state) => state.tasks);
-  const { allUserProjectsForModalTask } = useSelector(state => state.projects, shallowEqual)
+  const { tasks, sortedTasks } = useSelector((state) => state.tasks, shallowEqual);
+  const { allUserProjectsForModalTask, projects } = useSelector(state => state.projects, shallowEqual)
 
   const [newTask, setNewTask] = useState({
     priority: '',
@@ -39,11 +39,18 @@ export default function EnhancedTable() {
   const [page, setPage] = useState(0);
   const [rowsPerPage, setRowsPerPage] = useState(10);
   const [addFormStatus, setAddFormStatus] = useState(false);
+  const [projectIdListForTaskSelect, setProjectIdListForTaskSelect] = useState([]);
 
   useEffect(() => {
     dispatch(fetchAllTasksByMembership());
     dispatch(fetchAllUserProjects())
+    dispatch(fetchProjects())
   }, [dispatch]);
+  
+  useEffect(() => {
+    dispatch(sortTaskByProjects(projectIdListForTaskSelect))
+  }, [dispatch, projectIdListForTaskSelect]);
+
 
   const onChangeNewTaskHandler = useCallback((e) => {
     const { value, name } = e.target;
@@ -147,10 +154,10 @@ export default function EnhancedTable() {
     dispatch(deleteDateTimeTaskUsers(id))
   }, [dispatch])
 
-  const calendarOpen = (task) => {
+  const calendarOpen = useCallback((task) => {
     dispatch(activateCreateCopyTasksMode(task, navigate))
-  }
-  console.log(currentTask)
+  }, [dispatch, navigate])
+
   const editCurrentTaskHandler = useCallback(() => {
     if (currentTask.priority === '' || currentTask.project === '' || currentTask.executor === '' || !Object.keys(currentTask.executor).length) {
       const task = {
@@ -174,17 +181,25 @@ export default function EnhancedTable() {
     })
   }, [dispatch, currentTask])
 
+  const onCloseFilterByProjects = useCallback((listProjectIds) => {
+    setProjectIdListForTaskSelect(listProjectIds)
+  }, [])
+
   return (
     <Paper sx={{ width: '100%', mb: 2 }}>
       <UsersTasksTableToolbar
         addFormStatus={addFormStatus}
         createTaskFromButtonHandler={createTaskFromButtonHandler}
+        onCloseFilterByProjects={onCloseFilterByProjects}
+        projectIdListForTaskSelect={projectIdListForTaskSelect}
+        setProjectIdListForTaskSelect={setProjectIdListForTaskSelect}
+        projects={projects.projects}
       />
       <UsersTasksTableContainer
         order={order}
         orderBy={orderBy}
         handleRequestSort={handleRequestSort}
-        rows={tasks}
+        rows={projectIdListForTaskSelect.length ? sortedTasks : tasks}
         page={page}
         rowsPerPage={rowsPerPage}
         addFormStatus={addFormStatus}
@@ -203,7 +218,7 @@ export default function EnhancedTable() {
         editCurrentTaskHandler={editCurrentTaskHandler}
       />
       <UsersTasksTablePagination
-        count={tasks.length}
+        count={projectIdListForTaskSelect.length ? sortedTasks.length : tasks.length}
         rowsPerPage={rowsPerPage}
         page={page}
         handleChangePage={handleChangePage}

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

@@ -31,4 +31,6 @@ export const FETCH_ALL_TASKS_BY_MEMBERSHIP_SUCCESS = "FETCH_ALL_TASKS_BY_MEMBERS
 export const FETCH_ALL_TASKS_BY_MEMBERSHIP_FAILURE = "FETCH_ALL_TASKS_BY_MEMBERSHIP_FAILURE";
 
 export const ACTIVATE_CREATE_COPY_TASKS_MODE = "ACTIVATE_CREATE_COPY_TASKS_MODE"
-export const DEACTIVATE_CREATE_COPY_TASKS_MODE = "DEACTIVATE_CREATE_COPY_TASKS_MODE"
+export const DEACTIVATE_CREATE_COPY_TASKS_MODE = "DEACTIVATE_CREATE_COPY_TASKS_MODE"
\ No newline at end of file
+
+export const SORT_TASKS = "SORT_TASKS"
\ No newline at end of file

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

-import { 
-  ADD_NEW_TASK_FAILURE, 
-  ADD_NEW_TASK_REQUEST, 
-  ADD_NEW_TASK_SUCCESS, 
-  DELETE_TASK_FAILURE, 
-  DELETE_TASK_REQUEST, 
-  DELETE_TASK_SUCCESS, 
-  EDIT_TASK_FAILURE, 
-  EDIT_TASK_REQUEST, 
-  EDIT_TASK_SUCCESS, 
-  FETCH_CALENDAR_TASKS_FAILURE, 
-  FETCH_CALENDAR_TASKS_REQUEST, 
+import {
+  ADD_NEW_TASK_FAILURE,
+  ADD_NEW_TASK_REQUEST,
+  ADD_NEW_TASK_SUCCESS,
+  DELETE_TASK_FAILURE,
+  DELETE_TASK_REQUEST,
+  DELETE_TASK_SUCCESS,
+  EDIT_TASK_FAILURE,
+  EDIT_TASK_REQUEST,
+  EDIT_TASK_SUCCESS,
+  FETCH_CALENDAR_TASKS_FAILURE,
+  FETCH_CALENDAR_TASKS_REQUEST,
   FETCH_CALENDAR_TASKS_SUCCESS,
   FETCH_ALL_TASKS_SUCCESS,
   FETCH_TASKS_BY_PROJECT_SUCCESS,
@@ -20,289 +20,295 @@ import {
   DELETE_DATETIMETASK_REQUEST,
   FETCH_ALL_TASKS_BY_MEMBERSHIP_SUCCESS,
   DEACTIVATE_CREATE_COPY_TASKS_MODE,
-  ACTIVATE_CREATE_COPY_TASKS_MODE
-  } from "../actionTypes/tasksTypes";
+  ACTIVATE_CREATE_COPY_TASKS_MODE,
+  SORT_TASKS
+} from "../actionTypes/tasksTypes";
 import axios from '../../axiosPlanner'
 
 const fetchCalendarTasksRequest = () => {
-  return {type: FETCH_CALENDAR_TASKS_REQUEST}
+  return { type: FETCH_CALENDAR_TASKS_REQUEST }
 };
 
 const fetchCalendarTasksSuccess = (tasks) => {
-  return {type: FETCH_CALENDAR_TASKS_SUCCESS, tasks}
+  return { type: FETCH_CALENDAR_TASKS_SUCCESS, tasks }
 };
 
-const fetchAllTasksSuccess = (tasks,projects) => {
-  return {type: FETCH_ALL_TASKS_SUCCESS, tasks, projects}
+const fetchAllTasksSuccess = (tasks, projects) => {
+  return { type: FETCH_ALL_TASKS_SUCCESS, tasks, projects }
 };
 
 
 const fetchCalendarTasksFailure = (error) => {
-  return {type: FETCH_CALENDAR_TASKS_FAILURE, error}
+  return { type: FETCH_CALENDAR_TASKS_FAILURE, error }
 };
 
 export const fetchCalendarTasks = (userId) => {
   return async (dispatch) => {
-      dispatch(fetchCalendarTasksRequest());
-      try {
-        const response = await axios.get(`/tasks/user/${userId}`);
-        dispatch(fetchCalendarTasksSuccess(response.data.tasks))
-      } catch (error) {
-        dispatch(fetchCalendarTasksFailure(error.response.data));
-      }
+    dispatch(fetchCalendarTasksRequest());
+    try {
+      const response = await axios.get(`/tasks/user/${userId}`);
+      dispatch(fetchCalendarTasksSuccess(response.data.tasks))
+    } catch (error) {
+      dispatch(fetchCalendarTasksFailure(error.response.data));
+    }
   }
 };
 
 export const fetchAllTasks = () => {
   return async (dispatch) => {
-      dispatch(fetchCalendarTasksRequest());
-      try {
-        const response = await axios.get("/tasks/my");
-           dispatch(fetchAllTasksSuccess(response.data.tasks,response.data.projects))
-      } catch (error) {
-        dispatch(fetchCalendarTasksFailure(error.response.data));
-      }
+    dispatch(fetchCalendarTasksRequest());
+    try {
+      const response = await axios.get("/tasks/my");
+      dispatch(fetchAllTasksSuccess(response.data.tasks, response.data.projects))
+    } catch (error) {
+      dispatch(fetchCalendarTasksFailure(error.response.data));
+    }
   }
 };
 
 //**fetch tasks for table UsersTasks,  start*/
 const fetchAllTasksByMembershipSuccess = (tasks, projects) => {
-  return {type: FETCH_ALL_TASKS_BY_MEMBERSHIP_SUCCESS, tasks, projects}
+  return { type: FETCH_ALL_TASKS_BY_MEMBERSHIP_SUCCESS, tasks, projects }
 };
 
 
 
 export const fetchAllTasksByMembership = () => {
   return async (dispatch) => {
-      dispatch(fetchCalendarTasksRequest());
-      try {
-        const response = await axios.get("/tasks/users-tasks");
-           dispatch(fetchAllTasksByMembershipSuccess(response.data.tasks, response.data.projects))
-      } catch (error) {
-        dispatch(fetchCalendarTasksFailure(error.response.data)); 
-      }
+    dispatch(fetchCalendarTasksRequest());
+    try {
+      const response = await axios.get("/tasks/users-tasks");
+      dispatch(fetchAllTasksByMembershipSuccess(response.data.tasks, response.data.projects))
+    } catch (error) {
+      dispatch(fetchCalendarTasksFailure(error.response.data));
+    }
   }
 };
 
 //**end*/
 
+export const sortTaskByProjects = (projectIdListForTaskSelect) => {
+  return { type: SORT_TASKS, projectIdListForTaskSelect }
+}
+
+
 
 const addTaskRequest = () => {
-  return {type: ADD_NEW_TASK_REQUEST} 
+  return { type: ADD_NEW_TASK_REQUEST }
 };
 
 const addTaskSuccess = () => {
-  return {type: ADD_NEW_TASK_SUCCESS}
+  return { type: ADD_NEW_TASK_SUCCESS }
 };
 
 const addTaskFailure = (error) => {
-  return {type: ADD_NEW_TASK_FAILURE, error}
+  return { type: ADD_NEW_TASK_FAILURE, error }
 };
 
 export const addCalendarTask = (task, userId) => {
   return async (dispatch) => {
-      dispatch(addTaskRequest());
-      try {
-        await axios.post("/tasks", task);
-        dispatch(addTaskSuccess())
-        dispatch(fetchCalendarTasks(userId))
-      } catch (error) {
-        dispatch(addTaskFailure(error.response.data));
-      }
+    dispatch(addTaskRequest());
+    try {
+      await axios.post("/tasks", task);
+      dispatch(addTaskSuccess())
+      dispatch(fetchCalendarTasks(userId))
+    } catch (error) {
+      dispatch(addTaskFailure(error.response.data));
+    }
   }
 }
 
 export const addCopyCalendarTask = (task, userId) => {
   return async (dispatch) => {
-      dispatch(addTaskRequest());
-      try {
-        await axios.post("/copy-tasks/make-copy", task);
-        dispatch(addTaskSuccess())
-        dispatch(fetchCalendarTasks(userId))
-      } catch (error) {
-        dispatch(addTaskFailure(error.response.data));
-      }
+    dispatch(addTaskRequest());
+    try {
+      await axios.post("/copy-tasks/make-copy", task);
+      dispatch(addTaskSuccess())
+      dispatch(fetchCalendarTasks(userId))
+    } catch (error) {
+      dispatch(addTaskFailure(error.response.data));
+    }
   }
 }
 
 export const addTask = (task) => {
   return async (dispatch) => {
-      dispatch(addTaskRequest());
-      try {
-        await axios.post("/tasks", task);
-        dispatch(addTaskSuccess())
-        dispatch(fetchAllTasks())
-      } catch (error) {
-        dispatch(addTaskFailure(error.response.data));
-      }
+    dispatch(addTaskRequest());
+    try {
+      await axios.post("/tasks", task);
+      dispatch(addTaskSuccess())
+      dispatch(fetchAllTasks())
+    } catch (error) {
+      dispatch(addTaskFailure(error.response.data));
+    }
   }
 }
 
 const editTaskRequest = () => {
-  return {type: EDIT_TASK_REQUEST}
+  return { type: EDIT_TASK_REQUEST }
 };
 
 const editTaskSuccess = () => {
-  return {type: EDIT_TASK_SUCCESS}
+  return { type: EDIT_TASK_SUCCESS }
 };
 
 const editTaskFailure = (error) => {
-  return {type: EDIT_TASK_FAILURE, error}
+  return { type: EDIT_TASK_FAILURE, error }
 };
 
 export const editTask = (task) => {
   return async (dispatch) => {
-      dispatch(editTaskRequest());
-      try {
-        await axios.put(`/tasks/${task.id}`, task);
-        dispatch(editTaskSuccess())
-        dispatch(fetchAllTasks())
-      } catch (error) {
-        dispatch(editTaskFailure(error.response.data));
-      }
+    dispatch(editTaskRequest());
+    try {
+      await axios.put(`/tasks/${task.id}`, task);
+      dispatch(editTaskSuccess())
+      dispatch(fetchAllTasks())
+    } catch (error) {
+      dispatch(editTaskFailure(error.response.data));
+    }
   }
 }
 
 export const editTaskUsers = (task) => {
   return async (dispatch) => {
-      dispatch(editTaskRequest());
-      try {
-        await axios.put(`/tasks/${task.id}`, task);
-        dispatch(editTaskSuccess())
-        await dispatch(fetchAllTasksByMembership())
-      } catch (error) {
-        dispatch(editTaskFailure(error.response.data));
-      }
+    dispatch(editTaskRequest());
+    try {
+      await axios.put(`/tasks/${task.id}`, task);
+      dispatch(editTaskSuccess())
+      dispatch(fetchAllTasksByMembership())
+    } catch (error) {
+      dispatch(editTaskFailure(error.response.data));
+    }
   }
 }
 
 export const editCalendarTask = (task, taskId, userId) => {
   return async (dispatch) => {
-      dispatch(editTaskRequest());
-      try {
-        await axios.put(`/copy-tasks/change-copy/${taskId}`, task);
-        dispatch(editTaskSuccess())
-        dispatch(fetchCalendarTasks(userId))
-      } catch (error) {
-        dispatch(editTaskFailure(error.response.data));
-      }
+    dispatch(editTaskRequest());
+    try {
+      await axios.put(`/copy-tasks/change-copy/${taskId}`, task);
+      dispatch(editTaskSuccess())
+      dispatch(fetchCalendarTasks(userId))
+    } catch (error) {
+      dispatch(editTaskFailure(error.response.data));
+    }
   }
 }
 
 const deleteTaskRequest = () => {
-  return {type: DELETE_TASK_REQUEST}
+  return { type: DELETE_TASK_REQUEST }
 };
- 
+
 const deleteTaskSuccess = () => {
-  return {type: DELETE_TASK_SUCCESS}
+  return { type: DELETE_TASK_SUCCESS }
 };
 
 const deleteTaskFailure = (error) => {
-  return {type: DELETE_TASK_FAILURE, error}
+  return { type: DELETE_TASK_FAILURE, error }
 };
 
 export const deleteTask = (taskId) => {
   return async (dispatch) => {
-      dispatch(deleteTaskRequest());
-      try {
-        await axios.delete(`/tasks/${taskId}`);
-        dispatch(deleteTaskSuccess())
-        dispatch(fetchAllTasks())
-      } catch (error) {
-        dispatch(deleteTaskFailure(error.response.data));
-      }
+    dispatch(deleteTaskRequest());
+    try {
+      await axios.delete(`/tasks/${taskId}`);
+      dispatch(deleteTaskSuccess())
+      dispatch(fetchAllTasks())
+    } catch (error) {
+      dispatch(deleteTaskFailure(error.response.data));
+    }
   }
 }
 
 export const deleteTaskUsers = (taskId) => {
   return async (dispatch) => {
-      dispatch(deleteTaskRequest());
-      try {
-        await axios.delete(`/tasks/${taskId}`);
-        dispatch(deleteTaskSuccess())
-        await dispatch(fetchAllTasksByMembership())
-      } catch (error) {
-        dispatch(deleteTaskFailure(error.response.data));
-      }
+    dispatch(deleteTaskRequest());
+    try {
+      await axios.delete(`/tasks/${taskId}`);
+      dispatch(deleteTaskSuccess())
+      dispatch(fetchAllTasksByMembership())
+    } catch (error) {
+      dispatch(deleteTaskFailure(error.response.data));
+    }
   }
 }
 
 export const deleteCalendarTask = (taskId, userId) => {
   return async (dispatch) => {
-      dispatch(deleteTaskRequest());
-      try {
-        await axios.delete(`/copy-tasks/${taskId}`);
-        dispatch(deleteTaskSuccess())
-        dispatch(fetchCalendarTasks(userId))
-      } catch (error) {
-        dispatch(deleteTaskFailure(error.response.data));
-      }
+    dispatch(deleteTaskRequest());
+    try {
+      await axios.delete(`/copy-tasks/${taskId}`);
+      dispatch(deleteTaskSuccess())
+      dispatch(fetchCalendarTasks(userId))
+    } catch (error) {
+      dispatch(deleteTaskFailure(error.response.data));
+    }
   }
 }
 
 
 
 const fetchTasksByProjectRequest = () => {
-  return {type: FETCH_TASKS_BY_PROJECT_REQUEST}
+  return { type: FETCH_TASKS_BY_PROJECT_REQUEST }
 };
 
 const fetchTasksByProjectSuccess = () => {
-  return {type: FETCH_TASKS_BY_PROJECT_SUCCESS}
+  return { type: FETCH_TASKS_BY_PROJECT_SUCCESS }
 };
 
 const fetchTasksByProjectFailure = (error) => {
-  return {type: FETCH_TASKS_BY_PROJECT_FAILURE, error}
+  return { type: FETCH_TASKS_BY_PROJECT_FAILURE, error }
 };
 
 export const fetchTasksByProject = (projects) => {
   return async (dispatch) => {
-      dispatch(fetchTasksByProjectRequest());
-      try {
-        const response =await axios.post("/tasks/project", projects);
-        dispatch(fetchTasksByProjectSuccess(response.data.tasks))
-      } catch (error) {
-        dispatch(fetchTasksByProjectFailure(error.response.data));
-      }
+    dispatch(fetchTasksByProjectRequest());
+    try {
+      const response = await axios.post("/tasks/project", projects);
+      dispatch(fetchTasksByProjectSuccess(response.data.tasks))
+    } catch (error) {
+      dispatch(fetchTasksByProjectFailure(error.response.data));
+    }
   }
 }
 
 
 
 const deleteDateTimeTaskRequest = () => {
-  return {type: DELETE_DATETIMETASK_REQUEST}
+  return { type: DELETE_DATETIMETASK_REQUEST }
 };
- 
+
 const deleteDateTimeTaskSuccess = () => {
-  return {type: DELETE_DATETIMETASK_SUCCESS}
+  return { type: DELETE_DATETIMETASK_SUCCESS }
 };
 
 const deleteDateTimeTaskFailure = (error) => {
-  return {type: DELETE_DATETIMETASK_FAILURE, error}
+  return { type: DELETE_DATETIMETASK_FAILURE, error }
 };
 
 export const deleteDateTimeTask = (dateTimeTaskId) => {
   return async (dispatch) => {
-      dispatch(deleteDateTimeTaskRequest());
-      try {
-        await axios.delete(`/copy-tasks/${dateTimeTaskId}`);
-        dispatch(deleteDateTimeTaskSuccess())
-        dispatch(fetchAllTasks())
-      } catch (error) {
-        dispatch(deleteDateTimeTaskFailure(error.response.data));
-      }
+    dispatch(deleteDateTimeTaskRequest());
+    try {
+      await axios.delete(`/copy-tasks/${dateTimeTaskId}`);
+      dispatch(deleteDateTimeTaskSuccess())
+      dispatch(fetchAllTasks())
+    } catch (error) {
+      dispatch(deleteDateTimeTaskFailure(error.response.data));
+    }
   }
 }
 
 export const deleteDateTimeTaskUsers = (dateTimeTaskId) => {
   return async (dispatch) => {
-      dispatch(deleteDateTimeTaskRequest());
-      try {
-        await axios.delete(`/copy-tasks/${dateTimeTaskId}`);
-        dispatch(deleteDateTimeTaskSuccess())
-        dispatch(fetchAllTasksByMembership())
-      } catch (error) {
-        dispatch(deleteDateTimeTaskFailure(error.response.data));
-      }
+    dispatch(deleteDateTimeTaskRequest());
+    try {
+      await axios.delete(`/copy-tasks/${dateTimeTaskId}`);
+      dispatch(deleteDateTimeTaskSuccess())
+      dispatch(fetchAllTasksByMembership())
+    } catch (error) {
+      dispatch(deleteDateTimeTaskFailure(error.response.data));
+    }
   }
 }
 
@@ -310,27 +316,27 @@ export const deleteDateTimeTaskUsers = (dateTimeTaskId) => {
 
 /** add new task in UserTasks Table */
 const addTaskToUserTasksTableRequest = () => {
-  return {type: ADD_NEW_TASK_REQUEST} 
+  return { type: ADD_NEW_TASK_REQUEST }
 };
 
 const addTaskToUserTasksTableSuccess = () => {
-  return {type: ADD_NEW_TASK_SUCCESS}
+  return { type: ADD_NEW_TASK_SUCCESS }
 };
 
 const addTaskToUserTasksTableFailure = (error) => {
-  return {type: ADD_NEW_TASK_FAILURE, error}
+  return { type: ADD_NEW_TASK_FAILURE, error }
 };
 
 export const addTaskToUserTasksTable = (task) => {
   return async (dispatch) => {
-      dispatch(addTaskToUserTasksTableRequest());
-      try {
-        await axios.post("/tasks/users", task);
-        dispatch(addTaskToUserTasksTableSuccess())
-        dispatch(fetchAllTasksByMembership())
-      } catch (error) {
-        dispatch(addTaskToUserTasksTableFailure(error.response.data));
-      }
+    dispatch(addTaskToUserTasksTableRequest());
+    try {
+      await axios.post("/tasks/users", task);
+      dispatch(addTaskToUserTasksTableSuccess())
+      dispatch(fetchAllTasksByMembership())
+    } catch (error) {
+      dispatch(addTaskToUserTasksTableFailure(error.response.data));
+    }
   }
 }
 
@@ -338,9 +344,9 @@ export const addTaskToUserTasksTable = (task) => {
 
 export const activateCreateCopyTasksMode = (task, navigate) => {
   navigate('/')
-  return {type: ACTIVATE_CREATE_COPY_TASKS_MODE, task}
+  return { type: ACTIVATE_CREATE_COPY_TASKS_MODE, task }
 }
 
 export const deactivateCreateCopyTasksMode = () => {
-  return {type: DEACTIVATE_CREATE_COPY_TASKS_MODE}
+  return { type: DEACTIVATE_CREATE_COPY_TASKS_MODE }
 }
\ No newline at end of file

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

@@ -21,7 +21,8 @@ import {
   DELETE_DATETIMETASK_REQUEST,
   FETCH_ALL_TASKS_BY_MEMBERSHIP_SUCCESS,
   ACTIVATE_CREATE_COPY_TASKS_MODE,
-  DEACTIVATE_CREATE_COPY_TASKS_MODE
+  DEACTIVATE_CREATE_COPY_TASKS_MODE,
+  SORT_TASKS
 } from "../actionTypes/tasksTypes";
 
 const initialState = {
@@ -31,6 +32,7 @@ const initialState = {
   },
   tasks: [],
   calendarTasks: [],
+  sortedTasks: [],
   loading: false,
   error: null,
 };
@@ -141,6 +143,9 @@ const tasksReduсer = (state = initialState, action) => {
       return { ...state, copyMode: { working: true, task: action.task } }
     case DEACTIVATE_CREATE_COPY_TASKS_MODE:
       return { ...state, copyMode: { working: false, task: null } }
+    case SORT_TASKS:
+      const filteredTasks = state.tasks.filter(task=>action.projectIdListForTaskSelect.includes(task.project?.id)) 
+      return { ...state, loading: false, sortedTasks: filteredTasks };
     default:
       return state;
   }