#141 Изменил вывод информации о проекте

planner-front/src/components/ProjectComponents/ProjectInfo/ProjectInfo.js

+import { Box, Typography } from "@mui/material";
+import moment from "moment";
+import { memo } from "react";
+import PersonAddIcon from '@mui/icons-material/PersonAdd';
+
+const style = {
+  display: 'flex',
+  flexDirection: 'column',
+}
+const styleText = {
+  fontSize: '20px',
+  fontWeight: '600',
+  display: 'flex',
+  alignItems: 'center',
+  gap: '10px'
+}
+
+
+const ProjectInfo = ({ project }) => {
+  return (
+    <Box sx={style} justifyContent={'space-between'}>
+      <Typography variant="h2">Проект - {project?.title} </Typography>
+      <Typography variant="body1" sx={styleText}>
+        Дата создания проекта: {moment(project?.createdAt).format('MM.DD.YYYY')}
+      </Typography>
+      <Typography variant="body1" sx={styleText}>
+        Цвет: {project?.color}
+      </Typography>
+      <Typography variant="body1" sx={styleText}>
+        Автор проекта: {project?.members[0]?.user.displayName}
+      </Typography>
+      <Typography variant="body1" sx={styleText}>
+        Роль в проекте: {project?.members[0]?.roleProject}
+      </Typography>
+      <Typography variant="body1" sx={styleText}>
+        Задачи:
+      </Typography>
+      <Typography variant="body1" sx={styleText}>
+        Добавить участника:  <PersonAddIcon style={{ cursor: 'pointer' }} />
+      </Typography>
+    </Box>
+  );
+};
+
+export default memo(ProjectInfo);
\ No newline at end of file

planner-front/src/components/ProjectComponents/ProjectUsersColumnsWrapper/ProjectUsersColumn/ProjectUsersColumn.js

@@ -16,7 +16,7 @@ const styleColumn = {
 const ProjectUsersColumn = ({ role, members }) => {
   return (
     <Box sx={styleColumn}>
-      <ColumnTitle text={role.text}/>
+      <ColumnTitle text={role.text} />
 
       <UsersList
         role={role}

planner-front/src/components/ProjectComponents/ProjectUsersColumnsWrapper/ProjectUsersColumn/UsersList/UserList.js

-import { Box} from "@mui/material";
+import { Box } from "@mui/material";
 import { memo } from "react";
 import UserItem from "./UserItem/UserItem";
 

planner-front/src/components/ProjectComponents/ProjectUsersColumnsWrapper/ProjectUsersColumnsWrapper.js

-import {Box} from "@mui/material";
+import { Box } from "@mui/material";
 import { memo } from "react";
 import ProjectUsersColumn from "./ProjectUsersColumn/ProjectUsersColumn";
 
 
-const projectRoles = [{value: 'admin', text: 'Админы'}, {value: 'user', text: 'Юзеры'}, {value: 'watcher', text: 'Наблюдатели'}]
+const projectRoles = [{ value: 'admin', text: 'Админы' }, { value: 'user', text: 'Юзеры' }, { value: 'watcher', text: 'Наблюдатели' }]
 const style = {
   display: 'flex',
   gap: '150px',
@@ -13,11 +13,11 @@ const style = {
 }
 
 
-const ProjectUsersColumnsWrapper = ({members}) => {
+const ProjectUsersColumnsWrapper = ({ members }) => {
   return (
     <Box sx={style} justifyContent={'space-between'}>
-            {projectRoles.map((role, i)=>{
-              return(
+      {projectRoles.map((role, i) => {
+        return (
           <ProjectUsersColumn
             key={i}
             role={role}

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

@@ -6,6 +6,7 @@ import { fetchProject } from "../../store/actions/projectsActions";
 import { fetchUsers, fetchUsersAllFields } from "../../store/actions/usersActions";
 import NewMember from "../NewMember/NewMember";
 import ProjectUsersColumnsWrapper from "../../components/ProjectComponents/ProjectUsersColumnsWrapper/ProjectUsersColumnsWrapper";
+import ProjectInfo from "../../components/ProjectComponents/ProjectInfo/ProjectInfo";
 
 
 const FullProject = () => {
@@ -27,43 +28,13 @@ const FullProject = () => {
     }, [project])
 
     return <>
-        <Grid item xs={12} sm={12} md={6} lg={4}>
-            <Box>
-                <h2>Проект - {project?.project?.title} </h2>
-
-                <strong>
-                    <br></br>
-                    Дата создания проекта: {project?.project?.createdAt}
-                </strong>
-                <strong>
-                    <br></br>
-                    Цвет: {project?.project?.color}
-                </strong>
-                <strong>
-                    <br></br>
-                    Автор проекта: {project?.project?.members[0]?.user.displayName}
-                </strong>
-                <strong>
-                    <br></br>
-                    Роль в проекте: {project?.project?.members[0]?.roleProject}
-                </strong>
-                <strong>
-                    <br></br>
-                    Задачи:
-                    <br></br>
-                </strong>
-                <strong>
-                    <br></br>
-                    <div style={{ display: 'flex', direction: 'column' }}>
-                        Участники проекта:  <NewMember members={project?.project?.members} />
-                    </div>
-
+        <Grid>
+            <ProjectInfo
+                project={project.project}
+            />
             <ProjectUsersColumnsWrapper
                 members={members}
             />
-                </strong>
-
-            </Box>
         </Grid>
 
     </>