diff --git a/src/pages/settings/Troubleshoot/TroubleshootPage.tsx b/src/pages/settings/Troubleshoot/TroubleshootPage.tsx index e31c6097501e..d6d0489f7676 100644 --- a/src/pages/settings/Troubleshoot/TroubleshootPage.tsx +++ b/src/pages/settings/Troubleshoot/TroubleshootPage.tsx @@ -1,7 +1,6 @@ import React, {useCallback, useMemo, useState} from 'react'; import {View} from 'react-native'; -import Onyx, {withOnyx} from 'react-native-onyx'; -import type {OnyxEntry} from 'react-native-onyx'; +import Onyx, {useOnyx} from 'react-native-onyx'; import type {SvgProps} from 'react-native-svg'; import ClientSideLoggingToolMenu from '@components/ClientSideLoggingToolMenu'; import ConfirmModal from '@components/ConfirmModal'; @@ -39,14 +38,7 @@ type BaseMenuItem = { action: () => void | Promise; }; -type TroubleshootPageOnyxProps = { - shouldStoreLogs: OnyxEntry; - shouldMaskOnyxState: boolean; -}; - -type TroubleshootPageProps = TroubleshootPageOnyxProps; - -function TroubleshootPage({shouldStoreLogs, shouldMaskOnyxState}: TroubleshootPageProps) { +function TroubleshootPage() { const {translate} = useLocalize(); const styles = useThemeStyles(); const {isProduction} = useEnvironment(); @@ -55,6 +47,9 @@ function TroubleshootPage({shouldStoreLogs, shouldMaskOnyxState}: TroubleshootPa const {shouldUseNarrowLayout} = useResponsiveLayout(); const illustrationStyle = getLightbulbIllustrationStyle(); + const [shouldStoreLogs] = useOnyx(ONYXKEYS.SHOULD_STORE_LOGS); + const [shouldMaskOnyxState = true] = useOnyx(ONYXKEYS.SHOULD_MASK_ONYX_STATE); + const exportOnyxState = useCallback(() => { ExportOnyxState.readFromOnyxDatabase().then((value: Record) => { const dataToShare = ExportOnyxState.maskOnyxState(value, shouldMaskOnyxState); @@ -177,12 +172,4 @@ function TroubleshootPage({shouldStoreLogs, shouldMaskOnyxState}: TroubleshootPa TroubleshootPage.displayName = 'TroubleshootPage'; -export default withOnyx({ - shouldStoreLogs: { - key: ONYXKEYS.SHOULD_STORE_LOGS, - }, - shouldMaskOnyxState: { - key: ONYXKEYS.SHOULD_MASK_ONYX_STATE, - selector: (shouldMaskOnyxState) => shouldMaskOnyxState ?? true, - }, -})(TroubleshootPage); +export default TroubleshootPage;