Change menu button when user signed up

packages/concordia-app/public/locales/en/translation.json

@@ -9,5 +9,6 @@
   "register.form.username.field.label": "Username",
   "register.form.username.field.placeholder": "Username",
   "register.p.account.address": "Account address:",
+  "topbar.button.profile": "Profile",
   "topbar.button.register": "Sign Up"
 }

packages/concordia-app/src/layouts/MainLayout/MainLayoutMenu/index.jsx

@@ -1,12 +1,14 @@
 import React from 'react';
-import { withRouter } from 'react-router';
 import { Menu } from 'semantic-ui-react';
 import { useTranslation } from 'react-i18next';
+import { useHistory } from 'react-router';
+import { connect } from 'react-redux';
 import AppContext from '../../../components/AppContext';
 import appLogo from '../../../assets/images/app_logo.png';
 
 const MainLayoutMenu = (props) => {
-  const { history: { push } } = props;
+  const { user: { hasSignedUp } } = props;
+  const history = useHistory();
   const { t } = useTranslation();
 
   return (
@@ -18,19 +20,33 @@ const MainLayoutMenu = (props) => {
                         link
                         name="home"
                         key="home"
-                        onClick={() => { push('/'); }}
+                        onClick={() => { history.push('/'); }}
                       >
                           <img src={appLogo} alt="app_logo" />
                       </Menu.Item>
-                      <Menu.Item
-                        link
-                        name="register"
-                        key="register"
-                        onClick={() => { push('/auth/register'); }}
-                        position="right"
-                      >
-                          {t('topbar.button.register')}
-                      </Menu.Item>
+                      {hasSignedUp
+                        ? (
+                            <Menu.Item
+                              link
+                              name="profile"
+                              key="profile"
+                              onClick={() => { history.push('/profile'); }}
+                              position="right"
+                            >
+                                {t('topbar.button.profile')}
+                            </Menu.Item>
+                        )
+                        : (
+                            <Menu.Item
+                              link
+                              name="register"
+                              key="register"
+                              onClick={() => { history.push('/auth/register'); }}
+                              position="right"
+                            >
+                                {t('topbar.button.register')}
+                            </Menu.Item>
+                        )}
                   </Menu>
               </div>
           )}
@@ -38,4 +54,8 @@ const MainLayoutMenu = (props) => {
   );
 };
 
-export default withRouter(MainLayoutMenu);
+const mapStateToProps = (state) => ({
+  user: state.user,
+});
+
+export default connect(mapStateToProps)(MainLayoutMenu);