diff --git a/src/components/Link/index.js b/src/components/Link/index.js index 708015d4..8c782374 100644 --- a/src/components/Link/index.js +++ b/src/components/Link/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled, { css } from 'styled-components'; import PropTypes from 'prop-types'; import { FONT_SIZE, TRANSITION } from 'config/variables'; @@ -45,7 +45,7 @@ const StyledNavLink = styled(NavLink)` `} `; -class Link extends Component { +class Link extends PureComponent { render() { const shouldRenderRouterLink = this.props.to; let LinkComponent; diff --git a/src/components/images/CoinLogo/index.js b/src/components/images/CoinLogo/index.js index 472bbdd1..2e13a9c3 100644 --- a/src/components/images/CoinLogo/index.js +++ b/src/components/images/CoinLogo/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import PropTypes from 'prop-types'; @@ -13,7 +13,7 @@ const Logo = styled.img` display: block; `; -class CoinLogo extends Component { +class CoinLogo extends PureComponent { constructor() { super(); this.longIcons = ['etc', 'eth', 'trop']; diff --git a/src/components/inputs/Input/index.js b/src/components/inputs/Input/index.js index 90dec617..9c763607 100644 --- a/src/components/inputs/Input/index.js +++ b/src/components/inputs/Input/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import PropTypes from 'prop-types'; import styled, { css } from 'styled-components'; import colors from 'config/colors'; @@ -72,7 +72,7 @@ const BottomText = styled.span` color: ${props => (props.color ? props.color : colors.TEXT_SECONDARY)}; `; -class Input extends Component { +class Input extends PureComponent { getIcon(inputState) { let icon = []; if (inputState === 'success') { diff --git a/src/components/modals/confirm/UnverifiedAddress/index.js b/src/components/modals/confirm/UnverifiedAddress/index.js index 165cc166..1fae5a98 100644 --- a/src/components/modals/confirm/UnverifiedAddress/index.js +++ b/src/components/modals/confirm/UnverifiedAddress/index.js @@ -1,5 +1,5 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import { H2 } from 'components/Heading'; import P from 'components/Paragraph'; import styled from 'styled-components'; @@ -36,7 +36,7 @@ const StyledButton = styled(Button)` margin: 0 0 10px 0; `; -class ConfirmUnverifiedAddress extends Component { +class ConfirmUnverifiedAddress extends PureComponent { componentDidMount(): void { this.keyboardHandler = this.keyboardHandler.bind(this); window.addEventListener('keydown', this.keyboardHandler, false); diff --git a/src/components/modals/device/Duplicate/index.js b/src/components/modals/device/Duplicate/index.js index c259a1aa..6633a9be 100644 --- a/src/components/modals/device/Duplicate/index.js +++ b/src/components/modals/device/Duplicate/index.js @@ -1,5 +1,5 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import { H3 } from 'components/Heading'; import P from 'components/Paragraph'; @@ -62,7 +62,7 @@ const ErrorMessage = styled.div` width: 100%; `; -export default class DuplicateDevice extends Component { +export default class DuplicateDevice extends PureComponent { constructor(props: Props) { super(props); diff --git a/src/components/modals/device/Forget/index.js b/src/components/modals/device/Forget/index.js index 951c3f75..9da00a51 100644 --- a/src/components/modals/device/Forget/index.js +++ b/src/components/modals/device/Forget/index.js @@ -1,6 +1,6 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import { H3 } from 'components/Heading'; import P from 'components/Paragraph'; @@ -27,7 +27,7 @@ const Row = styled.div` padding: 10px 0; `; -class ForgetDevice extends Component { +class ForgetDevice extends PureComponent { componentDidMount() { this.keyboardHandler = this.keyboardHandler.bind(this); window.addEventListener('keydown', this.keyboardHandler, false); diff --git a/src/components/modals/device/Remember/index.js b/src/components/modals/device/Remember/index.js index 628c01eb..c4dc2c23 100644 --- a/src/components/modals/device/Remember/index.js +++ b/src/components/modals/device/Remember/index.js @@ -1,5 +1,5 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import { H3 } from 'components/Heading'; import P from 'components/Paragraph'; @@ -47,7 +47,7 @@ const StyledLoader = styled(Loader)` left: 200px; `; -export default class RememberDevice extends Component { +export default class RememberDevice extends PureComponent { constructor(props: Props) { super(props); diff --git a/src/components/modals/device/WalletType/index.js b/src/components/modals/device/WalletType/index.js index 93786c8f..fb22b318 100644 --- a/src/components/modals/device/WalletType/index.js +++ b/src/components/modals/device/WalletType/index.js @@ -1,6 +1,6 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled, { css } from 'styled-components'; import { H3 } from 'components/Heading'; import P from 'components/Paragraph'; @@ -64,7 +64,7 @@ const Content = styled.div` `} `; -class WalletType extends Component { +class WalletType extends PureComponent { constructor(props: Props) { super(props); this.keyboardHandler = this.keyboardHandler.bind(this); diff --git a/src/components/modals/index.js b/src/components/modals/index.js index 1daf6f67..9a4645cc 100644 --- a/src/components/modals/index.js +++ b/src/components/modals/index.js @@ -85,7 +85,7 @@ const ModalWindow = styled.div` text-align: center; `; -class Modal extends React.Component { +class Modal extends React.PureComponent { render() { if (!this.props.modal.opened) return null; diff --git a/src/components/modals/passphrase/Passphrase/index.js b/src/components/modals/passphrase/Passphrase/index.js index dec94bdf..9850cbd9 100644 --- a/src/components/modals/passphrase/Passphrase/index.js +++ b/src/components/modals/passphrase/Passphrase/index.js @@ -1,5 +1,5 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import colors from 'config/colors'; import { FONT_SIZE, TRANSITION } from 'config/variables'; @@ -76,7 +76,7 @@ const LinkButton = styled(Button)` } `; -class Passphrase extends Component { +class Passphrase extends PureComponent { constructor(props: Props) { super(props); diff --git a/src/components/modals/pin/Pin/index.js b/src/components/modals/pin/Pin/index.js index 1f821e66..fa1fc805 100644 --- a/src/components/modals/pin/Pin/index.js +++ b/src/components/modals/pin/Pin/index.js @@ -1,7 +1,7 @@ /* @flow */ import P from 'components/Paragraph'; import { H2 } from 'components/Heading'; -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import Link from 'components/Link'; import styled from 'styled-components'; @@ -39,7 +39,7 @@ const Footer = styled.div` flex-direction: column; `; -class Pin extends Component { +class Pin extends PureComponent { constructor(props: Props) { super(props); diff --git a/src/components/notifications/Context/components/Action/components/NotificationsGroups/components/Group/index.js b/src/components/notifications/Context/components/Action/components/NotificationsGroups/components/Group/index.js index 55128fb8..ecf11f8b 100644 --- a/src/components/notifications/Context/components/Action/components/NotificationsGroups/components/Group/index.js +++ b/src/components/notifications/Context/components/Action/components/NotificationsGroups/components/Group/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import PropTypes from 'prop-types'; import styled from 'styled-components'; import Icon from 'components/Icon'; @@ -32,7 +32,7 @@ const Title = styled.div` color: ${props => props.color}; `; -class Group extends Component { +class Group extends PureComponent { constructor() { super(); this.state = { diff --git a/src/components/notifications/Context/components/Action/components/NotificationsGroups/index.js b/src/components/notifications/Context/components/Action/components/NotificationsGroups/index.js index db936f1c..4245f41b 100644 --- a/src/components/notifications/Context/components/Action/components/NotificationsGroups/index.js +++ b/src/components/notifications/Context/components/Action/components/NotificationsGroups/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import PropTypes from 'prop-types'; @@ -6,7 +6,7 @@ import Group from './components/Group'; const Wrapper = styled.div``; -class NotificationsGroup extends Component { +class NotificationsGroup extends PureComponent { groupNotifications = notifications => notifications .reduce((acc, obj) => { const key = obj.type; diff --git a/src/support/ErrorBoundary.js b/src/support/ErrorBoundary.js index 3ee198de..e9d8701e 100644 --- a/src/support/ErrorBoundary.js +++ b/src/support/ErrorBoundary.js @@ -1,8 +1,8 @@ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import PropTypes from 'prop-types'; import RedBox from 'redbox-react'; -class ErrorBoundary extends Component { +class ErrorBoundary extends PureComponent { constructor(props) { super(props); this.state = { hasError: false, error: false }; diff --git a/src/views/Landing/components/ConnectDevice/index.js b/src/views/Landing/components/ConnectDevice/index.js index 3d249c1e..9aea96cb 100644 --- a/src/views/Landing/components/ConnectDevice/index.js +++ b/src/views/Landing/components/ConnectDevice/index.js @@ -1,6 +1,6 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled, { keyframes } from 'styled-components'; import TrezorConnect from 'trezor-connect'; import P from 'components/Paragraph'; @@ -14,7 +14,7 @@ type Props = { showWebUsb: boolean, showDisconnect: boolean, }; -class ConnectDevice extends Component { +class ConnectDevice extends PureComponent { componentDidMount() { if (this.props.showWebUsb) { TrezorConnect.renderWebUSBButton(); diff --git a/src/views/Landing/components/InstallBridge/index.js b/src/views/Landing/components/InstallBridge/index.js index c2c2bfe2..5ce43126 100644 --- a/src/views/Landing/components/InstallBridge/index.js +++ b/src/views/Landing/components/InstallBridge/index.js @@ -1,6 +1,6 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import colors from 'config/colors'; import { FONT_SIZE, FONT_WEIGHT } from 'config/variables'; @@ -118,7 +118,7 @@ const Li = styled.li` text-align: justify; `; -class InstallBridge extends Component { +class InstallBridge extends PureComponent { constructor(props: Props) { super(props); diff --git a/src/views/Wallet/components/LeftNavigation/components/CoinMenu/index.js b/src/views/Wallet/components/LeftNavigation/components/CoinMenu/index.js index 2788639c..d22b3cd5 100644 --- a/src/views/Wallet/components/LeftNavigation/components/CoinMenu/index.js +++ b/src/views/Wallet/components/LeftNavigation/components/CoinMenu/index.js @@ -3,14 +3,14 @@ import coins from 'constants/coins'; import colors from 'config/colors'; import ICONS from 'config/icons'; import PropTypes from 'prop-types'; -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import { NavLink } from 'react-router-dom'; import Divider from '../Divider'; import RowCoin from '../RowCoin'; const Wrapper = styled.div``; -class CoinMenu extends Component { +class CoinMenu extends PureComponent { getBaseUrl() { const { selectedDevice } = this.props.wallet; let baseUrl = ''; diff --git a/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/components/DeviceList/index.js b/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/components/DeviceList/index.js index e6c8baa9..9276e36e 100644 --- a/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/components/DeviceList/index.js +++ b/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/components/DeviceList/index.js @@ -1,6 +1,6 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import Icon from 'components/Icon'; import DeviceHeader from 'components/DeviceHeader'; @@ -22,7 +22,7 @@ type Props = { forgetDevice: $ElementType; }; -class DeviceList extends Component { +class DeviceList extends PureComponent { sortByInstance(a: TrezorDevice, b: TrezorDevice) { if (!a.instance || !b.instance) return -1; return a.instance > b.instance ? 1 : -1; diff --git a/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/components/MenuItems/index.js b/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/components/MenuItems/index.js index 969d3363..e00c682e 100644 --- a/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/components/MenuItems/index.js +++ b/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/components/MenuItems/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import PropTypes from 'prop-types'; import Icon from 'components/Icon'; @@ -27,7 +27,7 @@ const Label = styled.div` padding-left: 15px; `; -class MenuItems extends Component { +class MenuItems extends PureComponent { onDeviceMenuClick(action, device) { if (action === 'reload') { this.props.acquireDevice(); diff --git a/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/index.js b/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/index.js index af12c149..9cdc96be 100644 --- a/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/index.js +++ b/src/views/Wallet/components/LeftNavigation/components/DeviceMenu/index.js @@ -1,5 +1,5 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import TrezorConnect from 'trezor-connect'; import type { TrezorDevice } from 'flowtype'; @@ -27,7 +27,7 @@ type DeviceMenuItem = { label: string; } -class DeviceMenu extends Component { +class DeviceMenu extends PureComponent { constructor(props: Props) { super(props); this.mouseDownHandler = this.mouseDownHandler.bind(this); diff --git a/src/views/Wallet/components/TopNavigationAccount/components/Indicator/index.js b/src/views/Wallet/components/TopNavigationAccount/components/Indicator/index.js index 7c036207..75045d74 100644 --- a/src/views/Wallet/components/TopNavigationAccount/components/Indicator/index.js +++ b/src/views/Wallet/components/TopNavigationAccount/components/Indicator/index.js @@ -2,7 +2,7 @@ import styled from 'styled-components'; import colors from 'config/colors'; -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; type Props = { @@ -25,7 +25,7 @@ const Wrapper = styled.div` transition: all 0.3s ease-in-out; `; -class Indicator extends Component { +class Indicator extends PureComponent { constructor(props: Props) { super(props); diff --git a/src/views/Wallet/views/Account/Send/components/PendingTransactions/index.js b/src/views/Wallet/views/Account/Send/components/PendingTransactions/index.js index c1bcc78c..418c3a0c 100644 --- a/src/views/Wallet/views/Account/Send/components/PendingTransactions/index.js +++ b/src/views/Wallet/views/Account/Send/components/PendingTransactions/index.js @@ -1,5 +1,5 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import colors from 'config/colors'; import ColorHash from 'color-hash'; @@ -67,7 +67,7 @@ const TransactionAmount = styled.div` color: colors.TEXT_SECONDARY; `; -class PendingTransactions extends Component { +class PendingTransactions extends PureComponent { getPendingTransactions() { return this.props.pending.filter(tx => !tx.rejected); } diff --git a/src/views/Wallet/views/Account/Summary/components/Balance/index.js b/src/views/Wallet/views/Account/Summary/components/Balance/index.js index 243b48d5..09e38769 100644 --- a/src/views/Wallet/views/Account/Summary/components/Balance/index.js +++ b/src/views/Wallet/views/Account/Summary/components/Balance/index.js @@ -1,5 +1,5 @@ /* @flow */ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import BigNumber from 'bignumber.js'; import styled from 'styled-components'; import Icon from 'components/Icon'; @@ -88,7 +88,7 @@ const Label = styled.div` `; -class AccountBalance extends Component { +class AccountBalance extends PureComponent { constructor(props: Props) { super(props); this.state = { diff --git a/src/views/Wallet/views/Account/Summary/components/Token/index.js b/src/views/Wallet/views/Account/Summary/components/Token/index.js index 7291b348..11c616a8 100644 --- a/src/views/Wallet/views/Account/Summary/components/Token/index.js +++ b/src/views/Wallet/views/Account/Summary/components/Token/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { PureComponent } from 'react'; import styled from 'styled-components'; import ColorHash from 'color-hash'; import ScaleText from 'react-scale-text'; @@ -50,7 +50,7 @@ const RemoveTokenButton = styled(Button)` padding: 0 0 0 10px; `; -class AddedToken extends Component<> { +class AddedToken extends PureComponent { getTokenBalance(token) { const pendingAmount = stateUtils.getPendingAmount(this.props.pending, token.symbol, true); const balance = new BigNumber(token.balance).minus(pendingAmount).toString(10);