Profiles phase 2 minor review comments

e2e/hardhatTransactionFlow.spec.js

@@ -3,11 +3,7 @@
 /* eslint-disable jest/expect-expect */
 import { exec } from 'child_process';
 import { Contract } from '@ethersproject/contracts';
-import { JsonRpcProvider } from '@ethersproject/providers';
-import { Wallet } from '@ethersproject/wallet';
 import WalletConnect from '@walletconnect/client';
-import { convertUtf8ToHex } from '@walletconnect/utils';
-import { ethers } from 'ethers';
 import * as Helpers from './helpers';
 import kittiesABI from '@rainbow-me/references/cryptokitties-abi.json';
 import erc20ABI from '@rainbow-me/references/erc20-abi.json';
@@ -17,26 +13,13 @@ let uri = null;
 let account = null;
 
 const RAINBOW_WALLET_DOT_ETH = '0x7a3d05c70581bD345fe117c06e45f9669205384f';
-const TESTING_WALLET = '0x3Cb462CDC5F809aeD0558FBEe151eD5dC3D3f608';
 
+const CRYPTOKITTIES_ADDRESS = '0x06012c8cf97BEaD5deAe237070F9587f8E7A266d';
 const ETH_ADDRESS = 'eth';
 const BAT_TOKEN_ADDRESS = '0x0d8775f648430679a709e98d2b0cb6250d2887ef';
