diff --git a/.env.example.kovan b/.env.example.kovan index 9f0660a0b..23b3c62b9 100644 --- a/.env.example.kovan +++ b/.env.example.kovan @@ -16,7 +16,6 @@ REACT_APP_MTA_ADDRESS=0xcda64b5d3ca85800ab9f7409686985b59f2b9598 REACT_APP_CHAIN_ID=42 REACT_APP_PORTIS_DAPP_ID= REACT_APP_FORTMATIC_API_KEY= -REACT_APP_SQUARELINK_CLIENT_ID= -REACT_APP_RPC_API_KEY= +REACT_APP_RPC_API_KEY=YOUR_INFURA_KEY_GOES_HERE REACT_APP_RPC_URL=https://kovan.infura.io/v3/ -REACT_APP_SENTRY_DSN= +REACT_APP_SENTRY_DSN= \ No newline at end of file diff --git a/.env.example.mainnet b/.env.example.mainnet index f58251394..eb4699c19 100644 --- a/.env.example.mainnet +++ b/.env.example.mainnet @@ -11,7 +11,6 @@ REACT_APP_MTA_ADDRESS=0xa3bed4e1c75d00fa6f4e5e6922db7261b5e9acd2 REACT_APP_CHAIN_ID=1 REACT_APP_PORTIS_DAPP_ID=${PORTIS_DAPP_ID} REACT_APP_FORTMATIC_API_KEY=${FORTMATIC_API_KEY} -REACT_APP_SQUARELINK_CLIENT_ID=${SQUARELINK_CLIENT_ID} -REACT_APP_RPC_API_KEY=a6daf77ef0ae4b60af39259e435a40fe +REACT_APP_RPC_API_KEY=YOUR_INFURA_KEY_GOES_HERE REACT_APP_RPC_URL=https://mainnet.infura.io/v3/ REACT_APP_SENTRY_DSN=${SENTRY_DSN} \ No newline at end of file diff --git a/.env.example.ropsten b/.env.example.ropsten index a258247ad..ae4cc744c 100644 --- a/.env.example.ropsten +++ b/.env.example.ropsten @@ -16,7 +16,6 @@ REACT_APP_MTA_ADDRESS=0x273bc479e5c21caa15aa8538decbf310981d14c0 REACT_APP_CHAIN_ID=3 REACT_APP_PORTIS_DAPP_ID= REACT_APP_FORTMATIC_API_KEY= -REACT_APP_SQUARELINK_CLIENT_ID= REACT_APP_RPC_API_KEY=YOUR_INFURA_KEY_GOES_HERE REACT_APP_RPC_URL=https://ropsten.infura.io/v3/ REACT_APP_SENTRY_DSN= diff --git a/package.json b/package.json index 3b22c2a13..8bba66ddb 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,10 @@ "@apollo/react-common": "^3.2.0-beta.1", "@apollo/react-hooks": "^3.2.0-beta.1", "@habx/apollo-multi-endpoint-link": "^1.1.0", + "@renproject/chains": "^2.1.0", + "@renproject/interfaces": "^2.1.0", + "@renproject/ren": "^2.1.0", + "@renproject/utils": "^2.1.0", "@sentry/react": "^5.19.0", "@testing-library/jest-dom": "^5.7.0", "@testing-library/react": "^10.0.4", @@ -34,7 +38,7 @@ "apollo-link-error": "^1.1.13", "apollo-utilities": "^1.3.4", "bignumber.js": "^9.0.0", - "bnc-onboard": "^1.18.0", + "bnc-onboard": "1.18.0", "date-fns": "^2.14.0", "dotenv": "^8.2.0", "dotenv-expand": "^5.1.0", @@ -60,6 +64,7 @@ "react-is": "^16.13.1", "react-loading-skeleton": "^2.0.1", "react-modal-hook": "^3.0.0", + "react-qr-code": "^1.0.5", "react-router-dom": "^5.2.0", "react-scripts": "^4.0.1", "react-swipeable": "^5.5.1", @@ -70,9 +75,9 @@ "styled-components": "^5.1.0", "styled-reset": "^4.1.4", "ts-pipe-compose": "^0.2.0", - "use-resize-observer": "^7.0.0", "use-clipboard-copy": "^0.1.2", "use-onclickoutside": "^0.3.1", + "use-resize-observer": "^7.0.0", "utility-types": "^3.10.0", "web3-utils": "^1.2.6" }, diff --git a/src/components/core/Arrow.tsx b/src/components/core/Arrow.tsx index 6c4cc6049..8ae9054af 100644 --- a/src/components/core/Arrow.tsx +++ b/src/components/core/Arrow.tsx @@ -1,6 +1,8 @@ import React, { FC } from 'react'; import styled from 'styled-components'; +type Direction = 'up' | 'down' | 'left' | 'right'; + export const Container = styled.div` align-items: center; display: flex; @@ -11,9 +13,15 @@ export const Container = styled.div` user-select: none; `; -export const Arrow: FC<{ direction?: 'up' | 'down' }> = ({ +const ArrowIcon: Record = { + up: '↑', + down: '↓', + left: '←', + right: '→', +}; + +export const Arrow: FC<{ direction?: Direction }> = ({ direction = 'down', }) => { - const arrowIcon = direction === 'up' ? '↑' : '↓'; - return {arrowIcon}; + return {ArrowIcon[direction]}; }; diff --git a/src/components/core/Dropdown.tsx b/src/components/core/Dropdown.tsx index dc2f323e0..9692dcd97 100644 --- a/src/components/core/Dropdown.tsx +++ b/src/components/core/Dropdown.tsx @@ -14,6 +14,7 @@ interface Props { options?: TransactionOption[]; onChange?(address?: string): void; disabled?: boolean; + className?: string; } const ChevronContainer = styled.span<{ selected?: boolean; active?: boolean }>` @@ -161,6 +162,7 @@ export const Dropdown: FC = ({ options, onChange, disabled, + className, }) => { const [show, toggleShow] = useToggle(false); @@ -185,7 +187,11 @@ export const Dropdown: FC = ({ const isDropdown = (options?.length ?? 0) > 1; return ( - +