From 308bdf3013f4efcfa98ea302118769d8f082ce02 Mon Sep 17 00:00:00 2001
From: Sergey Yarkov <serzh.yarkov@gmail.com>
Date: Fri, 12 Jun 2020 14:43:17 +0300
Subject: [PATCH] modal upd

---
 .../Modals/Category/CreateCategoryModal.js    |  0
 .../Modals/Category/UpdateCategoryModal.js    |  0
 .../Todo/CreateTodoModal.js}                  |  2 +-
 .../components/Modals/Todo/UpdateTodoModal.js |  0
 .../components/Nav/NavContent/NavContent.js   | 16 ++---
 client/src/components/Todos/Todos.js          | 66 ++++++++++---------
 .../TodosContainer/TodosContainer.js          |  4 +-
 7 files changed, 47 insertions(+), 41 deletions(-)
 create mode 100644 client/src/components/Modals/Category/CreateCategoryModal.js
 create mode 100644 client/src/components/Modals/Category/UpdateCategoryModal.js
 rename client/src/components/{Todos/TodoModal/TodosModal.js => Modals/Todo/CreateTodoModal.js} (98%)
 create mode 100644 client/src/components/Modals/Todo/UpdateTodoModal.js

diff --git a/client/src/components/Modals/Category/CreateCategoryModal.js b/client/src/components/Modals/Category/CreateCategoryModal.js
new file mode 100644
index 0000000..e69de29
diff --git a/client/src/components/Modals/Category/UpdateCategoryModal.js b/client/src/components/Modals/Category/UpdateCategoryModal.js
new file mode 100644
index 0000000..e69de29
diff --git a/client/src/components/Todos/TodoModal/TodosModal.js b/client/src/components/Modals/Todo/CreateTodoModal.js
similarity index 98%
rename from client/src/components/Todos/TodoModal/TodosModal.js
rename to client/src/components/Modals/Todo/CreateTodoModal.js
index fd86919..8acb29d 100644
--- a/client/src/components/Todos/TodoModal/TodosModal.js
+++ b/client/src/components/Modals/Todo/CreateTodoModal.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import Fab from '../../../components/Fab/Fab'
+import Fab from '../../Fab/Fab'
 import { Dialog, DialogContent, DialogTitle, DialogActions, Button, TextField, Select, MenuItem, InputLabel, FormControl, makeStyles } from '@material-ui/core'
 
 const useStyles = makeStyles(() => ({
diff --git a/client/src/components/Modals/Todo/UpdateTodoModal.js b/client/src/components/Modals/Todo/UpdateTodoModal.js
new file mode 100644
index 0000000..e69de29
diff --git a/client/src/components/Nav/NavContent/NavContent.js b/client/src/components/Nav/NavContent/NavContent.js
index 608953d..ee23089 100644
--- a/client/src/components/Nav/NavContent/NavContent.js
+++ b/client/src/components/Nav/NavContent/NavContent.js
@@ -26,7 +26,7 @@ const useStyles = makeStyles((theme) => ({
   author: {
     display: 'flex',
     alignItems: 'center',
-    marginTop: 5
+    marginTop: 10
   },
   nested: {
     paddingLeft: theme.spacing(4)
@@ -43,15 +43,15 @@ const useStyles = makeStyles((theme) => ({
 
 const NavContent = ({ history }) => {
   const classes = useStyles()
-  const [isListOpen, setIsListOpen] = React.useState({
+  const [collapseInfo, setCollapseInfo] = React.useState({
     idCollapse: 0,
-    current: false,
+    isCollapseOpen: false,
   })
 
   const listItemSelectedHandler = (e, index) => {
-    if (index === 1) setIsListOpen({
-      idCollapse: 1,
-      current: !isListOpen.current
+    setCollapseInfo({
+      idCollapse: index,
+      isCollapseOpen: !collapseInfo.isCollapseOpen
     })
   }
 
@@ -83,9 +83,9 @@ const NavContent = ({ history }) => {
           <CategoryIcon />
         </ListItemIcon>
         <ListItemText primary={'Категории'} />
-        {isListOpen.current ? <ExpandLess /> : <ExpandMore />}
+        {collapseInfo.isCollapseOpen ? <ExpandLess /> : <ExpandMore />}
       </ListItem>
-      <Collapse in={isListOpen.current} timeout="auto" unmountOnExit>
+      <Collapse in={collapseInfo.isCollapseOpen} timeout="auto" unmountOnExit>
         <List component="div" disablePadding>
           <Categories data={[1,2,3]} history={history} classes={classes} />
           <ListItem className={classes.addCategoryItem}>
diff --git a/client/src/components/Todos/Todos.js b/client/src/components/Todos/Todos.js
index b7d2bb0..4e47ef2 100644
--- a/client/src/components/Todos/Todos.js
+++ b/client/src/components/Todos/Todos.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import UpdateTodoModal from '../Modals/Todo/UpdateTodoModal'
 import { Card, CardActions, CardContent, Typography, Grid, IconButton, makeStyles } from '@material-ui/core'
 
 import DeleteIcon from '@material-ui/icons/Delete'
@@ -32,37 +33,42 @@ const useStyles = makeStyles((theme) => ({
   },
 }))
 
-const Cards = ({ data }) => {
+const Todos = ({ data }) => {
   const classes = useStyles()
-  return data.map((e, i) => 
-    <Grid key={i} item xs={12} md={4} lg={3}>
-      <Card>
-        <CardContent>
-          <Typography className={classes.cardCategoryHeading} color="textSecondary" gutterBottom>
-            Категория 1
-            <span className={classes.cardAlarm}>
-              <AlarmIcon className={classes.alarmIcon} color='action' />
-              18:00
-            </span>
-          </Typography>
-          <Typography className={classes.cardHeading} variant="h5" component="h2">
-            Todo 1
-          </Typography>
-          <Typography variant="body2" component="p">
-            But I must explain to you how all this mistaken idea of denouncing pleasure and praising.
-          </Typography>
-        </CardContent>
-        <CardActions className={classes.cardActions}>
-          <IconButton aria-label="delete">
-            <EditIcon />
-          </IconButton>
-          <IconButton aria-label="delete" color='secondary'>
-            <DeleteIcon />
-          </IconButton>
-        </CardActions>
-      </Card>
-    </Grid>
+  return (
+    <>
+      {/* <UpdateTodoModal /> */}
+      {data.map((e, i) => 
+        <Grid key={i} item xs={12} md={4} lg={3}>
+          <Card>
+            <CardContent>
+              <Typography className={classes.cardCategoryHeading} color="textSecondary" gutterBottom>
+                Категория 1
+                <span className={classes.cardAlarm}>
+                  <AlarmIcon className={classes.alarmIcon} color='action' />
+                  18:00
+                </span>
+              </Typography>
+              <Typography className={classes.cardHeading} variant="h5" component="h2">
+                Todo 1
+              </Typography>
+              <Typography variant="body2" component="p">
+                But I must explain to you how all this mistaken idea of denouncing pleasure and praising.
+              </Typography>
+            </CardContent>
+            <CardActions className={classes.cardActions}>
+              <IconButton aria-label="update">
+                <EditIcon />
+              </IconButton>
+              <IconButton aria-label="delete" color='secondary'>
+                <DeleteIcon />
+              </IconButton>
+            </CardActions>
+          </Card>
+        </Grid>
+      )}
+    </>
   )
 }
 
-export default Cards
\ No newline at end of file
+export default Todos
\ No newline at end of file
diff --git a/client/src/containers/TodosContainer/TodosContainer.js b/client/src/containers/TodosContainer/TodosContainer.js
index 30a25a4..266b02b 100644
--- a/client/src/containers/TodosContainer/TodosContainer.js
+++ b/client/src/containers/TodosContainer/TodosContainer.js
@@ -1,12 +1,12 @@
 import React from 'react';
 import Todos from '../../components/Todos/Todos'
-import TodosModal from '../../components/Todos/TodoModal/TodosModal'
+import CreateTodoModal from '../../components/Modals/Todo/CreateTodoModal'
 import { Typography, Grid } from '@material-ui/core'
 
 const TodosContainer = () => {
   return (
     <>
-      <TodosModal />
+      <CreateTodoModal />
       <Grid container spacing={2}>
           <Grid item xs={12}>
             <Typography>