src/components/Header/HeaderLIT.tsx

@@ -1,4 +1,4 @@
-import React, { Fragment, useMemo, useState } from 'react';
+import React, { Fragment, useMemo } from 'react';
 import { Disclosure, Menu, Transition } from '@headlessui/react';
 import { MenuIcon, XIcon } from '@heroicons/react/outline';
 import { useAuth } from 'src/services/auth';
@@ -6,15 +6,8 @@ import Gravatar from 'react-gravatar';
 import { Link, useLocation } from 'react-router-dom';
 import clsx from 'clsx';
 import { useApps } from 'src/services/apps';
-import _ from 'lodash';
-
-import { UserModal } from '../UserModal';
-
-// @ts-ignore
-const HYDRA_LOGOUT_URL = window.env.REACT_APP_SSO_LOGOUT_URL;
 
 const navigation = [
-  { name: 'Dashboard', to: '/dashboard', requiresAdmin: false },
   { name: 'Users', to: '/users', requiresAdmin: true },
   { name: 'Apps', to: '/apps', requiresAdmin: true },
 ];
@@ -35,29 +28,17 @@ function filterNavigationByDashboardRole(isAdmin: boolean) {
 interface HeaderProps {}
 
 const HeaderLIT: React.FC<HeaderProps> = () => {
-  const [currentUserModal, setCurrentUserModal] = useState(false);
-  const [currentUserId, setCurrentUserId] = useState(null);
   const { logOut, currentUser, isAdmin } = useAuth();
 
   const { pathname } = useLocation();
-  const { apps, loadApps, appTableLoading } = useApps();
-
-  const currentUserModalOpen = (id: any) => {
-    setCurrentUserId(id);
-    setCurrentUserModal(true);
-  };
-
-  const currentUserModalClose = () => {
-    setCurrentUserModal(false);
-    setCurrentUserId(null);
-  };
-
+  const { apps } = useApps();
   const navigationItems = filterNavigationByDashboardRole(isAdmin);
+  console.log(isAdmin);
+  console.log(navigationItems);
 
   const signOutUrl = useMemo(() => {
-    const { hostname } = window.location;
-    // If we are developing locally, we need to use the init cluster's public URL
-    return HYDRA_LOGOUT_URL;
+    // @ts-ignore
+    return window.env.REACT_APP_SSO_LOGOUT_URL;
   }, []);
 
   return (
@@ -100,6 +81,21 @@ const HeaderLIT: React.FC<HeaderProps> = () => {
                         {app.name}
                       </Link>
                     ))}
+                    {navigationItems.map((item) => (
+                      <Link
+                        key={item.name}
+                        to={item.to}
+                        className={clsx(
+                          'border-primary-50 text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium',
+                          {
+                            'border-primary-500 text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 text-sm font-medium':
+                              pathname.includes(item.to),
+                          },
+                        )}
+                      >
+                        {item.name}
+                      </Link>
+                    ))}
                   </div>
                 </div>
                 <div className="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0">
@@ -165,10 +161,6 @@ const HeaderLIT: React.FC<HeaderProps> = () => {
           </div>
         )}
       </Disclosure>
-
-      {currentUserModal && (
-        <UserModal open={currentUserModal} onClose={currentUserModalClose} userId={currentUserId} setUserId={_.noop} />
-      )}
     </>
   );
 };

src/services/auth/redux/actions.ts

@@ -1,5 +1,4 @@
-import axios from 'axios';
-import { createApiAction, createApiCall, performApiCall } from 'src/services/api';
+import { createApiAction } from 'src/services/api';
 import { SuccessAction } from 'src/services/api/redux/types';
 
 export enum AuthActionTypes {

src/services/auth/redux/selectors.ts

@@ -12,6 +12,7 @@ export const getCurrentUser = (state: State) => state.auth.userInfo;
 export const getIsAdmin = (state: State) => {
   // check since old users wont have this
   if (state.auth.userInfo) {
+    console.log(state.auth.userInfo);
     if (!state.auth.userInfo.app_roles) {
       return false;
     }