US-1943: Add link to Terms and Conditions (#752)

* add terms and conditions url

* error handling

* add i18n

config.json

@@ -1,18 +1,19 @@
 {
   "QR_READER_BITCOIN_DEFAULT_NETWORK_MAINNET": "BITCOIN",
   "QR_READER_BITCOIN_DEFAULT_NETWORK_TESTNET": "BITCOIN_TESTNET",
-  "RIF_RELAY_SERVER_MAINNET":"https://relay.rif-wallet-services.mainnet.rifcomputing.net",
-  "RIF_RELAY_SERVER_TESTNET":"https://relay.rif-wallet-services.testnet.rifcomputing.net",
-  "SMART_WALLET_FACTORY_ADDRESS_MAINNET":"0x9eebec6c5157bee13b451b1dfe1ee2cb40846323",
-  "SMART_WALLET_FACTORY_ADDRESS_TESTNET":"0xBaDb31cAf5B95edd785446B76219b60fB1f07233",
-  "RELAY_VERIFIER_ADDRESS_MAINNET":"0x5C9c7d96E6C59E55dA4dCf7F791AE58dAF8DBc86",
-  "RELAY_VERIFIER_ADDRESS_TESTNET":"0x5897E84216220663F306676458Afc7bf2A6A3C52",
-  "DEPLOY_VERIFIER_ADDRESS_MAINNET":"0x2fd633e358bc50ccf6bf926d621e8612b55264c9",
-  "DEPLOY_VERIFIER_ADDRESS_TESTNET":"0xAe59e767768c6c25d64619Ee1c498Fd7D83e3c24",
-  "BTC_EXPLORER_ADDRESS_URL_MAINNET":"https://explorer.btc.com/btc/transaction",
-  "BTC_EXPLORER_ADDRESS_URL_TESTNET":"https://live.blockcypher.com/btc-testnet",
-  "RPC_URL_MAINNET":"https://public-node.rsk.co",
-  "RPC_URL_TESTNET":"https://public-node.testnet.rsk.co",
-  "EXPLORER_ADDRESS_URL_MAINNET":"https://explorer.rsk.co",
-  "EXPLORER_ADDRESS_URL_TESTNET":"https://explorer.testnet.rsk.co"
-}
+  "RIF_RELAY_SERVER_MAINNET": "https://relay.rif-wallet-services.mainnet.rifcomputing.net",
+  "RIF_RELAY_SERVER_TESTNET": "https://relay.rif-wallet-services.testnet.rifcomputing.net",
+  "SMART_WALLET_FACTORY_ADDRESS_MAINNET": "0x9eebec6c5157bee13b451b1dfe1ee2cb40846323",
+  "SMART_WALLET_FACTORY_ADDRESS_TESTNET": "0xBaDb31cAf5B95edd785446B76219b60fB1f07233",
+  "RELAY_VERIFIER_ADDRESS_MAINNET": "0x5C9c7d96E6C59E55dA4dCf7F791AE58dAF8DBc86",
+  "RELAY_VERIFIER_ADDRESS_TESTNET": "0x5897E84216220663F306676458Afc7bf2A6A3C52",
+  "DEPLOY_VERIFIER_ADDRESS_MAINNET": "0x2fd633e358bc50ccf6bf926d621e8612b55264c9",
+  "DEPLOY_VERIFIER_ADDRESS_TESTNET": "0xAe59e767768c6c25d64619Ee1c498Fd7D83e3c24",
+  "BTC_EXPLORER_ADDRESS_URL_MAINNET": "https://explorer.btc.com/btc/transaction",
+  "BTC_EXPLORER_ADDRESS_URL_TESTNET": "https://live.blockcypher.com/btc-testnet",
+  "RPC_URL_MAINNET": "https://public-node.rsk.co",
+  "RPC_URL_TESTNET": "https://public-node.testnet.rsk.co",
+  "EXPLORER_ADDRESS_URL_MAINNET": "https://explorer.rsk.co",
+  "EXPLORER_ADDRESS_URL_TESTNET": "https://explorer.testnet.rsk.co",
+  "TERMS_AND_CONDITIONS_URL": "https://drive.google.com/file/d/1-jKY7K_93g9c7kNJ__cDYkGYp03PrOO8/view"
+}

