diff --git a/packages/connect-deeplink/README.md b/packages/connect-deeplink/README.md index 8cbe34e6448..4604d578a9f 100644 --- a/packages/connect-deeplink/README.md +++ b/packages/connect-deeplink/README.md @@ -6,8 +6,7 @@ The `@trezor/connect-deeplink` package provides an implementation of `@trezor/co Currently the library is still under development, only supports read-only methods and does not communicate with the production Suite Lite app. -To run a dev version of the Suite mobile app follow the instructions in [@suite-native/app](https://github.com/trezor/trezor-suite/blob/develop/suite-native/app/README.md) - +To run a dev version of the Suite mobile app follow the instructions in [@suite-native/app](https://github.com/trezor/trezor-suite/blob/develop/suite-native/app/README.md) ## Using the Library @@ -44,4 +43,4 @@ useEffect(() => { ## Example -The [connect-deeplink-example](https://github.com/trezor/trezor-suite/tree/develop/packages/connect-examples/connect-deeplink-example) shows how to use the library in a React Native + Expo app. +The [Connect deeplink example](https://github.com/trezor/trezor-suite/tree/develop/packages/connect-examples/deeplink-expo) shows how to use the library in a React Native + Expo app. diff --git a/packages/connect-examples/deeplink-expo/.gitignore b/packages/connect-examples/deeplink-expo/.gitignore new file mode 100644 index 00000000000..05647d55c75 --- /dev/null +++ b/packages/connect-examples/deeplink-expo/.gitignore @@ -0,0 +1,35 @@ +# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files + +# dependencies +node_modules/ + +# Expo +.expo/ +dist/ +web-build/ + +# Native +*.orig.* +*.jks +*.p8 +*.p12 +*.key +*.mobileprovision + +# Metro +.metro-health-check* + +# debug +npm-debug.* +yarn-debug.* +yarn-error.* + +# macOS +.DS_Store +*.pem + +# local env files +.env*.local + +# typescript +*.tsbuildinfo diff --git a/packages/connect-examples/deeplink-expo/App.tsx b/packages/connect-examples/deeplink-expo/App.tsx new file mode 100644 index 00000000000..b81115d8f37 --- /dev/null +++ b/packages/connect-examples/deeplink-expo/App.tsx @@ -0,0 +1,90 @@ +import { Button, StyleSheet, Text, View } from 'react-native'; +import { useEffect, useState } from 'react'; + +import { StatusBar } from 'expo-status-bar'; +import * as Linking from 'expo-linking'; + +import TrezorConnect from '@trezor/connect-deeplink'; + +const styles = StyleSheet.create({ + container: { + flex: 1, + backgroundColor: '#fff', + alignItems: 'center', + justifyContent: 'center', + }, + dataContainer: { + marginTop: 20, + alignItems: 'flex-start', + }, +}); + +export const App = () => { + const [errorData, setErrorData] = useState(null); + const [successData, setSuccessData] = useState(null); + + const initialize = () => { + TrezorConnect.init({ + manifest: { + email: 'developer@xyz.com', + appUrl: 'http://your.application.com', + }, + deeplinkOpen: url => { + // eslint-disable-next-line no-console + console.log('deeplinkOpen', url); + Linking.openURL(url); + }, + deeplinkCallbackUrl: Linking.createURL('/connect'), + }); + }; + + const getAddress = async () => { + try { + const response = await TrezorConnect.getAddress({ + path: "m/49'/0'/0'/0/0", + coin: 'btc', + }); + if (!response.success) { + setSuccessData(null); + setErrorData({ success: response.success }); + + return; + } + setErrorData(null); + setSuccessData(response); + } catch (error) { + console.error('error', error); + } + }; + + useEffect(() => { + const subscription = Linking.addEventListener('url', event => { + TrezorConnect.handleDeeplink(event.url); + }); + + return () => subscription?.remove(); + }, []); + + return ( + + Trezor Connect Native example! +