- {isLanguageSettingVisible ? (
+ {/* [AI] Conditionally render language drawer based on brand config */}
+ {enableLanguageSettings && isLanguageSettingVisible ? (
<>
@@ -87,6 +112,7 @@ const MobileMenu = ({ onLogout }: TMobileMenuProps) => {
) : (
{
closeDrawer();
@@ -94,6 +120,7 @@ const MobileMenu = ({ onLogout }: TMobileMenuProps) => {
}}
/>
)}
+ {/* [/AI] */}
diff --git a/src/components/layout/header/mobile-menu/use-mobile-menu-config.tsx b/src/components/layout/header/mobile-menu/use-mobile-menu-config.tsx
index c570971..98f403d 100644
--- a/src/components/layout/header/mobile-menu/use-mobile-menu-config.tsx
+++ b/src/components/layout/header/mobile-menu/use-mobile-menu-config.tsx
@@ -1,11 +1,7 @@
-import { ComponentProps, ReactNode, useEffect, useMemo, useState } from 'react';
-import { standalone_routes } from '@/components/shared';
-import { useFirebaseCountriesConfig } from '@/hooks/firebase/useFirebaseCountriesConfig';
+import { ComponentProps, ReactNode, useMemo } from 'react';
import useThemeSwitcher from '@/hooks/useThemeSwitcher';
import RootStore from '@/stores/root-store';
-import { handleTraderHubRedirect } from '@/utils/traders-hub-redirect';
-import { LabelPairedFileMdRegularIcon } from '@deriv/quill-icons/LabelPaired';
-import { LegacyHomeNewIcon, LegacyLogout1pxIcon, LegacyTheme1pxIcon } from '@deriv/quill-icons/Legacy';
+import { LegacyLogout1pxIcon, LegacyTheme1pxIcon } from '@deriv/quill-icons/Legacy';
import { useTranslations } from '@deriv-com/translations';
import { ToggleSwitch } from '@deriv-com/ui';
@@ -25,54 +21,37 @@ type TMenuConfig = {
isActive?: boolean;
}[];
-const useMobileMenuConfig = (client?: RootStore['client'], onLogout?: () => void) => {
- const { localize, currentLang } = useTranslations();
+const useMobileMenuConfig = (
+ client?: RootStore['client'],
+ onLogout?: () => void,
+ enableThemeToggle: boolean = true
+) => {
+ const { localize } = useTranslations();
const { is_dark_mode_on, toggleTheme } = useThemeSwitcher();
- const { hubEnabledCountryList } = useFirebaseCountriesConfig();
-
- const [redirect_url_str, setRedirectUrlStr] = useState(null);
-
- // Get current account information for dependency tracking
- const is_virtual = client?.is_virtual;
- const currency = client?.getCurrency?.();
- const is_logged_in = client?.is_logged_in;
- const client_residence = client?.residence;
-
- useEffect(() => {
- if (client?.is_logged_in) {
- const redirectParams = {
- product_type: 'tradershub' as const,
- has_wallet: false,
- is_virtual: client?.is_virtual,
- residence: client?.residence,
- hubEnabledCountryList,
- };
- setRedirectUrlStr(handleTraderHubRedirect(redirectParams));
- }
- }, [client?.is_virtual, client?.residence, hubEnabledCountryList, client?.is_logged_in]);
const menuConfig = useMemo((): TMenuConfig[] => {
- // Create home URL with language parameter
- const homeUrl = currentLang
- ? `${standalone_routes.deriv_app}?lang=${currentLang.toUpperCase()}`
- : standalone_routes.deriv_app;
return [
[
- {
- as: 'a',
- label: localize('Home'),
- LeftComponent: LegacyHomeNewIcon,
- href: homeUrl,
- },
- client?.is_logged_in && {
- as: 'button',
- label: localize('Reports'),
- LeftComponent: LabelPairedFileMdRegularIcon,
- submenu: 'reports',
- onClick: () => {},
- },
- {
+ // ========================================
+ // CUSTOM MENU ITEMS PLACEHOLDER
+ // ========================================
+ //
+ // Add your custom menu items here.
+ //
+ // EXAMPLE:
+ // {
+ // as: 'a',
+ // label: localize('Your Page'),
+ // LeftComponent: YourIcon,
+ // href: '/your-page',
+ // },
+ //
+ // For desktop menu items, see:
+ // src/components/layout/header/header-config.tsx
+
+ // Conditionally include theme toggle based on brand config
+ enableThemeToggle && {
as: 'button',
label: localize('Dark theme'),
LeftComponent: LegacyTheme1pxIcon,
@@ -91,22 +70,23 @@ const useMobileMenuConfig = (client?: RootStore['client'], onLogout?: () => void
].filter(Boolean) as TMenuConfig,
].filter(section => section.length > 0);
}, [
- is_virtual,
- currency,
- is_logged_in,
- client_residence,
client,
onLogout,
is_dark_mode_on,
toggleTheme,
localize,
- currentLang,
- redirect_url_str,
- hubEnabledCountryList,
+ enableThemeToggle, // [AI] Added to recalculate menu when theme toggle config changes
]);
+ // [AI] Check if menu has any items to determine if mobile menu should be shown
+ const hasMenuItems = menuConfig.some(section => section.length > 0);
+ // [/AI]
+
return {
config: menuConfig,
+ // [AI] Return flag indicating if menu has any items
+ hasMenuItems,
+ // [/AI]
};
};