chore(suite): unify debug mode usage

trezor · Jan 23, 2025 · 769cb04 · 769cb04
1 parent 08dc1e4
commit 769cb04
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 8 deletions.
diff --git a/...te/src/components/suite/layouts/SuiteLayout/Sidebar/QuickActions/DebugAndExperimental.tsx b/...te/src/components/suite/layouts/SuiteLayout/Sidebar/QuickActions/DebugAndExperimental.tsx
@@ -6,6 +6,7 @@ import { spacings } from '@trezor/theme';
 import { useDispatch, useSelector } from 'src/hooks/suite';
 import { goto } from 'src/actions/suite/routerActions';
 import { SettingsAnchor } from 'src/constants/suite/anchors';
+import { selectIsDebugModeActive } from 'src/reducers/suite/suiteReducer';
 
 import { QuickActionButton } from './QuickActionButton';
 import { TooltipRow } from './TooltipRow';
@@ -73,27 +74,27 @@ export const DebugAndExperimental = () => {
 
     const isEapEnabled = useSelector(state => state.desktopUpdate.allowPrerelease);
     const isExperimental = useSelector(state => state.suite.settings.experimental !== undefined);
-    const isDebugMode = useSelector(state => state.suite.settings.debug.showDebugMenu);
+    const isDebug = useSelector(selectIsDebugModeActive);
 
     const handleEapClick = () => {
         dispatch(goto('settings-index', { anchor: SettingsAnchor.EarlyAccess }));
     };
 
-    if (!isEapEnabled && !isExperimental && !isDebugMode) return null;
+    if (!isEapEnabled && !isExperimental && !isDebug) return null;
 
     return (
         <QuickActionButton
             tooltip={
                 <DebugAndExperimentalTooltip
-                    isDebugMode={isDebugMode}
+                    isDebugMode={isDebug}
                     isEapEnabled={isEapEnabled}
                     isExperimental={isExperimental}
                 />
             }
             onClick={handleEapClick}
         >
             <Relative $size={getIconSize(iconSizes.medium)}>
-                {isDebugMode && (
+                {isDebug && (
                     <Absolute>
                         <Icon name="debug" variant="destructive" size={iconSizes.medium} />
                     </Absolute>

diff --git a/packages/suite/src/views/settings/SettingsGeneral/Theme.tsx b/packages/suite/src/views/settings/SettingsGeneral/Theme.tsx
@@ -8,13 +8,14 @@ import { ActionColumn, ActionSelect, TextColumn, Translation } from 'src/compone
 import { useDispatch, useSelector, useTranslation } from 'src/hooks/suite';
 import { SettingsAnchor } from 'src/constants/suite/anchors';
 import { getOsTheme } from 'src/utils/suite/env';
+import { selectIsDebugModeActive } from 'src/reducers/suite/suiteReducer';
 
 type ThemeColorVariantWithSystem = ThemeColorVariant | 'system';
 type Option = { value: ThemeColorVariantWithSystem; label: string };
 
 const useThemeOptions = () => {
     const { translationString } = useTranslation();
-    const showDebugMenu = useSelector(state => state.suite.settings.debug.showDebugMenu);
+    const isDebug = useSelector(selectIsDebugModeActive);
 
     const systemOption: Option = {
         value: 'system',
@@ -29,7 +30,7 @@ const useThemeOptions = () => {
 
     const optionGroups = [
         { options: [systemOption] },
-        { options: [lightOption, darkOption, ...(showDebugMenu ? [debugOption] : [])] },
+        { options: [lightOption, darkOption, ...(isDebug ? [debugOption] : [])] },
     ];
 
     const getOption = (theme: ThemeColorVariantWithSystem) => {

diff --git a/packages/suite/src/views/wallet/details/CoinjoinLogs.tsx b/packages/suite/src/views/wallet/details/CoinjoinLogs.tsx
@@ -8,6 +8,7 @@ import { useSelector } from 'src/hooks/suite/useSelector';
 import { useAnchor } from 'src/hooks/suite/useAnchor';
 import { CoinjoinLogsAnchor } from 'src/constants/suite/anchors';
 import { anchorOutlineStyles } from 'src/utils/suite/anchor';
+import { selectIsDebugModeActive } from 'src/reducers/suite/suiteReducer';
 
 // eslint-disable-next-line local-rules/no-override-ds-component
 const SetupCard = styled(Card)<{ $shouldHighlight?: boolean }>`
@@ -19,10 +20,11 @@ const SetupCard = styled(Card)<{ $shouldHighlight?: boolean }>`
 `;
 
 export const CoinjoinLogs = () => {
-    const showDebugMenu = useSelector(state => state.suite.settings.debug.showDebugMenu);
+    const isDebug = useSelector(selectIsDebugModeActive);
+
     const { anchorRef, shouldHighlight } = useAnchor(CoinjoinLogsAnchor);
 
-    if (!showDebugMenu) return null;
+    if (!isDebug) return null;
 
     return (
         <SetupCard ref={anchorRef} $shouldHighlight={shouldHighlight}>