all repos — caroster @ 04c7bfa0d0cbbebe4572517542dd602a4ea93f5b

[Octree] Group carpool to your event https://caroster.io

:sparkles: Move edit button for event details #33
Tim Izzo sika.tim@gmail.com
Tue, 07 Jul 2020 18:09:39 +0200
commit

04c7bfa0d0cbbebe4572517542dd602a4ea93f5b

parent

a12a1234e72d0b6290ebd4ca7b04a341e57b8823

1 files changed, 34 insertions(+), 20 deletions(-)

jump to
M app/src/pages/Event.js → app/src/pages/Event.js 
@@ -71,14 +71,33 @@ className={classes.appbar}
         id={(isEditing && 'EditEvent') || (detailsOpen && 'Details') || 'Menu'}
       >
         <Toolbar>
-          <Typography
-            variant="h6"
-            noWrap
-            className={classes.name}
-            id="MenuHeaderTitle"
-          >
-            {event.name}
-          </Typography>
+          {
+            <div className={classes.name}>
+              <Typography variant="h6" noWrap id="MenuHeaderTitle">
+                {event.name}
+              </Typography>
+              {detailsOpen && !isEditing && (
+                <IconButton
+                  color="inherit"
+                  edge="end"
+                  id="CloseDetailsBtn"
+                  onClick={() => setIsEditing(true)}
+                >
+                  <Icon className={classes.barIcon}>edit</Icon>
+                </IconButton>
+              )}
+              {detailsOpen && isEditing && (
+                <IconButton
+                  color="inherit"
+                  edge="end"
+                  id="EditEventSubmit"
+                  onClick={onEventSave}
+                >
+                  <Icon className={classes.barIcon}>done</Icon>
+                </IconButton>
+              )}
+            </div>
+          }
           {!detailsOpen && (
             <>
               <IconButton

@@ -100,24 +119,17 @@ <Icon>more_vert</Icon>
               </IconButton>
             </>
           )}
-          {detailsOpen && !isEditing && (
+          {detailsOpen && (
             <IconButton
               color="inherit"
               edge="end"
               id="CloseDetailsBtn"
-              onClick={toggleDetails}
+              onClick={() => {
+                setIsEditing(false);
+                toggleDetails();
+              }}
             >
               <Icon className={classes.barIcon}>close</Icon>
-            </IconButton>
-          )}
-          {detailsOpen && isEditing && (
-            <IconButton
-              color="inherit"
-              edge="end"
-              id="EditEventSubmit"
-              onClick={onEventSave}
-            >
-              <Icon className={classes.barIcon}>done</Icon>
             </IconButton>
           )}
           <EventMenu

@@ -169,6 +181,8 @@ top: 0,
   }),
   name: {
     flexGrow: 1,
+    display: 'flex',
+    alignItems: 'center',
   },
   shareIcon: {
     marginRight: theme.spacing(2),