M app/src/containers/EventMenu/EventMenu.js → app/src/containers/EventMenu/EventMenu.js

@@ -1,8 +1,19 @@ 
 import React from 'react';
 import Menu from '@material-ui/core/Menu';
 import MenuItem from '@material-ui/core/MenuItem';
+import {useTranslation} from 'react-i18next';
+import {useStrapi} from 'strapi-react-context';
+const EventMenu = ({anchorEl, setAnchorEl, actions = []}) => {
+  const {t} = useTranslation();
+  const strapi = useStrapi();
+  const [settings] = strapi.stores?.settings || [{}];
 
-const EventMenu = ({anchorEl, setAnchorEl, actions = []}) => {
+  const aboutMenuItem = {
+    label: t('menu.about'),
+    onClick: () => (window.location.href = settings['about_link']),
+    id: 'AboutTabs',
+  };
+
   return (
     <Menu
       anchorEl={anchorEl}
@@ -19,7 +30,7 @@ open={!!anchorEl}
       onClose={() => setAnchorEl(null)}
     >
       {actions &&
-        actions.map((action, idx) => (
+        [...actions, aboutMenuItem].filter(Boolean).map((action, idx) => (
           <MenuItem
             onClick={() => {
               action.onClick();

M app/src/layouts/Default.js → app/src/layouts/Default.js

@@ -6,10 +6,11 @@ children,
   className,
   menuTitle = 'Caroster',
   menuActions,
+  pageTitle = undefined,
 }) => {
   return (
     <>
-      <Helmet title={menuTitle} />
+      <Helmet title={pageTitle || menuTitle} />
       {(menuTitle || menuActions) && (
         <GenericMenu title={menuTitle} actions={menuActions} />
       )}

M app/src/pages/Event.js → app/src/pages/Event.js

@@ -1,5 +1,4 @@ 
 import React, {useState, useReducer, useEffect} from 'react';
-import {Helmet} from 'react-helmet';
 import {useTranslation} from 'react-i18next';
 import {useAuth} from 'strapi-react-context';
 import AppBar from '@material-ui/core/AppBar';
@@ -32,9 +31,6 @@ const classes = useStyles({detailsOpen});
   const [openNewCar, toggleNewCar] = useReducer(i => !i, false);
   const {event, isEditing, setIsEditing, updateEvent} = useEvent();
   const {token} = useAuth();
-  useEffect(() => {
-    window.scrollTo(0, 0);
-  }, []);
 
   useEffect(() => {
     if (!detailsOpen) setIsEditing(false);
@@ -67,31 +63,26 @@ }
   };
 
   const addToMyEvents = () => {
-    if (!event) return;
-    window.localStorage.setItem('addToMyEvents', event.id);
     setIsAddToMyEvent(true);
   };
 
-  const signUp = () => {
-    if (!event) return;
+  const signUp = () =>
     history.push({
       pathname: '/register',
-      state: {event: event.id},
+      state: {event: event?.id},
     });
-  };
 
   const signIn = history.push.bind(undefined, '/login');
   const goToDashboard = history.push.bind(undefined, '/dashboard');
   const goProfile = history.push.bind(undefined, '/profile');
-  const goAbout = () => (window.location.href = t('meta.about_href'));
 
   if (!event) return <Loading />;
 
   return (
-    <Layout>
-      <Helmet>
-        <title>{t('meta.title', {title: event.name})}</title>
-      </Helmet>
+    <Layout
+      pageTitle={t('event.title')}
+      menuTitle={t('meta.title', {title: event.name})}
+    >
       <AppBar
         position="static"
         color="primary"
@@ -103,28 +94,30 @@ <div className={classes.name}>
             <Typography variant="h6" noWrap id="MenuHeaderTitle">
               {event.name}
             </Typography>
-            {detailsOpen && !isEditing && (
+            {detailsOpen && (
               <IconButton
                 color="inherit"
                 edge="end"
-                id="CloseDetailsBtn"
-                onClick={() => setIsEditing(true)}
+                id="HeaderAction"
+                onClick={isEditing ? onEventSave : () => setIsEditing(true)}
               >
-                <Icon>edit</Icon>
-              </IconButton>
-            )}
-            {detailsOpen && isEditing && (
-              <IconButton
-                color="inherit"
-                edge="end"
-                id="EditEventSubmit"
-                onClick={onEventSave}
-              >
-                <Icon>done</Icon>
+                <Icon>{isEditing ? 'edit' : 'done'}</Icon>
               </IconButton>
             )}
           </div>
-          {!detailsOpen && (
+          {detailsOpen ? (
+            <IconButton
+              color="inherit"
+              edge="end"
+              id="CloseDetailsBtn"
+              onClick={() => {
+                setIsEditing(false);
+                toggleDetails();
+              }}
+            >
+              <Icon>close</Icon>
+            </IconButton>
+          ) : (
             <>
               <IconButton
                 color="inherit"
@@ -145,19 +138,6 @@ <Icon>more_vert</Icon>
               </IconButton>
             </>
           )}
-          {detailsOpen && (
-            <IconButton
-              color="inherit"
-              edge="end"
-              id="CloseDetailsBtn"
-              onClick={() => {
-                setIsEditing(false);
-                toggleDetails();
-              }}
-            >
-              <Icon>close</Icon>
-            </IconButton>
-          )}
           <EventMenu
             anchorEl={anchorEl}
             setAnchorEl={setAnchorEl}
@@ -194,12 +174,7 @@ label: t('menu.profile'),
                 onClick: goProfile,
                 id: 'ProfileTab',
               },
-              {
-                label: t('menu.about'),
-                onClick: goAbout,
-                id: 'AboutTab',
-              },
-            ].filter(Boolean)}
+            ]}
           />
         </Toolbar>
         {detailsOpen && (