обновила проект с гита

planner-front/src/components/MyTasksCompoments/MyTaskToolBar.js

@@ -17,6 +17,9 @@ export default function MyTaskToolBar(props) {
           </Typography>
           <MultipleSelect
           projects={props.projects}
+          onClose={props.onClose}
+          projectName={props.projectName}
+          setProjectName={props.setProjectName}
           />
           <Button color="inherit" onClick={props.onClick} >Добавить задачу</Button>
         </Toolbar>

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

@@ -31,18 +31,18 @@ function getStyles(name, personName, theme) {
 export default function MultipleSelect(props) {
 
   const theme = useTheme();
-  const [projectName, setProjectName] = React.useState([]);
+ 
 
   const handleChange = (event) => {
     const {
       target: { value },
     } = event;
-    setProjectName(
+    props.setProjectName(
       // On autofill we get a stringified value.
       typeof value === 'string' ? value.split(',') : value,
     );
   };
-console.log(projectName)
+
   return (
     <div>
       <FormControl sx={{ m: 1, width: 250,borderColor:'white' }}>
@@ -51,17 +51,18 @@ console.log(projectName)
           labelId="demo-multiple-name-label"
           id="demo-multiple-name"
           multiple
-          value={projectName}
+          value={props.projectName}
           onChange={handleChange}
           input={<OutlinedInput label="Name" />}
           MenuProps={MenuProps}
           sx={{color:'white' }}
+          onClose={(e)=>{props.onClose(props.projectName)}}
         >
           {props.projects.map((project) => (
             <MenuItem
               key={project}
               value={project}
-              style={getStyles(project, projectName, theme)}
+              style={getStyles(project, props.projectName, theme)}
             >
               {project}
             </MenuItem>

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

@@ -201,6 +201,30 @@ console.log(tasks)
   const handleClose = () => {
     setModal({ ...modal, open: false, id: null });
   };
+  // ++++++++фильтрация по проектам+++++++++++++++
+
+  const [projectName, setProjectName] = React.useState([]);
+  const [filter, setFilter] = React.useState(false);
+  const onClose=(projectName)=>{
+    console.log(projectName)
+    setFilter(true)
+  }
+  useEffect(() => {
+    if (tasks && tasks?.length > 0) {
+      let currentTasks = [];
+      let i
+      for (i=0; i<projectName?.lenght; i++)
+      {currentTasks = tasks?.map((task) => {
+        if (task.project=projectName)
+        return {
+          ...task,
+            };
+      })};
+      setRecievedTasks(currentTasks);
+    }
+  }, [filter==true]);
+
+ // ++++++++фильтрация по проектам+++++++++++++++
  
   if (
     tasks &&
@@ -216,6 +240,9 @@ console.log(tasks)
               addTask();
             }}
             projects={projects}
+            onClose={onClose}
+           projectName={projectName}
+            setProjectName={setProjectName}
           />
 
           <TableContainer>