/ common / components / SendEverything / SendEverything.tsx
SendEverything.tsx
 1  import React, { Component } from 'react';
 2  import { connect } from 'react-redux';
 3  
 4  import translate, { translateRaw } from 'translations';
 5  import { TokenValue, Wei } from 'libs/units';
 6  import { AppState } from 'features/reducers';
 7  import { sendEverythingRequested, TSendEverythingRequested } from 'features/transaction/actions';
 8  import * as selectors from 'features/selectors';
 9  import { Query } from 'components/renderCbs';
10  import { Tooltip } from 'components/ui';
11  import './SendEverything.scss';
12  
13  interface DispatchProps {
14    sendEverythingRequested: TSendEverythingRequested;
15  }
16  interface StateProps {
17    currentBalance: Wei | TokenValue | null;
18  }
19  type Props = StateProps & DispatchProps;
20  
21  class SendEverythingClass extends Component<Props> {
22    public render() {
23      const { currentBalance } = this.props;
24  
25      return (
26        <Query
27          params={['readOnly']}
28          withQuery={({ readOnly }) => (
29            <button
30              className="SendEverything"
31              disabled={!!readOnly || !currentBalance}
32              onClick={this.onSendEverything}
33              aria-label={translateRaw('SEND_TRANSFERTOTAL')}
34            >
35              <i className="SendEverything-icon fa fa-angle-double-up" />
36              <Tooltip>{translate('SEND_TRANSFERTOTAL')}</Tooltip>
37            </button>
38          )}
39        />
40      );
41    }
42    private onSendEverything = () => {
43      this.props.sendEverythingRequested();
44    };
45  }
46  export const SendEverything = connect(
47    (state: AppState) => ({ currentBalance: selectors.getCurrentBalance(state) }),
48    { sendEverythingRequested }
49  )(SendEverythingClass);