diff --git a/src/components/navigation/GlobalNavigation/GlobalNavigation.stories.tsx b/src/components/navigation/GlobalNavigation/GlobalNavigation.stories.tsx
index 7c0c00fba..9ef850385 100644
--- a/src/components/navigation/GlobalNavigation/GlobalNavigation.stories.tsx
+++ b/src/components/navigation/GlobalNavigation/GlobalNavigation.stories.tsx
@@ -895,44 +895,6 @@ export const IndicativeWithSuiteSwitcher: Story = {
   },
 }
 
-export const IndicativeWithDisabledInteractions: Story = {
-  args: {
-    disableInteractions: true,
-    tempGlobalOnClick: () => {
-      console.log('Global On Click')
-    },
-    logo: indLogo,
-    tools: indTools,
-    management: indManagement,
-    createItems: indCreateItems,
-    orgs: indOrgs,
-    minimapOptions: {
-      overviewHref: '/',
-      onLinkClick: link => {
-        if (link.linkId !== 'analytics') alert(link.href)
-      },
-      links: [
-        { linkId: 'oversight', href: '/oversight' },
-        { linkId: 'dataPlatform', href: '/data-platform' },
-        { linkId: 'customer360', href: '/customer-360' },
-        { linkId: 'predictions', href: '/predictions' },
-        { linkId: 'analytics', href: '/analytics' },
-        { linkId: 'segmentation', href: '/segmentation' },
-      ],
-      activeLink: 'analytics',
-    },
-    navigationButtonItemOptions: {
-      label: 'Custom Signout Label',
-      onClick: () => {
-        alert('Signout!')
-      },
-    },
-    onMpHomeClick: () => {
-      alert('going to overview map')
-    },
-  },
-}
-
 const cortexLogo: IGlobalNavigationLogo = {
   label: 'Predictions',
   icon: 'predictions',
@@ -1334,46 +1296,3 @@ export const MPWithSuiteSelector: Story = {
     },
   },
 }
-
-export const MPWithDisabledInteractions: Story = {
-  args: {
-    disableInteractions: true,
-    tempGlobalOnClick: () => {
-      console.log('Global On Click')
-    },
-    onSearchClick: () => {
-      alert('Searching!')
-    },
-    logo: mpLogoWithBackground,
-    tools: mpTools,
-    management: mpManagement,
-    orgs: mpOrgs,
-    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',
-    },
-    showSuiteLogo: true,
-    suiteSelectorOptions: {
-      overviewHref: '/',
-      onLinkClick: link => {
-        alert(link.href)
-      },
-      onUnauthorizedClick: link => {
-        alert(`unauthorized ${link?.href} `)
-      },
-      unauthorizedLinks: ['dataPlatform'],
-      activeLink: 'oversight',
-      links: [
-        { linkId: 'oversight', href: '/oversight' },
-        { linkId: 'dataPlatform', href: '/data-platform' },
-        { linkId: 'customer360', href: '/customer-360' },
-        { linkId: 'predictions', href: '/predictions' },
-        { linkId: 'analytics', href: '/analytics' },
-        { linkId: 'segmentation', href: '/segmentation' },
-      ],
-    },
-  },
-}
diff --git a/src/components/navigation/GlobalNavigation/GlobalNavigation.tsx b/src/components/navigation/GlobalNavigation/GlobalNavigation.tsx
index 324cb7ab7..8dda2cba3 100644
--- a/src/components/navigation/GlobalNavigation/GlobalNavigation.tsx
+++ b/src/components/navigation/GlobalNavigation/GlobalNavigation.tsx
@@ -9,6 +9,8 @@ import {
   type IAvatarProps,
   Icon,
   Layout,
+  Drawer,
+  type IDrawerProps,
 } from 'src/components'
 import { SuiteLogo } from 'src/components/navigation/GlobalNavigation/SuiteLogo'
 import { NavigationSearch } from 'src/components/navigation/GlobalNavigation/NavigationSearch'
@@ -23,6 +25,9 @@ import { NavigationItem } from 'src/components/navigation/GlobalNavigation/Navig
 import { useNewExperienceReminder } from 'src/hooks/NewExperienceReminder/useNewExperienceReminder'
 import { HomeButton } from 'src/components/navigation/GlobalNavigation/HomeButton'
 import { type MouseEventHandler } from 'react'