-const CRYPTOKITTIES_ADDRESS = '0x06012c8cf97BEaD5deAe237070F9587f8E7A266d';
-
-const getProvider = () => {
-  if (!getProvider._instance) {
-    getProvider._instance = new JsonRpcProvider(
-      device.getPlatform() === 'ios'
-        ? process.env.HARDHAT_URL_IOS
-        : process.env.HARDHAT_URL_ANDROID,
-      'any'
-    );
-  }
-  return getProvider._instance;
-};
 
 const isNFTOwner = async address => {
-  const provider = getProvider();
+  const provider = Helpers.getProvider();
   const kittiesContract = new Contract(
     CRYPTOKITTIES_ADDRESS,
     kittiesABI,
@@ -47,7 +30,7 @@ const isNFTOwner = async address => {
 };
 
 const getOnchainBalance = async (address, tokenContractAddress) => {
-  const provider = getProvider();
+  const provider = Helpers.getProvider();
   if (tokenContractAddress === ETH_ADDRESS) {
     const balance = await provider.getBalance(RAINBOW_WALLET_DOT_ETH);
     return balance;
@@ -62,21 +45,6 @@ const getOnchainBalance = async (address, tokenContractAddress) => {
   }
 };
 
-const sendETHtoTestWallet = async () => {
-  const provider = getProvider();
-  // Hardhat account 0 that has 10000 ETH
-  const wallet = new Wallet(
-    '0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80',
-    provider
-  );
-  // Sending 20 ETH so we have enough to pay the tx fees even when the gas is too high
-  await wallet.sendTransaction({
-    to: TESTING_WALLET,
-    value: ethers.utils.parseEther('20'),
-  });
-  return true;
-};
-
 beforeAll(async () => {
   // Connect to hardhat
   await exec('yarn hardhat');
@@ -155,7 +123,7 @@ describe('Hardhat Transaction Flow', () => {
   }
 
   it('Should show Hardhat Toast after pressing Connect To Hardhat', async () => {
-    await sendETHtoTestWallet();
+    await Helpers.sendETHtoTestWallet();
 
     await Helpers.waitAndTap('hardhat-section');
     await Helpers.checkIfVisible('testnet-toast-Hardhat');

e2e/helpers.js

@@ -1,4 +1,10 @@
+import { JsonRpcProvider } from '@ethersproject/providers';
+import { Wallet } from '@ethersproject/wallet';
 import { expect } from 'detox';
+import { ethers } from 'ethers';
+
+const TESTING_WALLET = '0x3Cb462CDC5F809aeD0558FBEe151eD5dC3D3f608';
+
 const DEFAULT_TIMEOUT = 8000;
 // eslint-disable-next-line eslint-comments/disable-enable-pair
 /* eslint-disable no-undef */
@@ -200,3 +206,30 @@ export function delay(ms) {
     }, ms);
   });
 }
+
+export function getProvider() {
+  if (!getProvider._instance) {
+    getProvider._instance = new JsonRpcProvider(
+      device.getPlatform() === 'ios'
+        ? process.env.HARDHAT_URL_IOS
+        : process.env.HARDHAT_URL_ANDROID,
+      'any'
+    );
+  }
+  return getProvider._instance;
+}
+
+export async function sendETHtoTestWallet() {
+  const provider = getProvider();
+  // Hardhat account 0 that has 10000 ETH
+  const wallet = new Wallet(
+    '0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80',
+    provider
+  );
+  // Sending 20 ETH so we have enough to pay the tx fees even when the gas is too high
+  await wallet.sendTransaction({
+    to: TESTING_WALLET,
+    value: ethers.utils.parseEther('20'),
+  });
+  return true;
+}

e2e/registerENSFlow.spec.js

@@ -2,54 +2,23 @@
 /* eslint-disable jest/expect-expect */
 import { exec } from 'child_process';
 import { Contract } from '@ethersproject/contracts';
-import { JsonRpcProvider } from '@ethersproject/providers';
-import { Wallet } from '@ethersproject/wallet';
-import { ethers } from 'ethers';
 import * as Helpers from './helpers';
 import registratABI from '@rainbow-me/references/ens/ENSETHRegistrarController.json';
 
-const TESTING_WALLET = '0x3Cb462CDC5F809aeD0558FBEe151eD5dC3D3f608';
-
-const RANDOM_NAME = 'somerandomname321';
 const ensETHRegistrarControllerAddress =
   '0x283Af0B28c62C092C9727F1Ee09c02CA627EB7F5';
 
-const getProvider = () => {
-  if (!getProvider._instance) {
-    getProvider._instance = new JsonRpcProvider(
-      device.getPlatform() === 'ios'
-        ? process.env.HARDHAT_URL_IOS
-        : process.env.HARDHAT_URL_ANDROID,
-      'any'
-    );
-  }
-  return getProvider._instance;
-};
+const RANDOM_NAME = 'somerandomname321';
 
-const isAvailable = async name => {
-  const provider = getProvider();
+const nameIsAvailable = async name => {
+  const provider = Helpers.getProvider();
   const registrarContract = new Contract(
     ensETHRegistrarControllerAddress,
     registratABI,
     provider
   );
-  const isAvailable = await registrarContract.available(name);
-  return !!isAvailable;
-};
-
-const sendETHtoTestWallet = async () => {
-  const provider = getProvider();
-  // Hardhat account 0 that has 10000 ETH
-  const wallet = new Wallet(
-    '0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80',
-    provider
-  );
-  // Sending 20 ETH so we have enough to pay the tx fees even when the gas is too high
-  await wallet.sendTransaction({
-    to: TESTING_WALLET,
-    value: ethers.utils.parseEther('20'),
-  });
-  return true;
+  const nameIsAvailable = await registrarContract.available(name);
+  return !!nameIsAvailable;
 };
 
 beforeAll(async () => {
@@ -116,11 +85,12 @@ describe('Register ENS Flow', () => {
   });
 
   it('Should make ENS Profiles available', async () => {
+    await Helpers.swipe('developer-settings-modal', 'up', 'slow');
     await Helpers.tapByText('ENS Profiles');
   });
 
   it('Should show Hardhat Toast after pressing Connect To Hardhat', async () => {
-    await sendETHtoTestWallet();
+    await Helpers.sendETHtoTestWallet();
 
     await Helpers.waitAndTap('hardhat-section');
     await Helpers.checkIfVisible('testnet-toast-Hardhat');
@@ -165,18 +135,6 @@ describe('Register ENS Flow', () => {
     await Helpers.waitAndTap('ens-assign-records-skip');
   });
 
-  it('Should go to come back to records view and add some', async () => {
-    await Helpers.checkIfVisible('ens-confirm-register-sheet');
-    // await Helpers.swipe('ens-confirm-register-sheet', 'down', 'slow');
-    // await Helpers.tapByText('Email');
-    // await Helpers.tapByText('Twitter');
-    const ensAvailable = await isAvailable(RANDOM_NAME);
-    if (!ensAvailable) throw new Error('ENS name not available');
-    // await Helpers.typeText('ens-text-record-name', RANDOM_NAME);
-    // await Helpers.typeText('ens-text-record-bio', 'this is my bio');
-    // await Helpers.waitAndTap('ens-assign-records-review-action-button');
-  });
-
   it('Should go to review registration and start it', async () => {
     await Helpers.checkIfVisible(`ens-transaction-action-COMMIT`);
     await Helpers.disableSynchronization();
@@ -204,7 +162,7 @@ describe('Register ENS Flow', () => {
 
   it('Should confirm that the name is not available anymore', async () => {
     await Helpers.delay(2000);
-    const ensAvailable = await isAvailable(RANDOM_NAME);
+    const ensAvailable = await nameIsAvailable(RANDOM_NAME);
     if (ensAvailable) throw new Error('ENS name is available');
   });
 

src/components/ens-profile/ActionButtons/EditButton.tsx

@@ -1,4 +1,5 @@
 import { useNavigation } from '@react-navigation/core';
+import lang from 'i18n-js';
 import React, { useCallback } from 'react';
 import GradientOutlineButton from '../GradientOutlineButton/GradientOutlineButton';
 import { useTheme } from '@rainbow-me/context';
@@ -22,7 +23,7 @@ export default function WatchButton({ ensName }: { ensName?: string }) {
         gradient={colors.gradients.blueToGreen}
         onPress={handlePressEdit}
       >
-        􀈎 Edit profile
+        􀈎 {lang.t(`profiles.actions.edit_profile`)}
       </GradientOutlineButton>
     </ColorModeProvider>
   );

src/components/ens-profile/ActionButtons/WatchButton.tsx

@@ -1,3 +1,4 @@
+import lang from 'i18n-js';
 import React from 'react';
 import GradientOutlineButton from '../GradientOutlineButton/GradientOutlineButton';
 import { useTheme } from '@rainbow-me/context';
@@ -27,7 +28,7 @@ export default function WatchButton({
         gradient={colors.gradients.blueToGreen}
         onPress={watchWallet}
       >
-        􀨭 {isWatching ? 'Watching' : 'Watch'}
+        􀨭 {lang.t(`profiles.actions.${isWatching ? 'watching' : 'watch'}`)}
       </GradientOutlineButton>
     </ColorModeProvider>
   );

src/components/ens-registration/RegistrationCover/RegistrationCover.tsx

@@ -1,4 +1,5 @@
 import ConditionalWrap from 'conditional-wrap';
+import lang from 'i18n-js';
 import React, { useEffect, useState } from 'react';
 import { View } from 'react-native';
 import { Image } from 'react-native-image-crop-picker';
@@ -101,7 +102,7 @@ export default function RegistrationCover({
             />
           ) : (
             <Text color="accent" size="18px" weight="heavy">
-              􀣵 Add Cover
+              􀣵 {lang.t('profiles.create.add_cover')}
             </Text>
           )}
         </Box>

src/components/expanded-state/unique-token/NFTBriefTokenInfoRow.tsx

@@ -1,3 +1,4 @@
+import lang from 'i18n-js';
 import React, { useCallback, useEffect, useState } from 'react';
 
 import assetTypes from '../../../entities/assetTypes';
@@ -77,7 +78,11 @@ export default function NFTBriefTokenInfoRow({
         isNft
         onPress={toggleCurrentPriceDisplayCurrency}
         size="big"
-        title={currentPrice ? '􀋢 For sale' : 'Last sale price'}
+        title={
+          currentPrice
+            ? `􀋢 ${lang.t('expanded_state.nft_brief_token_info.for_sale')}`
+            : lang.t('expanded_state.nft_brief_token_info.last_sale')
+        }
         weight={lastSalePrice === 'None' && !currentPrice ? 'bold' : 'heavy'}
       >
         {showCurrentPriceInEth || nativeCurrency === 'ETH' || !currentPrice

src/hooks/useOnAvatarPress.ts

@@ -1,3 +1,4 @@
+import lang from 'i18n-js';
 import { toLower } from 'lodash';
 import { useCallback, useMemo } from 'react';
 import { Linking } from 'react-native';
@@ -115,17 +116,21 @@ export default () => {
 
     const avatarActionSheetOptions = (isENSProfile
       ? [
-          'View Profile',
+          lang.t('profiles.profile_avatar.view_profile'),
           ...(!isReadOnlyWallet || enableActionsOnReadOnlyWallet
-            ? ['Edit Profile']
+            ? [lang.t('profiles.profile_avatar.edit_profile')]
             : []),
         ]
       : [
-          'Choose from Library',
-          ...(!accountImage ? ['Pick an Emoji'] : []),
-          ...(accountImage ? ['Remove Photo'] : []),
+          lang.t('profiles.profile_avatar.choose_from_library'),
+          ...(!accountImage
+            ? [lang.t(`profiles.profile_avatar.pick_emoji`)]
+            : []),
+          ...(accountImage
+            ? [lang.t(`profiles.profile_avatar.remove_photo`)]
+            : []),
           ...(!isReadOnlyWallet || enableActionsOnReadOnlyWallet
-            ? ['Create your Profile']
+            ? [lang.t('profiles.profile_avatar.create_profile')]
             : []),
         ]
     ).concat(ios ? ['Cancel'] : []);

src/languages/_english.json

@@ -324,6 +324,10 @@
         "total_value": "Total value",
         "underlying_tokens": "Underlying tokens"
       },
+      "nft_brief_token_info": {
+        "for_sale": "For sale",
+        "last_sale": "Last sale price"
+      },
       "supported_countries": {
         "supported_countries": "Supported Countries",
         "us_except": "United States (except Texas and New York)"
@@ -563,6 +567,11 @@
       "withdraw": "Withdraw"
     },
     "profiles": {
+      "actions": {
+        "watching": "Watching",
+        "watch": "Watch",
+        "edit_profile": "Edit profile"
+      },
       "banner": {
         "register_name": "Register a .eth Name",
         "and_create_ens_profile": "& create your ENS profile"
@@ -623,6 +632,14 @@
         "commit_button": "Hold to Commit",
         "insufficient_eth": "Insufficient ETH",
         "speed_up": "Speed Up"
+      },
+      "profile_avatar": {
+        "choose_from_library": "Choose from Library",
+        "create_profile": "Create your Profile",
+        "edit_profile": "Edit Profile",
+        "pick_emoji": "Pick an Emoji",
+        "remove_photo": "Remove Photo",
+        "view_profile": "View Profile"
       }
     },
     "savings": {

src/raps/actions/depositCompound.ts

@@ -3,7 +3,7 @@ import { Wallet } from '@ethersproject/wallet';
 import { captureException } from '@sentry/react-native';
 import {
   Rap,
-  RapEchangeActionParameters,
+  RapExchangeActionParameters,
   SwapActionParameters,
 } from '../common';
 import {
@@ -37,7 +37,7 @@ const depositCompound = async (
   wallet: Wallet,
   currentRap: Rap,
   index: number,
-  parameters: RapEchangeActionParameters,
+  parameters: RapExchangeActionParameters,
   baseNonce?: number
 ): Promise<number | undefined> => {
   logger.log(`[${actionName}] base nonce`, baseNonce, 'index:', index);

src/raps/actions/swap.ts

@@ -2,7 +2,7 @@ import { Wallet } from '@ethersproject/wallet';
 import { captureException } from '@sentry/react-native';
 import {
   Rap,
-  RapEchangeActionParameters,
+  RapExchangeActionParameters,
   SwapActionParameters,
 } from '../common';
 import {
@@ -28,7 +28,7 @@ const swap = async (
   wallet: Wallet,
   currentRap: Rap,
   index: number,
-  parameters: RapEchangeActionParameters,
+  parameters: RapExchangeActionParameters,
   baseNonce?: number
 ): Promise<number | undefined> => {
   logger.log(`[${actionName}] base nonce`, baseNonce, 'index:', index);