From 6fec33685e23934cdde7cd6a69939b92d740e588 Mon Sep 17 00:00:00 2001
From: Davor <davor.ivankovic2@gmail.com>
Date: Wed, 18 May 2022 16:16:13 +0200
Subject: [PATCH] remove 'users' from navigation for role User
---
src/components/Header/Header.tsx | 20 +++++++++++++++++---
1 file changed, 17 insertions(+), 3 deletions(-)
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index 141da566..3ebb289d 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -5,17 +5,29 @@ 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' },
- { name: 'Users', to: '/users' },
+ { name: 'Dashboard', to: '/dashboard', roles: ['admin', 'user'] },
+ { name: 'Users', to: '/users', roles: ['admin'] },
];
function classNames(...classes: any[]) {
return classes.filter(Boolean).join(' ');
}
+function availableNavigation(currentUser: User | null) {
+ if (currentUser === null) {
+ return [];
+ }
+ 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)),
+ );
+}
+
// eslint-disable-next-line @typescript-eslint/no-empty-interface
interface HeaderProps {}
@@ -30,6 +42,8 @@ const Header: React.FC<HeaderProps> = () => {
};
const currentUserModalClose = () => setCurrentUserModal(false);
+ const navigationItems = availableNavigation(currentUser);
+
return (
<>
<Disclosure as="nav" className="bg-white shadow relative z-10">
@@ -55,7 +69,7 @@ const Header: React.FC<HeaderProps> = () => {
</Link>
<div className="hidden sm:ml-6 sm:flex sm:space-x-8">
{/* Current: "border-primary-500 text-gray-900", Default: "border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700" */}
- {navigation.map((item) => (
+ {navigationItems.map((item) => (
<Link
key={item.name}
to={item.to}
--
GitLab