Skip to content

I
interface
Commit 35d9254b authored by Noah Zinsmeister's avatar Noah Zinsmeister Committed by GitHub
Browse files
Options

Merge pull request #264 from NoahZinsmeister/netlify 

upgrade dependencies, fix lint errors
parents a06d9c3c 9c93c1a9
Hide whitespace changes
Inline Side-by-side
Showing with 1138 additions and 1000 deletions
README.md
View file @ 35d9254b
# Uniswap Frontend
[![Netlify Status](https://api.netlify.com/api/v1/badges/fa110555-b3c7-4eeb-b840-88a835009c62/deploy-status)](https://app.netlify.com/sites/uniswap/deploys)
This an an open source interface for Uniswap - a protocol for decentralized exchange of Ethereum tokens.
* Website: [uniswap.io/](https://uniswap.io/)
......
src/components/ContextualInfo/index.js
View file @ 35d9254b
......@@ -65,12 +65,12 @@ class ContextualInfo extends Component {
{!this.state.showDetails ? (
<>
<span>{openDetailsText}</span>
<img src={DropdownBlue} />
<img src={DropdownBlue} alt='dropdown' />
</>
) : (
<>
<span>{closeDetailsText}</span>
<img src={DropupBlue} />
<img src={DropupBlue} alt='dropup' />
</>
)}
</div>,
......
src/components/CurrencyInputPanel/index.js
View file @ 35d9254b
......@@ -230,7 +230,7 @@ class CurrencyInputPanel extends Component {
this.setState({ searchQuery: e.target.value });
}}
/>
<img src={SearchIcon} className="token-modal__search-icon" />
<img src={SearchIcon} className="token-modal__search-icon" alt='search' />
</div>
<div className="token-modal__token-list">
{this.renderTokenList()}
......
src/components/Header/index.js
View file @ 35d9254b
......@@ -88,7 +88,7 @@ class BlockingWarning extends Component {
const correctNetworkId = process.env.REACT_APP_NETWORK_ID || 1;
const correctNetwork = process.env.REACT_APP_NETWORK || 'Main Ethereum Network';
const wrongNetwork = networkId != correctNetworkId;
const wrongNetwork = networkId !== correctNetworkId;
if (wrongNetwork && initialized) {
content = [
......@@ -114,14 +114,14 @@ class BlockingWarning extends Component {
isMobile()
? (
[
<img src={CoinbaseWalletLogo} key="coinbase-wallet" onClick={() => window.open(getCoinbaseWalletLink(), '_blank')} />,
<img src={TrustLogo} key="trust" onClick={() => window.open(getTrustLink(), '_blank')} />
<img alt='coinbase' src={CoinbaseWalletLogo} key="coinbase-wallet" onClick={() => window.open(getCoinbaseWalletLink(), '_blank')} />,
<img alt='trust' src={TrustLogo} key="trust" onClick={() => window.open(getTrustLink(), '_blank')} />
]
)
: (
[
<img src={MetamaskLogo} key="metamask" onClick={() => window.open(getMetamaskLink(), '_blank')} />,
<img src={BraveLogo} key="brave" onClick={() => window.open(getBraveLink(), '_blank')} />
<img alt='metamask' src={MetamaskLogo} key="metamask" onClick={() => window.open(getMetamaskLink(), '_blank')} />,
<img alt='brave' src={BraveLogo} key="brave" onClick={() => window.open(getBraveLink(), '_blank')} />
]
)
}
......
src/components/NavigationTabs/index.js
View file @ 35d9254b
......@@ -50,7 +50,7 @@ class NavigationTabs extends Component {
{
showBetaMessage && (
<div className="beta-message" onClick={dismissBetaMessage}>
💀 {t("betaWarning")}
<span role='img' aria-label='warning'>💀</span> {t("betaWarning")}
</div>
)
}
......
src/components/OversizedPanel/index.js
View file @ 35d9254b
import React from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import './oversized-panel.scss';
......
src/components/QrCode/index.js
View file @ 35d9254b
......@@ -21,10 +21,6 @@ class QrCode extends Component {
stream: null,
};
constructor(props) {
super(props);
}
componentDidUpdate() {
const { videoOpen, stream } = this.state;
......@@ -102,12 +98,8 @@ class QrCode extends Component {
}
render() {
const {
onValueReceived,
} = this.props;
return [
<img key="icon" src={QrCodeSVG} onClick={() => {
<img key="icon" src={QrCodeSVG} alt='code' onClick={() => {
this.state.videoOpen ? this.closeVideo() : this.openVideo();
}} />,
this.renderQrReader()
......
src/components/Tab/index.js
View file @ 35d9254b
import React, { Component } from 'react';
import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
......
src/components/TokenLogo/index.js
View file @ 35d9254b
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import EthereumLogo from '../../assets/images/ethereum-logo.svg';
import GenericTokenLogo from '../../assets/images/generic-token-logo.png';
const RINKEBY_TOKEN_MAP = {
'0xDA5B056Cfb861282B4b59d29c9B395bcC238D29B': '0x0d8775f648430679a709e98d2b0cb6250d2887ef',
......@@ -45,11 +44,12 @@ export default class TokenLogo extends Component {
}
if (!path) {
return <div className={className} style={{ width: size, fontSize: size }}>🤔</div>
return <div className={className} style={{ width: size, fontSize: size }}><span role='img' aria-label='thinking'>🤔</span></div>
}
return (
<img
alt='images'
src={path}
className={className}
style={{
......
src/components/Web3Status/index.js
View file @ 35d9254b
......@@ -2,10 +2,10 @@ import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import classnames from 'classnames';
import Web3 from 'web3';
import Jazzicon from 'jazzicon';
import { CSSTransitionGroup } from "react-transition-group";
import { withNamespaces } from 'react-i18next';
import { ethers } from 'ethers'
import './web3-status.scss';
import Modal from '../Modal';
......@@ -13,6 +13,8 @@ function getEtherscanLink(tx) {
return `https://etherscan.io/tx/${tx}`;
}
console.log(ethers)
class Web3Status extends Component {
state = {
isShowingModal: false,
......@@ -93,7 +95,7 @@ class Web3Status extends Component {
return;
}
if (!address|| address.length < 42 || !Web3.utils.isHexStrict(address)) {
if (!address || address.length < 42 || !ethers.utils.isHexString(address)) {
return;
}
......@@ -119,11 +121,11 @@ function getPendingText(pendingTransactions, pendingLabel) {
}
function getText(text, disconnectedText) {
if (!text || text.length < 42 || !Web3.utils.isHexStrict(text)) {
if (!text || text.length < 42 || !ethers.utils.isHexString(text)) {
return disconnectedText;
}
const address = Web3.utils.toChecksumAddress(text);
const address = ethers.utils.getAddress(text);
return `${address.substring(0, 6)}...${address.substring(38)}`;
}
......
src/ducks/web3connect.js
View file @ 35d9254b
......@@ -220,7 +220,7 @@ export const sync = () => async (dispatch, getState) => {
watched,
contracts,
networkId,
transactions: { pending, confirmed },
transactions: { pending },
} = getState().web3connect;
// Sync Account
......
src/helpers/fuse/bitap/bitap_regex_search.js
View file @ 35d9254b
// eslint-disable-next-line no-unused-escape
// eslint-disable-next-line no-useless-escape
const SPECIAL_CHARS_REGEX = /[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g
export default function (text, pattern, tokenSeparator = / +/g) {
......
src/libraries/qr-scanner.js
View file @ 35d9254b
/* eslint-disable */
/*
@asset(/libraries/qr-scanner/qr-scanner-worker.min.js) */
'use strict';export default class QrScanner{constructor(video,onDecode,canvasSize=QrScanner.DEFAULT_CANVAS_SIZE){this.$video=video;this.$canvas=document.createElement("canvas");this._onDecode=onDecode;this._active=false;this.$canvas.width=canvasSize;this.$canvas.height=canvasSize;this._sourceRect={x:0,y:0,width:canvasSize,height:canvasSize};this.$video.addEventListener("canplay",()=>this._updateSourceRect());this.$video.addEventListener("play",()=>{this._updateSourceRect();this._scanFrame()},false);
......
src/pages/Pool/AddLiquidity.js
View file @ 35d9254b
......@@ -10,8 +10,6 @@ import NavigationTabs from '../../components/NavigationTabs';
import { selectors, addPendingTx } from '../../ducks/web3connect';
import PlusBlue from '../../assets/images/plus-blue.svg';
import PlusGrey from '../../assets/images/plus-grey.svg';
import DropdownBlue from "../../assets/images/dropdown-blue.svg";
import DropupBlue from "../../assets/images/dropup-blue.svg";
import { getBlockDeadline } from '../../helpers/web3-utils';
import { retry } from '../../helpers/promise-utils';
import ModeSelector from './ModeSelector';
......@@ -56,7 +54,7 @@ class AddLiquidity extends Component {
const { inputValue, outputValue, inputCurrency, outputCurrency, lastEditedField } = this.state;
return isConnected !== nextProps.isConnected ||
t != nextProps.t ||
t !== nextProps.t ||
account !== nextProps.account ||
exchangeAddresses !== nextProps.exchangeAddresses ||
web3 !== nextProps.web3 ||
......@@ -455,7 +453,7 @@ class AddLiquidity extends Component {
action: 'Open',
});
const { value: tokenReserve, decimals, label } = selectors().getTokenBalance(outputCurrency, fromToken[outputCurrency]);
const { value: tokenReserve, label } = selectors().getTokenBalance(outputCurrency, fromToken[outputCurrency]);
const { value: ethReserve } = selectors().getBalance(fromToken[outputCurrency]);
const { decimals: poolTokenDecimals } = selectors().getBalance(account, fromToken[outputCurrency]);
......@@ -473,8 +471,8 @@ class AddLiquidity extends Component {
const SLIPPAGE = 0.025;
const minOutput = BN(outputValue).multipliedBy(1 - SLIPPAGE);
const maxOutput = BN(outputValue).multipliedBy(1 + SLIPPAGE);
const minPercentage = minOutput.dividedBy(minOutput.plus(tokenReserve)).multipliedBy(100);
const maxPercentage = maxOutput.dividedBy(maxOutput.plus(tokenReserve)).multipliedBy(100);
// const minPercentage = minOutput.dividedBy(minOutput.plus(tokenReserve)).multipliedBy(100);
// const maxPercentage = maxOutput.dividedBy(maxOutput.plus(tokenReserve)).multipliedBy(100);
const liquidityMinted = BN(inputValue).multipliedBy(totalSupply.dividedBy(ethReserve));
const adjTotalSupply = totalSupply.dividedBy(10 ** poolTokenDecimals);
......@@ -524,7 +522,7 @@ class AddLiquidity extends Component {
? (
<div className="pool__new-exchange-warning">
<div className="pool__new-exchange-warning-text">
🚰 {t("firstLiquidity")}
<span role='img' aria-label='liquidity'>🚰</span> {t("firstLiquidity")}
</div>
<div className="pool__new-exchange-warning-text">
{ t("initialExchangeRate", { label }) }
......@@ -545,7 +543,7 @@ class AddLiquidity extends Component {
/>
<OversizedPanel>
<div className="swap__down-arrow-background">
<img className="swap__down-arrow" src={isValid ? PlusBlue : PlusGrey} />
<img className="swap__down-arrow" src={isValid ? PlusBlue : PlusGrey} alt='plus' />
</div>
</OversizedPanel>
<CurrencyInputPanel
......@@ -586,7 +584,7 @@ class AddLiquidity extends Component {
export default connect(
state => ({
isConnected: Boolean(state.web3connect.account) && state.web3connect.networkId == (process.env.REACT_APP_NETWORK_ID||1),
isConnected: Boolean(state.web3connect.account) && state.web3connect.networkId === (process.env.REACT_APP_NETWORK_ID||1),
account: state.web3connect.account,
balances: state.web3connect.balances,
web3: state.web3connect.web3,
......
src/pages/Pool/CreateExchange.js
View file @ 35d9254b
......@@ -222,7 +222,7 @@ class CreateExchange extends Component {
export default withRouter(
connect(
state => ({
isConnected: Boolean(state.web3connect.account) && state.web3connect.networkId == (process.env.REACT_APP_NETWORK_ID||1),
isConnected: Boolean(state.web3connect.account) && state.web3connect.networkId === (process.env.REACT_APP_NETWORK_ID||1),
account: state.web3connect.account,
balances: state.web3connect.balances,
web3: state.web3connect.web3,
......
src/pages/Pool/ModeSelector.js
View file @ 35d9254b
......@@ -86,7 +86,7 @@ class ModeSelector extends Component {
<span className="pool__liquidity-label">
{this.props.title}
</span>
<img src={Dropdown} />
<img src={Dropdown} alt='dropdown' />
</div>
{this.renderModal()}
</OversizedPanel>
......
src/pages/Pool/RemoveLiquidity.js
View file @ 35d9254b
......@@ -198,7 +198,6 @@ class RemoveLiquidity extends Component {
const {
t,
exchangeAddresses: { fromToken },
web3,
selectors,
account,
} = this.props;
......@@ -215,9 +214,9 @@ class RemoveLiquidity extends Component {
});
const SLIPPAGE = 0.025;
const { value: liquidityBalance, decimals } = getBalance(account, exchangeAddress);
const { decimals } = getBalance(account, exchangeAddress);
const { value: ethReserve } = getBalance(exchangeAddress);
const { value: tokenReserve, label, decimals: reserveDecimals } = getBalance(exchangeAddress, tokenAddress);
const { value: tokenReserve, label } = getBalance(exchangeAddress, tokenAddress);
const ethPer = ethReserve.dividedBy(totalSupply);
const tokenPer = tokenReserve.dividedBy(totalSupply);
......@@ -377,7 +376,7 @@ class RemoveLiquidity extends Component {
/>
<OversizedPanel>
<div className="swap__down-arrow-background">
<img className="swap__down-arrow" src={isValid ? ArrowDownBlue : ArrowDownGrey} />
<img className="swap__down-arrow" src={isValid ? ArrowDownBlue : ArrowDownGrey} alt='arrow' />
</div>
</OversizedPanel>
{ this.renderOutput() }
......@@ -401,7 +400,7 @@ class RemoveLiquidity extends Component {
export default connect(
state => ({
isConnected: Boolean(state.web3connect.account) && state.web3connect.networkId == (process.env.REACT_APP_NETWORK_ID||1),
isConnected: Boolean(state.web3connect.account) && state.web3connect.networkId === (process.env.REACT_APP_NETWORK_ID||1),
web3: state.web3connect.web3,
balances: state.web3connect.balances,
account: state.web3connect.account,
......
src/pages/Send/index.js
View file @ 35d9254b
......@@ -11,8 +11,6 @@ import AddressInputPanel from '../../components/AddressInputPanel';
import CurrencyInputPanel from '../../components/CurrencyInputPanel';
import ContextualInfo from '../../components/ContextualInfo';
import OversizedPanel from '../../components/OversizedPanel';
import DropdownBlue from "../../assets/images/dropdown-blue.svg";
import DropupBlue from "../../assets/images/dropup-blue.svg";
import ArrowDownBlue from '../../assets/images/arrow-down-blue.svg';
import ArrowDownGrey from '../../assets/images/arrow-down-grey.svg';
import { getBlockDeadline } from '../../helpers/web3-utils';
......@@ -586,7 +584,6 @@ class Send extends Component {
outputValue,
outputCurrency,
recipient,
inputAmountB,
lastEditedField,
} = this.state;
const { t, selectors, account } = this.props;
......@@ -600,10 +597,10 @@ class Send extends Component {
const TOKEN_ALLOWED_SLIPPAGE = 0.04;
const type = getSendType(inputCurrency, outputCurrency);
const { label: inputLabel, decimals: inputDecimals } = selectors().getBalance(account, inputCurrency);
const { label: outputLabel, decimals: outputDecimals } = selectors().getBalance(account, outputCurrency);
const { label: inputLabel } = selectors().getBalance(account, inputCurrency);
const { label: outputLabel } = selectors().getBalance(account, outputCurrency);
const label = lastEditedField === INPUT ? outputLabel : inputLabel;
// const label = lastEditedField === INPUT ? outputLabel : inputLabel;
let minOutput;
let maxInput;
......@@ -749,7 +746,7 @@ class Send extends Component {
/>
<OversizedPanel>
<div className="swap__down-arrow-background">
<img onClick={this.flipInputOutput} className="swap__down-arrow swap__down-arrow--clickable" src={isValid ? ArrowDownBlue : ArrowDownGrey} />
<img onClick={this.flipInputOutput} className="swap__down-arrow swap__down-arrow--clickable" alt='arrow' src={isValid ? ArrowDownBlue : ArrowDownGrey} />
</div>
</OversizedPanel>
<CurrencyInputPanel
......@@ -766,7 +763,7 @@ class Send extends Component {
/>
<OversizedPanel>
<div className="swap__down-arrow-background">
<img className="swap__down-arrow" src={isValid ? ArrowDownBlue : ArrowDownGrey} />
<img className="swap__down-arrow" src={isValid ? ArrowDownBlue : ArrowDownGrey} alt='arrow' />
</div>
</OversizedPanel>
<AddressInputPanel
......@@ -796,7 +793,7 @@ class Send extends Component {
export default connect(
state => ({
balances: state.web3connect.balances,
isConnected: !!state.web3connect.account && state.web3connect.networkId == (process.env.REACT_APP_NETWORK_ID||1),
isConnected: !!state.web3connect.account && state.web3connect.networkId === (process.env.REACT_APP_NETWORK_ID||1),
account: state.web3connect.account,
web3: state.web3connect.web3,
exchangeAddresses: state.addresses.exchangeAddresses,
......
src/pages/Swap/index.js
View file @ 35d9254b
......@@ -12,8 +12,6 @@ import NavigationTabs from '../../components/NavigationTabs';
import CurrencyInputPanel from '../../components/CurrencyInputPanel';
import ContextualInfo from '../../components/ContextualInfo';
import OversizedPanel from '../../components/OversizedPanel';
import DropdownBlue from "../../assets/images/dropdown-blue.svg";
import DropupBlue from "../../assets/images/dropup-blue.svg";
import ArrowDownBlue from '../../assets/images/arrow-down-blue.svg';
import ArrowDownGrey from '../../assets/images/arrow-down-grey.svg';
import { getBlockDeadline } from '../../helpers/web3-utils';
......@@ -584,10 +582,10 @@ class Swap extends Component {
const TOKEN_ALLOWED_SLIPPAGE = 0.04;
const type = getSwapType(inputCurrency, outputCurrency);
const { label: inputLabel, decimals: inputDecimals } = selectors().getBalance(account, inputCurrency);
const { label: outputLabel, decimals: outputDecimals } = selectors().getBalance(account, outputCurrency);
const { label: inputLabel } = selectors().getBalance(account, inputCurrency);
const { label: outputLabel } = selectors().getBalance(account, outputCurrency);
const label = lastEditedField === INPUT ? outputLabel : inputLabel;
// const label = lastEditedField === INPUT ? outputLabel : inputLabel;
let minOutput;
let maxInput;
......@@ -732,7 +730,7 @@ class Swap extends Component {
/>
<OversizedPanel>
<div className="swap__down-arrow-background">
<img onClick={this.flipInputOutput} className="swap__down-arrow swap__down-arrow--clickable" src={isValid ? ArrowDownBlue : ArrowDownGrey} />
<img onClick={this.flipInputOutput} className="swap__down-arrow swap__down-arrow--clickable" alt='swap' src={isValid ? ArrowDownBlue : ArrowDownGrey} />
</div>
</OversizedPanel>
<CurrencyInputPanel
......@@ -769,7 +767,7 @@ class Swap extends Component {
export default connect(
state => ({
balances: state.web3connect.balances,
isConnected: !!state.web3connect.account && state.web3connect.networkId == (process.env.REACT_APP_NETWORK_ID||1),
isConnected: !!state.web3connect.account && state.web3connect.networkId === (process.env.REACT_APP_NETWORK_ID||1),
account: state.web3connect.account,
web3: state.web3connect.web3,
exchangeAddresses: state.addresses.exchangeAddresses,
......
yarn.lock
View file @ 35d9254b
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment