Merge pull request #68 from topcoder-platform/remove-selfService-navbar

remove selfService navbar

Author: ThomasKranitsas

src/App.jsx

@@ -5,7 +5,6 @@ import React, { useState, useCallback, useMemo, useEffect } from "react";
 import _ from "lodash";
 import MainMenu from "./components/MainMenu";
 import NavBar from "./components/NavBar";
-import SelfServiceNavbar from "./components/SelfService/NavBar";
 import { navigate, Router, useLocation } from "@reach/router";
 import { useSelector } from "react-redux";
 import useMatchSomeRoute from "./hooks/useMatchSomeRoute";
@@ -56,10 +55,10 @@ const App = () => {
   return (
     <>
       <Router>
-        <SelfServiceNavbar path="/self-service/*" />
         <NavBar
           default
           noThrow
+          profileUrl={location.pathname.includes('/self-service') ? '/self-service/profile/' : `/profile/${auth.profile.handle}`}
           hideSwitchTools={isNavigationDisabled}
           path="/*"
         />

src/components/NavBar/index.jsx

@@ -22,7 +22,7 @@ import "./styles.css";
 import { useMediaQuery } from "react-responsive";
 import NotificationsMenu from "../NotificationsMenu";
 
-const NavBar = ({ hideSwitchTools }) => {
+const NavBar = ({ hideSwitchTools, profileUrl }) => {
   // all menu options
   const menu = useSelector((state) => state.menu.categories);
   // flat list of all apps
@@ -96,6 +96,7 @@ const NavBar = ({ hideSwitchTools }) => {
                   <Fragment>
                     <NotificationsMenu />
                     <UserMenu
+                      profileUrl={profileUrl}
                       profile={auth.profile}
                       hideSwitchTools={hideSwitchTools}
                     />
@@ -121,6 +122,7 @@ const NavBar = ({ hideSwitchTools }) => {
                   <Fragment>
                     <NotificationsMenu />
                     <UserMenu
+                      profileUrl={profileUrl}
                       profile={auth.profile}
                       hideSwitchTools={hideSwitchTools}
                     />
@@ -140,9 +142,11 @@ const NavBar = ({ hideSwitchTools }) => {
 
 NavBar.defaultProps = {
   hideSwitchTools: false,
+  profileUrl: '/profile/',
 };
 
 NavBar.propTypes = {
+  profileUrl: PropTypes.string,
   hideSwitchTools: PropTypes.boolean,
 };
 

src/components/SelfService/NavBar/index.jsx

@@ -13,7 +13,7 @@ import { logout, getLogoutUrl } from "../../utils";
 import "./styles.css";
 import { useMediaQuery } from "react-responsive";
 
-const UserMenu = ({ profile, hideSwitchTools }) => {
+const UserMenu = ({ profile, profileUrl }) => {
   const [isOpenMenu, setIsOpenMenu] = useState(false);
 
   const closeMenu = useCallback(() => {
@@ -64,16 +64,14 @@ const UserMenu = ({ profile, hideSwitchTools }) => {
               <div className="user-menu-popover-arrow" />
               <div className="user-menu-popover-content">
                 <ul className="user-menu-list">
-                  {hideSwitchTools ? null : (
-                    <li>
-                      <Link
-                        to={`/profile/${profile.handle}`}
-                        onClick={closeMenu}
-                      >
-                        Profile
-                      </Link>
-                    </li>
-                  )}
+                  <li>
+                    <Link
+                      to={`${profileUrl}`}
+                      onClick={closeMenu}
+                    >
+                      Profile
+                    </Link>
+                  </li>
                   <li>
                     <a href={getLogoutUrl()} onClick={onLogoutClick}>
                       Log Out
@@ -90,11 +88,11 @@ const UserMenu = ({ profile, hideSwitchTools }) => {
 };
 
 UserMenu.defaultProps = {
-  hideSwitchTools: false,
+  profileUrl: '/profile',
 };
 
 UserMenu.propTypes = {
-  hideSwitchTools: PropTypes.boolean,
+  profileUrl: PropTypes.string,
 };
 
 export default UserMenu;