diff --git a/packages/suite/src/views/settings/SettingsDebug/MessageSystemDebugInfo.tsx b/packages/suite/src/views/settings/SettingsDebug/MessageSystemDebugInfo.tsx new file mode 100644 index 00000000000..47453522d5b --- /dev/null +++ b/packages/suite/src/views/settings/SettingsDebug/MessageSystemDebugInfo.tsx @@ -0,0 +1,60 @@ +import { useState } from 'react'; + +import { Box, Button, ButtonGroup, Column, NewModal, Paragraph, Row } from '@trezor/components'; +import { selectAllValidMessages, selectMessageSystemConfig } from '@suite-common/message-system'; +import { copyToClipboard } from '@trezor/dom-utils'; +import { Message } from '@suite-common/suite-types'; +import { spacings } from '@trezor/theme'; + +import { useSelector } from 'src/hooks/suite'; + +const serializeCategory = (category: Message['category']): string => + typeof category === 'string' ? category : category.join(', '); + +export const MessageSystemDebugInfo = () => { + const config = useSelector(selectMessageSystemConfig); + const allValidMessages = useSelector(selectAllValidMessages); + + const [isModalOpen, setIsModalOpen] = useState(false); + + const handleCopyConfig = () => { + if (config === null) return; + copyToClipboard(JSON.stringify(config)); + }; + const handleOpenValidMessages = () => setIsModalOpen(true); + const handleCLoseValidMessages = () => setIsModalOpen(false); + + return ( + <> + + + Sequence: {config?.sequence} + Timestamp: {config?.timestamp} + + + + + + + {isModalOpen && ( + + + {allValidMessages.map(m => ( +
+ + {m.id} ({serializeCategory(m.category)}) + + {m.content.en} +
+ ))} +
+
+ )} + + ); +}; diff --git a/packages/suite/src/views/settings/SettingsDebug/SettingsDebug.tsx b/packages/suite/src/views/settings/SettingsDebug/SettingsDebug.tsx index a49284d7641..e52c44d4f0b 100644 --- a/packages/suite/src/views/settings/SettingsDebug/SettingsDebug.tsx +++ b/packages/suite/src/views/settings/SettingsDebug/SettingsDebug.tsx @@ -21,6 +21,7 @@ import { TriggerHighlight } from './TriggerHighlight'; import { Backends } from './Backends'; import { PreField } from './PreField'; import { Tor } from './Tor'; +import { MessageSystemDebugInfo } from './MessageSystemDebugInfo'; export const SettingsDebug = () => { const flags = useSelector(selectSuiteFlags); @@ -76,6 +77,9 @@ export const SettingsDebug = () => { {JSON.stringify(flags)} + + + ); };