refactor admin tabs

src/components/Header/Header.tsx

@@ -5,27 +5,23 @@ import { useAuth } from 'src/services/auth';
 import Gravatar from 'react-gravatar';
 import { Link, useLocation } from 'react-router-dom';
 import clsx from 'clsx';
-import { User, UserRole } from 'src/services/users';
 import { CurrentUserModal } from './components/CurrentUserModal';
 
 const navigation = [
-  { name: 'Dashboard', to: '/dashboard', roles: ['admin', 'user'] },
-  { name: 'Users', to: '/users', roles: ['admin'] },
+  { name: 'Dashboard', to: '/dashboard', requiresAdmin: false },
+  { name: 'Users', to: '/users', requiresAdmin: true },
 ];
 
 function classNames(...classes: any[]) {
   return classes.filter(Boolean).join(' ');
 }
 
-function availableNavigation(currentUser: User | null) {
-  if (currentUser === null) {
-    return [];
+function filterNavigationByDashboardRole(isAdmin: boolean) {
+  if (isAdmin) {
+    return navigation;
   }
-  const userDashboardRole = currentUser.app_roles.find((appRole) => appRole.name?.toLowerCase() === 'dashboard')!.role;
 
-  return navigation.filter((item) =>
-    item.roles.includes(String(userDashboardRole != null ? userDashboardRole : UserRole.User)),
-  );
+  return navigation.filter((item) => !item.requiresAdmin);
 }
 
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
@@ -33,7 +29,7 @@ interface HeaderProps {}
 
 const Header: React.FC<HeaderProps> = () => {
   const [currentUserModal, setCurrentUserModal] = useState(false);
-  const { logOut, currentUser } = useAuth();
+  const { logOut, currentUser, isAdmin } = useAuth();
 
   const { pathname } = useLocation();
 
@@ -42,7 +38,7 @@ const Header: React.FC<HeaderProps> = () => {
   };
   const currentUserModalClose = () => setCurrentUserModal(false);
 
-  const navigationItems = availableNavigation(currentUser);
+  const navigationItems = filterNavigationByDashboardRole(isAdmin);
 
   return (
     <>