feat(suite): open suite desktop from troubleshooting tip directly

everstake · Jul 26, 2024 · f6b0fe5 · f6b0fe5
1 parent 3218b74
commit f6b0fe5
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 21 deletions.
diff --git a/packages/suite/src/components/suite/troubleshooting/tips.tsx b/packages/suite/src/components/suite/troubleshooting/tips.tsx
@@ -7,6 +7,7 @@ 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 {
@@ -57,9 +58,7 @@ const BridgeStatus = () => (
 );
 
 const BridgeInstall = () => {
-    const dispatch = useDispatch();
-
-    const handleClick = () => dispatch(goto('suite-bridge'));
+    const handleClick = useOpenSuiteDesktop();
 
     return (
         <Wrapper>

diff --git a/packages/suite/src/hooks/suite/useOpenSuiteDesktop.ts b/packages/suite/src/hooks/suite/useOpenSuiteDesktop.ts
@@ -0,0 +1,26 @@
+import TrezorConnect from '@trezor/connect';
+import { useWindowFocus } from '@trezor/react-utils';
+import { SUITE_BRIDGE_DEEPLINK, SUITE_URL } from '@trezor/urls';
+import { isWebUsb } from 'src/utils/suite/transport';
+import { useSelector } from 'src/hooks/suite';
+
+export const useOpenSuiteDesktop = () => {
+    const transport = useSelector(state => state.suite.transport);
+    const windowFocused = useWindowFocus();
+    const handleOpenSuite = () => {
+        if (isWebUsb(transport)) {
+            TrezorConnect.disableWebUSB();
+        }
+
+        location.href = SUITE_BRIDGE_DEEPLINK;
+
+        // fallback in case deeplink does not work
+        window.setTimeout(() => {
+            if (!windowFocused.current) return;
+
+            window.open(SUITE_URL);
+        }, 500);
+    };
+
+    return handleOpenSuite;
+};
diff --git a/packages/suite/src/views/suite/bridge/index.tsx b/packages/suite/src/views/suite/bridge/index.tsx
@@ -1,12 +1,10 @@
 import styled from 'styled-components';
-import { SUITE_BRIDGE_DEEPLINK, SUITE_URL } from '@trezor/urls';
 import { Translation, Modal, Metadata } from 'src/components/suite';
 import { Button } from '@trezor/components';
 import { goto } from 'src/actions/suite/routerActions';
 import { useDispatch, useSelector } from 'src/hooks/suite';
 import { isWebUsb } from 'src/utils/suite/transport';
-import TrezorConnect from '@trezor/connect';
-import { useWindowFocus } from '@trezor/react-utils';
+import { useOpenSuiteDesktop } from 'src/hooks/suite/useOpenSuiteDesktop';
 
 const StyledButton = styled(Button)`
     path {
@@ -26,21 +24,7 @@ export const BridgeUnavailable = () => {
     const transport = useSelector(state => state.suite.transport);
     const dispatch = useDispatch();
 
-    const windowFocused = useWindowFocus();
-    const handleOpenSuite = () => {
-        if (isWebUsb(transport)) {
-            TrezorConnect.disableWebUSB();
-        }
-
-        location.href = SUITE_BRIDGE_DEEPLINK;
-
-        // fallback in case deeplink does not work
-        window.setTimeout(() => {
-            if (!windowFocused.current) return;
-
-            window.open(SUITE_URL);
-        }, 500);
-    };
+    const handleOpenSuite = useOpenSuiteDesktop();
 
     const goToWallet = () => dispatch(goto('wallet-index'));