feat: Add links to the minimap

src/components/navigation/GlobalNavigation/GlobalNavigation.stories.tsx

@@ -134,7 +134,15 @@
     onMpHomeClick: () => {
       alert('Going to mP!')
     },
     minimapOptions: {
+      routes: [
+        { elementId: 'oversight', route: '/oversight', isAuthorized: true },
+        { elementId: 'dataPlatform', route: '/data-platform', isAuthorized: false },
+        { elementId: 'customer360', route: '/customer-360', isAuthorized: true },
+        { elementId: 'predictions', route: '/predictions', isAuthorized: false },
+        { elementId: 'analytics', route: '/analytics', isAuthorized: true },
+        { elementId: 'segmentation', route: '/segmentation', isAuthorized: false },
+      ],
       show: true,
     },
   },
@@ -467,12 +475,22 @@
     tools: mpTools,
     management: mpManagement,
     orgs: mpOrgs,
-    minimapOptions: { overviewHref: '/', show: true },
+    minimapOptions: {
+      overviewHref: '/',
+      show: true,
+      routes: [
+        { elementId: 'oversight', route: '/oversight', isAuthorized: true },
+        { elementId: 'dataPlatform', route: '/data-platform', isAuthorized: false },
+        { elementId: 'customer360', route: '/customer-360', isAuthorized: true },
+        { elementId: 'predictions', route: '/predictions', isAuthorized: false },
+        { elementId: 'analytics', route: '/analytics', isAuthorized: true },
+        { elementId: 'segmentation', route: '/segmentation', isAuthorized: false },
+      ],
+    },
     onMpHomeClick: () => {
       alert('going to overview map')
     },
     avatarOptions: {
-      // src: "https://static-qa1.qa.corp.mparticle.com/appimg/logo_af_916397d2-9732-8de6-77cc-80e3bba120ca.png",
       alt: 'avatar',
     },
   },
@@ -493,7 +511,7 @@
           tools={mpTools}
           management={mpManagement}
           orgs={thousandOrgs}
-          minimapOptions={{ overviewHref: '/' }}
+          minimapOptions={{ show: false }}
           onMpHomeClick={() => {
             alert('going to overview map')
           }}

src/components/navigation/GlobalNavigation/GlobalNavigation.tsx

@@ -15,10 +15,14 @@ import { NavigationSearch } from 'src/components/navigation/GlobalNavigation/Nav
 import { NavigationList } from 'src/components/navigation/GlobalNavigation/NavigationList'
 import { NavigationCreate } from 'src/components/navigation/GlobalNavigation/NavigationCreate'
 import { WorkspaceSelector } from 'src/components/navigation/GlobalNavigation/WorkspaceSelector/WorkspaceSelector'
-import { type IGlobalNavigationItem } from 'src/components/navigation/GlobalNavigation/GlobalNavigationItems'
+import {
+  type IGlobalNavigationItem,
+  IMinimapOptions,
+} from 'src/components/navigation/GlobalNavigation/GlobalNavigationItems'
 import { NavigationItem } from 'src/components/navigation/GlobalNavigation/NavigationItem'
 import { useNewExperienceReminder } from 'src/hooks/NewExperienceReminder/useNewExperienceReminder'
 import { HomeButton } from 'src/components/navigation/GlobalNavigation/HomeButton'
+import { ISvgLink } from 'src/components/navigation/MiniMap/SvgLinker'
 
 export interface IGlobalNavigationProps {
   logo: IGlobalNavigationLogo
@@ -36,10 +40,7 @@ export interface IGlobalNavigationProps {
     onClick: () => void
     withoutContainer?: boolean
   }
-  minimapOptions: {
-    overviewHref?: string
-    show?: boolean
-  }
+  minimapOptions: IMinimapOptions
 }
 
 export const GlobalNavWidth = 90 as const

src/components/navigation/GlobalNavigation/GlobalNavigationItems.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode, type MouseEvent } from 'react'
 import { type HrefOptions } from 'src/utils/utils'
-
+import { ISvgLink } from 'src/components/navigation/MiniMap/SvgLinker'
 export interface IBaseGlobalNavigationItem {
   type?: 'menu' | 'link'
   label: ReactNode
@@ -28,3 +28,17 @@ export interface IGlobalNavigationLink extends IBaseGlobalNavigationItem {
 }
 
 export type IGlobalNavigationItem = IGlobalNavigationMenu | IGlobalNavigationLink
+
+interface IMinimapOptionsShow {
+  show: true
+  overviewHref: string
+  routes: ISvgLink[]
+}
+
+interface IMinimapOptionsHide {
+  show: false
+  overviewHref: undefined
+  routes: []
+}
+
+export type IMinimapOptions = IMinimapOptionsShow | IMinimapOptionsHide

src/components/navigation/GlobalNavigation/HomeButton.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import { Center, IGlobalNavigationProps, Icon, Popover, Tooltip } from 'src/components'
 import MiniMap from 'src/components/navigation/MiniMap/MiniMap'
+import { ISvgLink } from 'src/components/navigation/MiniMap/SvgLinker'
 
 interface MpHomeButtonProps {
   onClick: () => void
@@ -9,6 +10,7 @@ interface MpHomeButtonProps {
 interface MinimapWithPopoverProps {
   overviewHref: string
   onClick: () => void
+  routes: ISvgLink[]
 }
 
 interface TooltipWithButtonProps {
@@ -19,6 +21,7 @@ interface HomeButtonProps {
   minimapOptions: {
     overviewHref?: string
     show?: boolean
+    routes: ISvgLink[]
   }
   onMpHomeClick: () => void
 }
@@ -28,8 +31,11 @@ const MpHomeButton: React.FC<MpHomeButtonProps> = ({ onClick }) => (
   </Center>
 )
 
-const MinimapWithPopover: React.FC<MinimapWithPopoverProps> = ({ overviewHref, onClick }) => (
-  <Popover content={() => <MiniMap overviewHref={overviewHref} />} placement="rightBottom" arrow={false}>
+const MinimapWithPopover: React.FC<MinimapWithPopoverProps> = ({ overviewHref, onClick, routes }) => (
+  <Popover
+    content={() => <MiniMap overviewHref={overviewHref} routes={routes} />}
+    placement="rightBottom"
+    arrow={false}>
     <MpHomeButton onClick={onClick} />
   </Popover>
 )
@@ -45,6 +51,7 @@ export const HomeButton: React.FC<HomeButtonProps> = props => {
     <MinimapWithPopover
       overviewHref={props.minimapOptions?.overviewHref || '/'}
       onClick={props.onMpHomeClick}
+      routes={props.minimapOptions.routes}
     />
   ) : (
     <TooltipWithButton onClick={props.onMpHomeClick} />