src/core/types.ts

@@ -12,4 +12,5 @@ export enum SETTINGS {
   RIF_WALLET_KEY = 'RIF_WALLET_KEY',
   WALLETCONNECT2_PROJECT_ID = 'WALLETCONNECT2_PROJECT_ID',
   BTC_EXPLORER_ADDRESS_URL = 'BTC_EXPLORER_ADDRESS_URL',
+  TERMS_AND_CONDITIONS_URL = 'TERMS_AND_CONDITIONS_URL',
 }

src/lib/i18n.ts

@@ -352,6 +352,7 @@ const resources = {
         'We strongly advise exercising caution, employing the best security practices,and safeguarding your assets diligently."',
       security_i_agree: 'I agree with the conditions. ',
       security_info_btn: 'Continue',
+      security_terms_and_conditions: 'Terms and Conditions',
       android_qr_alert_title: 'Error reading QR',
       android_qr_alert_desc: 'The QR could not be parsed. Please try again.',
       android_qr_loading_camera: 'Loading camera',

src/screens/createKeys/SecurityInformation.tsx

@@ -1,7 +1,9 @@
 import { useCallback, useState } from 'react'
-import { StyleSheet, View } from 'react-native'
+import { Linking, StyleSheet, View } from 'react-native'
 import { useTranslation } from 'react-i18next'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
+import { TouchableOpacity } from 'react-native-gesture-handler'
+import config from 'config.json'
 
 import {
   createKeysRouteNames,
@@ -11,6 +13,7 @@ import { sharedColors, sharedStyles } from 'shared/constants'
 import { castStyle } from 'shared/utils'
 import { AppButton, AppTouchable, Typography } from 'components/index'
 import { Checkbox } from 'components/checkbox'
+import { SETTINGS } from 'src/core/types'
 
 enum TestID {
   IAgreeCheckbox = 'Checkbox.IAgreeCheckbox',
@@ -58,6 +61,19 @@ export const SecurityInformation = ({
         </Typography>
       </View>
       <View style={[styles.checkboxBtnWrapper, { bottom: insets.bottom }]}>
+        <View style={styles.termsAndConditionsView}>
+          <TouchableOpacity
+            accessibilityLabel="termsAndConditions"
+            onPress={() =>
+              Linking.openURL(config[SETTINGS.TERMS_AND_CONDITIONS_URL]).catch(
+                err => console.error("Couldn't load page", err),
+              )
+            }>
+            <Typography type="body1" style={styles.termsAndConditionsText}>
+              {t('security_terms_and_conditions')}
+            </Typography>
+          </TouchableOpacity>
+        </View>
         <View style={styles.agreementView}>
           <AppTouchable
             width={18}
@@ -84,7 +100,10 @@ export const SecurityInformation = ({
 }
 
 const styles = StyleSheet.create({
-  header: castStyle.text({ marginTop: 10, letterSpacing: -0.03 }),
+  header: castStyle.text({
+    marginTop: 10,
+    letterSpacing: -0.03,
+  }),
   checkboxBtnWrapper: castStyle.view({
     position: 'absolute',
     right: 24,
@@ -103,6 +122,14 @@ const styles = StyleSheet.create({
     lineHeight: 18,
     color: sharedColors.labelLight,
   }),
+  termsAndConditionsView: castStyle.view({
+    alignSelf: 'center',
+    marginBottom: 22,
+  }),
+  termsAndConditionsText: castStyle.text({
+    color: 'blue',
+    textDecorationLine: 'underline',
+  }),
   agreementView: castStyle.view({ flexDirection: 'row', alignSelf: 'center' }),
   agreeText: castStyle.text({ marginLeft: 10 }),
   button: castStyle.view({ marginTop: 22 }),