#29-add-admin-role #2
3 changed files with 23 additions and 31 deletions
|
@ -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 { Disclosure, Menu, Transition } from '@headlessui/react';
|
||||||
import { MenuIcon, XIcon } from '@heroicons/react/outline';
|
import { MenuIcon, XIcon } from '@heroicons/react/outline';
|
||||||
import { useAuth } from 'src/services/auth';
|
import { useAuth } from 'src/services/auth';
|
||||||
|
@ -6,15 +6,8 @@ import Gravatar from 'react-gravatar';
|
||||||
import { Link, useLocation } from 'react-router-dom';
|
import { Link, useLocation } from 'react-router-dom';
|
||||||
import clsx from 'clsx';
|
import clsx from 'clsx';
|
||||||
import { useApps } from 'src/services/apps';
|
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 = [
|
const navigation = [
|
||||||
{ name: 'Dashboard', to: '/dashboard', requiresAdmin: false },
|
|
||||||
{ name: 'Users', to: '/users', requiresAdmin: true },
|
{ name: 'Users', to: '/users', requiresAdmin: true },
|
||||||
{ name: 'Apps', to: '/apps', requiresAdmin: true },
|
{ name: 'Apps', to: '/apps', requiresAdmin: true },
|
||||||
];
|
];
|
||||||
|
@ -35,29 +28,17 @@ function filterNavigationByDashboardRole(isAdmin: boolean) {
|
||||||
interface HeaderProps {}
|
interface HeaderProps {}
|
||||||
|
|
||||||
const HeaderLIT: React.FC<HeaderProps> = () => {
|
const HeaderLIT: React.FC<HeaderProps> = () => {
|
||||||
const [currentUserModal, setCurrentUserModal] = useState(false);
|
|
||||||
const [currentUserId, setCurrentUserId] = useState(null);
|
|
||||||
const { logOut, currentUser, isAdmin } = useAuth();
|
const { logOut, currentUser, isAdmin } = useAuth();
|
||||||
|
|
||||||
const { pathname } = useLocation();
|
const { pathname } = useLocation();
|
||||||
const { apps, loadApps, appTableLoading } = useApps();
|
const { apps } = useApps();
|
||||||
|
|
||||||
const currentUserModalOpen = (id: any) => {
|
|
||||||
setCurrentUserId(id);
|
|
||||||
setCurrentUserModal(true);
|
|
||||||
};
|
|
||||||
|
|
||||||
const currentUserModalClose = () => {
|
|
||||||
setCurrentUserModal(false);
|
|
||||||
setCurrentUserId(null);
|
|
||||||
};
|
|
||||||
|
|
||||||
const navigationItems = filterNavigationByDashboardRole(isAdmin);
|
const navigationItems = filterNavigationByDashboardRole(isAdmin);
|
||||||
|
console.log(isAdmin);
|
||||||
|
console.log(navigationItems);
|
||||||
|
|
||||||
const signOutUrl = useMemo(() => {
|
const signOutUrl = useMemo(() => {
|
||||||
const { hostname } = window.location;
|
// @ts-ignore
|
||||||
// If we are developing locally, we need to use the init cluster's public URL
|
return window.env.REACT_APP_SSO_LOGOUT_URL;
|
||||||
return HYDRA_LOGOUT_URL;
|
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
@ -100,6 +81,21 @@ const HeaderLIT: React.FC<HeaderProps> = () => {
|
||||||
{app.name}
|
{app.name}
|
||||||
</Link>
|
</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>
|
</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">
|
<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>
|
</div>
|
||||||
)}
|
)}
|
||||||
</Disclosure>
|
</Disclosure>
|
||||||
|
|
||||||
{currentUserModal && (
|
|
||||||
<UserModal open={currentUserModal} onClose={currentUserModalClose} userId={currentUserId} setUserId={_.noop} />
|
|
||||||
)}
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
import axios from 'axios';
|
import { createApiAction } from 'src/services/api';
|
||||||
import { createApiAction, createApiCall, performApiCall } from 'src/services/api';
|
|
||||||
import { SuccessAction } from 'src/services/api/redux/types';
|
import { SuccessAction } from 'src/services/api/redux/types';
|
||||||
|
|
||||||
export enum AuthActionTypes {
|
export enum AuthActionTypes {
|
||||||
|
|
|
@ -12,6 +12,7 @@ export const getCurrentUser = (state: State) => state.auth.userInfo;
|
||||||
export const getIsAdmin = (state: State) => {
|
export const getIsAdmin = (state: State) => {
|
||||||
// check since old users wont have this
|
// check since old users wont have this
|
||||||
if (state.auth.userInfo) {
|
if (state.auth.userInfo) {
|
||||||
|
console.log(state.auth.userInfo);
|
||||||
if (!state.auth.userInfo.app_roles) {
|
if (!state.auth.userInfo.app_roles) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue