diff --git a/packages/suite/src/components/suite/troubleshooting/tips/BridgeInstall.tsx b/packages/suite/src/components/suite/troubleshooting/tips/BridgeInstall.tsx new file mode 100644 index 00000000000..c2d24e4db6c --- /dev/null +++ b/packages/suite/src/components/suite/troubleshooting/tips/BridgeInstall.tsx @@ -0,0 +1,30 @@ +import { TrezorLink } from 'src/components/suite'; +import { Translation } from 'src/components/suite/Translation'; +import { typography } from '@trezor/theme'; +import styled from 'styled-components'; +import { useOpenSuiteDesktop } from 'src/hooks/suite/useOpenSuiteDesktop'; + +const Wrapper = styled.div` + a { + ${typography.hint}; + } +`; + +export const BridgeInstall = () => { + const handleClick = useOpenSuiteDesktop(); + + return ( + + ( + + {chunks} + + ), + }} + /> + + ); +}; diff --git a/packages/suite/src/components/suite/troubleshooting/tips/BridgeStatus.tsx b/packages/suite/src/components/suite/troubleshooting/tips/BridgeStatus.tsx new file mode 100644 index 00000000000..3343e1a6bda --- /dev/null +++ b/packages/suite/src/components/suite/troubleshooting/tips/BridgeStatus.tsx @@ -0,0 +1,25 @@ +import { TrezorLink } from 'src/components/suite'; +import { Translation } from 'src/components/suite/Translation'; +import { typography } from '@trezor/theme'; +import styled from 'styled-components'; + +const Wrapper = styled.div` + a { + ${typography.hint}; + } +`; + +export const BridgeStatus = () => ( + + ( + + {chunks} + + ), + }} + /> + +); diff --git a/packages/suite/src/components/suite/troubleshooting/tips/UdevDescription.tsx b/packages/suite/src/components/suite/troubleshooting/tips/UdevDescription.tsx new file mode 100644 index 00000000000..98f50fdfe43 --- /dev/null +++ b/packages/suite/src/components/suite/troubleshooting/tips/UdevDescription.tsx @@ -0,0 +1,37 @@ +import { TrezorLink } from 'src/components/suite'; +import { Translation } from 'src/components/suite/Translation'; +import { useDispatch } from 'src/hooks/suite'; +import { goto } from 'src/actions/suite/routerActions'; +import { typography } from '@trezor/theme'; +import styled from 'styled-components'; + +const Wrapper = styled.div` + a { + ${typography.hint}; + } +`; + +export const UdevDescription = () => { + const dispatch = useDispatch(); + + const handleClick = () => dispatch(goto('suite-udev')); + + return ( + + ( + + {chunks} + + ), + }} + /> + + ); +}; diff --git a/packages/suite/src/components/suite/troubleshooting/tips.tsx b/packages/suite/src/components/suite/troubleshooting/tips/index.tsx similarity index 50% rename from packages/suite/src/components/suite/troubleshooting/tips.tsx rename to packages/suite/src/components/suite/troubleshooting/tips/index.tsx index d1a9295ae16..30718beb1cc 100644 --- a/packages/suite/src/components/suite/troubleshooting/tips.tsx +++ b/packages/suite/src/components/suite/troubleshooting/tips/index.tsx @@ -1,80 +1,11 @@ import { isWeb, isLinux, isAndroid } from '@trezor/env-utils'; -import { TrezorLink } from 'src/components/suite'; import { Translation } from 'src/components/suite/Translation'; -import { useDispatch } from 'src/hooks/suite'; -import { goto } from 'src/actions/suite/routerActions'; -import { typography } from '@trezor/theme'; -import styled from 'styled-components'; import { isWebUsb } from 'src/utils/suite/transport'; -import { useOpenSuiteDesktop } from 'src/hooks/suite/useOpenSuiteDesktop'; -const Wrapper = styled.div` - a { - ${typography.hint}; - } -`; - -// TODO: move it to separated components? - -const UdevDescription = () => { - const dispatch = useDispatch(); - - const handleClick = () => dispatch(goto('suite-udev')); - - return ( - - ( - - {chunks} - - ), - }} - /> - - ); -}; - -const BridgeStatus = () => ( - - ( - - {chunks} - - ), - }} - /> - -); - -const BridgeInstall = () => { - const handleClick = useOpenSuiteDesktop(); - - return ( - - ( - - {chunks} - - ), - }} - /> - - ); -}; +import { BridgeStatus } from './BridgeStatus'; +import { BridgeInstall } from './BridgeInstall'; +import { UdevDescription } from './UdevDescription'; export const TROUBLESHOOTING_TIP_BRIDGE_STATUS = { key: 'bridge-status',