From f043ac76ba43702ccce8933504524af3e8a51e36 Mon Sep 17 00:00:00 2001
From: Ruidy Nemausat <ruidy.nemausat@gmail.com>
Date: Fri, 17 Apr 2020 17:23:53 +0200
Subject: [PATCH] [UI] Users Modal done

---
 client/src/components/Modals/Modal.tsx      |  7 +++-
 client/src/components/Modals/UsersModal.tsx | 39 +++++++++++----------
 2 files changed, 26 insertions(+), 20 deletions(-)

diff --git a/client/src/components/Modals/Modal.tsx b/client/src/components/Modals/Modal.tsx
index f52ad5e..705f172 100644
--- a/client/src/components/Modals/Modal.tsx
+++ b/client/src/components/Modals/Modal.tsx
@@ -47,7 +47,12 @@ export const Modal: FC<IProps> = ({
   const classes = useStyles();
 
   return (
-    <Dialog open={show} onClose={handleClose} maxWidth="md" fullWidth>
+    <Dialog
+      open={show}
+      onClose={handleClose}
+      maxWidth="md"
+      // fullWidth
+    >
       <DialogTitle disableTypography className={classes.root}>
         <Typography variant="h6">{name}</Typography>
         {handleClose ? (
diff --git a/client/src/components/Modals/UsersModal.tsx b/client/src/components/Modals/UsersModal.tsx
index e85d438..f697635 100644
--- a/client/src/components/Modals/UsersModal.tsx
+++ b/client/src/components/Modals/UsersModal.tsx
@@ -90,25 +90,26 @@ export const UsersModal: FC<IProps> = ({
           handleChange={handleChange}
         />
       </Grid>
-
-      <List dense className={classes.root}>
-        {allUsers.map((u: User) => (
-          <ListItem key={u.id}>
-            <ListItemAvatar>
-              <Avatar alt={u.fullName} src={u.picture} />
-            </ListItemAvatar>
-            <ListItemText id={u.id} primary={u.fullName} />
-            <ListItemSecondaryAction>
-              <Checkbox
-                edge="end"
-                onChange={handleToggle(u.id)}
-                checked={members.indexOf(u.id) !== -1}
-                inputProps={{ "aria-labelledby": `checkbox-${u.id}` }}
-              />
-            </ListItemSecondaryAction>
-          </ListItem>
-        ))}
-      </List>
+      <Grid container justify="center">
+        <List dense className={classes.root}>
+          {allUsers.map((u: User) => (
+            <ListItem key={u.id}>
+              <ListItemAvatar>
+                <Avatar alt={u.fullName} src={u.picture} />
+              </ListItemAvatar>
+              <ListItemText id={u.id} primary={u.fullName} />
+              <ListItemSecondaryAction>
+                <Checkbox
+                  edge="end"
+                  onChange={handleToggle(u.id)}
+                  checked={members.indexOf(u.id) !== -1}
+                  inputProps={{ "aria-labelledby": `checkbox-${u.id}` }}
+                />
+              </ListItemSecondaryAction>
+            </ListItem>
+          ))}
+        </List>
+      </Grid>
     </Modal>
   );
 };