diff --git a/ui/apps/pmm/src/contexts/navigation/navigation.provider.tsx b/ui/apps/pmm/src/contexts/navigation/navigation.provider.tsx index f2d979fa10..34b1d7cf57 100644 --- a/ui/apps/pmm/src/contexts/navigation/navigation.provider.tsx +++ b/ui/apps/pmm/src/contexts/navigation/navigation.provider.tsx @@ -30,9 +30,11 @@ import { useFolders } from 'hooks/api/useFolders'; import { useUpdates } from 'contexts/updates'; import { useLocalStorage } from 'hooks/utils/useLocalStorage'; import { useHaInfo } from 'hooks/api/useHA'; +import { useAuth } from 'contexts/auth'; export const NavigationProvider: FC = ({ children }) => { const { user } = useUser(); + const { isLoggedIn } = useAuth(); const { data: serviceTypes } = useServiceTypes({ enabled: !!user, refetchInterval: INTERVALS_MS.SERVICE_TYPES, @@ -69,18 +71,22 @@ export const NavigationProvider: FC = ({ children }) => { items.push(NAV_QAN); - if (user && settings) { - if (settings.frontend.exploreEnabled && user.isEditor) { + if (user) { + if (settings?.frontend.exploreEnabled && user.isEditor) { items.push( addExplore('grafana-metricsdrilldown-app' in settings.frontend.apps) ); } - if (settings.frontend.unifiedAlertingEnabled) { - items.push(addAlerting(settings?.alertingEnabled, user)); - } + items.push( + addAlerting( + settings?.alertingEnabled, + settings?.frontend.unifiedAlertingEnabled, + user + ) + ); - if (user.isEditor && settings.advisorEnabled) { + if (user.isEditor && settings?.advisorEnabled) { items.push(addAdvisors(advisors || [])); } @@ -89,7 +95,7 @@ export const NavigationProvider: FC = ({ children }) => { items.push(NAV_INVENTORY); - if (settings.backupManagementEnabled) { + if (settings?.backupManagementEnabled) { items.push(NAV_BACKUPS); } @@ -97,28 +103,35 @@ export const NavigationProvider: FC = ({ children }) => { items.push(addConfiguration(status, versionInfo)); - items.push(addUsersAndAccess(settings)); + if (settings) { + items.push(addUsersAndAccess(settings)); + } } - items.push(addAccount(user, colorMode, toggleColorMode)); + if (isLoggedIn) { + items.push(addAccount(user, colorMode, toggleColorMode)); + } items.push(NAV_HELP); - } else { + } + + if (!isLoggedIn) { items.push(NAV_SIGN_IN); } return items; }, [ - status, - versionInfo, - serviceTypes, - folders, + serviceTypes?.serviceTypes, user, + haInfo, + folders, settings, - advisors, colorMode, - haInfo, toggleColorMode, + advisors, + status, + versionInfo, + isLoggedIn, ]); return ( diff --git a/ui/apps/pmm/src/contexts/navigation/navigation.utils.tsx b/ui/apps/pmm/src/contexts/navigation/navigation.utils.tsx index 8f715e7a7c..16fe20678a 100644 --- a/ui/apps/pmm/src/contexts/navigation/navigation.utils.tsx +++ b/ui/apps/pmm/src/contexts/navigation/navigation.utils.tsx @@ -133,25 +133,31 @@ export const addDashboardItems = ( return children; }; -export const addAlerting = (enabled = false, user?: User): NavItem => { +export const addAlerting = ( + alertingEnabled = false, + unifiedAlertingEnabled = false, + user?: User +): NavItem => { const children: NavItem[] = []; - if (enabled) { - children.push(NAV_ALERTS_FIRED); - } - children.push(NAV_ALERTS_RULES); children.push(NAV_ALERTS_CONTACT_POINTS); children.push(NAV_ALERTS_NOTIFICATION_POLICIES); children.push(NAV_ALERTS_SILENCES); children.push(NAV_ALERTS_GROUPS); - if (user?.isPMMAdmin) { - children.push(NAV_ALERTS_SETTINGS); - } + if (unifiedAlertingEnabled) { + if (alertingEnabled) { + children.push(NAV_ALERTS_FIRED); + } + + if (user?.isPMMAdmin) { + children.push(NAV_ALERTS_SETTINGS); + } - if (enabled && user?.isEditor) { - children.push(NAV_ALERTS_TEMPLATES); + if (alertingEnabled && user?.isEditor) { + children.push(NAV_ALERTS_TEMPLATES); + } } return { ...NAV_ALERTS, children };