From 755153c56235bd21a9ce5327f8e037e5abc65de5 Mon Sep 17 00:00:00 2001
From: Alaister Young <alaister@users.noreply.github.com>
Date: Thu, 6 Nov 2025 09:37:46 +0800
Subject: [PATCH] [FE-2058] chore(docs): mobile nav logo custom content
 (#40178)

---
 .../Navigation/NavigationMenu/GlobalMobileMenu.tsx         | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/apps/docs/components/Navigation/NavigationMenu/GlobalMobileMenu.tsx b/apps/docs/components/Navigation/NavigationMenu/GlobalMobileMenu.tsx
index 69682dfcad19f..773e40b3c338b 100644
--- a/apps/docs/components/Navigation/NavigationMenu/GlobalMobileMenu.tsx
+++ b/apps/docs/components/Navigation/NavigationMenu/GlobalMobileMenu.tsx
@@ -10,6 +10,7 @@ import { useIsLoggedIn, useIsUserLoading } from 'common'
 import { Accordion, Button, cn } from 'ui'
 import { ThemeToggle } from 'ui-patterns/ThemeToggle'
 
+import { getCustomContent } from '~/lib/custom-content/getCustomContent'
 import type { DropdownMenuItem } from '../Navigation.types'
 import { MenuItem, useActiveMenuLabel } from './GlobalNavigationMenu'
 import { GLOBAL_MENU_ITEMS } from './NavigationMenu.constants'
@@ -107,6 +108,8 @@ const GlobalMobileMenu = ({ open, setOpen }: Props) => {
   const isUserLoading = useIsUserLoading()
   const pathname = usePathname()
 
+  const { navigationLogo } = getCustomContent(['navigation:logo'])
+
   // Close mobile menu on route change
   useEffect(() => {
     setOpen(false)
@@ -129,7 +132,7 @@ const GlobalMobileMenu = ({ open, setOpen }: Props) => {
               <Link href="/" className="flex items-center gap-2">
                 <Image
                   className="cursor-pointer hidden dark:block"
-                  src="/docs/supabase-dark.svg"
+                  src={navigationLogo?.dark ?? '/docs/supabase-dark.svg'}
                   priority
                   width={96}
                   height={24}
@@ -137,7 +140,7 @@ const GlobalMobileMenu = ({ open, setOpen }: Props) => {
                 />
                 <Image
                   className="cursor-pointer block dark:hidden"
-                  src="/docs/supabase-light.svg"
+                  src={navigationLogo?.light ?? '/docs/supabase-light.svg'}
                   priority
                   width={96}
                   height={24}