MyCrypto/common/containers/Tabs/Swap/components/BitcoinQR.tsx

import React, { PureComponent } from 'react';
import QRCode from 'qrcode.react';
import './BitcoinQR.scss';

interface Props {
  paymentAddress: string | null;
  destinationAmount: number;
}

export default class BitcoinQR extends PureComponent<Props, {}> {
  public render() {
    const { paymentAddress, destinationAmount } = this.props;
    return (
      <div className="BitcoinQR">
        <section className="row block swap-address text-center">
          <label> Your Address </label>
          <div className="BitcoinQR-qr">
            <QRCode value={`bitcoin:${paymentAddress}amount=${destinationAmount}`} />
          </div>
          <br />
          <p className="text-danger">
            Orders that take too long will have to be processed manually &amp; and may delay the
            amount of time it takes to receive your coins.
            <br />
            <a href="https://shapeshift.io/#/btcfee" target="_blank" rel="noopener noreferrer">
              Please use the recommended TX fees seen here.
            </a>
          </p>
        </section>
      </div>
    );
  }
}