+import { type DrawerStyles } from 'antd/es/drawer/DrawerPanel'
+
+// type DrawerOptions = Omit<IDrawerProps, 'key' | 'placement' | 'styles' | 'getContainer' | 'closeIcon'>
 
 export interface IGlobalNavigationProps {
   logo: IGlobalNavigationLogo
@@ -50,10 +55,28 @@ export interface IGlobalNavigationProps {
    */
   minimapOptions?: ISuiteSelectorOptions
   tempGlobalOnClick?: MouseEventHandler<HTMLDivElement>
+  drawerOptions?: IDrawerProps
 }
 
 export const GlobalNavWidth = 90 as const
 
+const WIDTH = '300px' as const
+const OPACITY = '0' as const
+const PADDING = 0 as const
+
+const drawerStyles: DrawerStyles = {
+  mask: {
+    opacity: OPACITY,
+  },
+  wrapper: {
+    width: WIDTH,
+    marginLeft: GlobalNavWidth,
+  },
+  body: {
+    padding: PADDING,
+  },
+} as const
+
 export const GlobalNavigation = ({ showSuiteLogo = true, ...props }: IGlobalNavigationProps) => {
   return (
     <Layout className="globalNavigation">
@@ -95,6 +118,15 @@ export const GlobalNavigation = ({ showSuiteLogo = true, ...props }: IGlobalNavi
           </div>
         </Flex>
       </Layout.Sider>
+      <Drawer
+        key="globalNavigation__leftDrawer"
+        styles={drawerStyles}
+        closeIcon={false}
+        placement="left"
+        forceRender
+        {...props.drawerOptions}>
+        {props.drawerOptions?.children ?? null}
+      </Drawer>
     </Layout>
   )
 }
diff --git a/src/components/navigation/GlobalNavigation/GlobalNavigationNotificationCenter.stories.tsx b/src/components/navigation/GlobalNavigation/GlobalNavigationNotificationCenter.stories.tsx
new file mode 100644
index 000000000..268b4ef5a
--- /dev/null
+++ b/src/components/navigation/GlobalNavigation/GlobalNavigationNotificationCenter.stories.tsx
@@ -0,0 +1,204 @@
+import React, { useMemo, useRef } from 'react'
+import {
+  Center,
+  GlobalNavigation,
+  Icon,
+  type IGlobalNavigationItem,
+  type IGlobalNavigationLogo,
+  type INavigationOrg,
+} from 'src/components'
+import type { Meta, StoryObj } from '@storybook/react'
+import { type IGlobalNavigationLink } from 'src/components/navigation/GlobalNavigation/GlobalNavigationItems'
+
+const defaultLogo: IGlobalNavigationLogo = {
+  label: 'Aqua',
+  icon: <Icon name="alicorn" size="xxl" color="brand" />,
+  type: 'custom-size',
+  onSuiteLogoClick: () => {
+    alert('Going to Aqua Home!')
+  },
+}
+
+const defaultTools: IGlobalNavigationItem[] = [
+  {
+    label: 'Tool 1',
+    isActive: true,
+    icon: <Icon name="privacy" />,
+    type: 'menu',
+    children: [
+      { label: 'option 1', hrefOptions: { href: '/' } },
+      { label: 'option 2', hrefOptions: { href: '/' } },
+      { label: 'option 3', hrefOptions: { href: '/' } },
+    ],
+  },
+  {
+    label: 'Tool 2',
+    icon: <Icon name="favorite" />,
+    type: 'menu',
+    children: [
+      { label: 'option 1', hrefOptions: { href: '/' } },
+      { label: 'option 2', hrefOptions: { href: '/' } },
+      { label: 'option 3', hrefOptions: { href: '/' } },
+    ],
+  },
+  {
+    label: 'Tool 3',
+    icon: <Icon name="connections" />,
+    hrefOptions: { href: '/' },
+  },
+]
+
+const defaultManagement: IGlobalNavigationItem[] = [
+  {
+    label: 'Notifications',
+    hideLabel: true,
+    icon: <Icon name="api" />,
+    hrefOptions: { href: '/' },
+  },
+  {
+    label: 'Support',
+    hideLabel: true,
+    icon: <Icon name="support" />,
+    type: 'menu',
+    children: [
+      { label: 'option 1', hrefOptions: { href: '/' } },
+      { label: 'option 2', hrefOptions: { href: '/' } },
+      { label: 'option 3', hrefOptions: { href: '/' } },
+    ],
+  },
+  {
+    label: 'Settings',
+    hideLabel: true,
+    icon: <Icon name="settings" />,
+    type: 'menu',
+    children: [
+      { label: 'option 1', hrefOptions: { href: '/' } },
+      { label: 'option 2', hrefOptions: { href: '/' } },
+      { label: 'option 3', hrefOptions: { href: '/' } },
+      {
+        label: 'button',
+        type: 'button',
+        buttonOptions: {
+          onClick: () => {
+            alert('go')
+          },
+        },
+      },
+      { type: 'button', label: 'go', buttonOptions: { href: '/', target: '_blank' } },
+    ],
+  },
+]
+
+const defaultOrgs: INavigationOrg[] = [
+  {
+    id: 'org1',
+    label: 'Org 1',
+    accounts: [
+      {
+        id: 'account1',
+        label: 'account 1',
+        workspaces: [
+          {
+            id: 'workspace1',
+            label: 'Workspace 111111111',
+            isActive: true,
+            onClick: () => {
+              alert('Selected Workspace 1')
+            },
+          },
+        ],
+      },
+    ],
+  },
+]
+
+const meta: Meta<typeof GlobalNavigation> = {
+  title: 'Aquarium/Navigation/GlobalNavigationNotificationCenter',
+  component: props => (
+    <Center style={{ minHeight: '800px' }}>
+      <GlobalNavigation {...props}></GlobalNavigation>
+    </Center>
+  ),
+
+  args: {
+    logo: defaultLogo,
+    tools: defaultTools,
+    management: defaultManagement,
+    orgs: defaultOrgs,
+    navigationButtonItemOptions: {
+      label: 'Sign Out of mParticle',
+      onClick: () => {
+        alert('signing out!')
+      },
+    },
+    onMpHomeClick: () => {
+      alert('Going to mP!')
+    },
+  },
+}
+export default meta
+
+type Story = StoryObj<typeof GlobalNavigation>
+
+export const MPWithDisabledInteractions: Story = {
+  render: props => {
+    // const [isNotificationCenterOpen, setIsNotificationCenterOpen] = useState(false)
+    const notificationCenterRef = useRef(true)
+    console.log('rendering...')
+    const management = useMemo(
+      () => [
+        {
+          label: 'Notifications',
+          hideLabel: true,
+          icon: <Icon name="notification" />,
+          type: 'link',
+          isActive: false,
+          onClick: () => {
+            notificationCenterRef.current = !notificationCenterRef.current
+          },
+        } satisfies IGlobalNavigationLink,
+        ...defaultManagement,
+      ],
+      [],
+    )
+
+    return (
+      <div style={{ width: 800 }}>
+        <GlobalNavigation
+          {...props}
+          drawerOptions={{
+            title: 'Notifications',
+            open: notificationCenterRef.current,
+          }}
+          logo={defaultLogo}
+          tools={defaultTools}
+          management={management}
+          orgs={defaultOrgs}
+          showSuiteLogo={true}
+          onSearchClick={() => {
+            alert('Searching!')
+          }}
+          suiteSelectorOptions={{
+            overviewHref: '/',
+            onLinkClick: link => {
+              alert(link.href)
+            },
+            onUnauthorizedClick: link => {
+              alert(`unauthorized ${link?.href} `)
+            },
+            unauthorizedLinks: ['dataPlatform'],
+            activeLink: 'oversight',
+            links: [
+              { linkId: 'oversight', href: '/oversight' },
+              { linkId: 'dataPlatform', href: '/data-platform' },
+              { linkId: 'customer360', href: '/customer-360' },
+              { linkId: 'predictions', href: '/predictions' },
+              { linkId: 'analytics', href: '/analytics' },
+              { linkId: 'segmentation', href: '/segmentation' },
+            ],
+          }}
+        />
+      </div>
+    )
+  },
+}