perf(bundle-size): only import used react icons

The final size of renderer.prod.js is about 4.75mb. 2.35mb of this comes
from react-icons.

Update the react icon imports to import only the specific icons that we
use. This reduces the final size of renderer.prod.js by about 50%

app/components/Activity/InvoiceModal.js

@@ -8,7 +8,7 @@ import QRCode from 'qrcode.react'
 import copy from 'copy-to-clipboard'
 import { showNotification } from 'notifications'
 
-import { FaAngleDown } from 'react-icons/lib/fa'
+import FaAngleDown from 'react-icons/lib/fa/angle-down'
 
 import Value from 'components/Value'
 import Countdown from './Countdown'

app/components/Activity/PaymentModal.js

@@ -4,7 +4,7 @@ import PropTypes from 'prop-types'
 import Moment from 'react-moment'
 import 'moment-timezone'
 
-import { FaAngleDown } from 'react-icons/lib/fa'
+import FaAngleDown from 'react-icons/lib/fa/angle-down'
 
 import Isvg from 'react-inlinesvg'
 import paperPlane from 'icons/paper_plane.svg'

app/components/Activity/TransactionModal.js

@@ -4,7 +4,7 @@ import PropTypes from 'prop-types'
 import Moment from 'react-moment'
 import 'moment-timezone'
 
-import { FaAngleDown } from 'react-icons/lib/fa'
+import FaAngleDown from 'react-icons/lib/fa/angle-down'
 
 import Isvg from 'react-inlinesvg'
 import paperPlane from 'icons/paper_plane.svg'

app/components/Contacts/ContactModal.js

@@ -2,8 +2,8 @@ import React from 'react'
 import PropTypes from 'prop-types'
 import find from 'lodash/find'
 import ReactModal from 'react-modal'
-import { FaCircle } from 'react-icons/lib/fa'
+import FaCircle from 'react-icons/lib/fa/circle'
-import { MdClose } from 'react-icons/lib/md'
+import MdClose from 'react-icons/lib/md/close'
 
 import { btc } from 'utils'
 

app/components/Contacts/ContactsForm.js

@@ -1,8 +1,9 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import ReactModal from 'react-modal'
-import { MdClose } from 'react-icons/lib/md'
+import MdClose from 'react-icons/lib/md/close'
-import { FaCircle, FaQuestionCircle } from 'react-icons/lib/fa'
+import FaCircle from 'react-icons/lib/fa/circle'
+import FaQuestionCircle from 'react-icons/lib/fa/question-circle'
 import styles from './ContactsForm.scss'
 
 class ContactsForm extends React.Component {

app/components/Contacts/Network.js

@@ -2,7 +2,10 @@ import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 import find from 'lodash/find'
 import Isvg from 'react-inlinesvg'
-import { FaExternalLink, FaCircle, FaRepeat, FaAngleDown } from 'react-icons/lib/fa'
+import FaExternalLink from 'react-icons/lib/fa/external-link'
+import FaCircle from 'react-icons/lib/fa/circle'
+import FaRepeat from 'react-icons/lib/fa/repeat'
+import FaAngleDown from 'react-icons/lib/fa/angle-down'
 import { btc, blockExplorer } from 'utils'
 import plus from 'icons/plus.svg'
 import search from 'icons/search.svg'

app/components/Contacts/SubmitChannelForm.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 
-import { FaAngleDown } from 'react-icons/lib/fa'
+import FaAngleDown from 'react-icons/lib/fa/angle-down'
 
 import styles from './SubmitChannelForm.scss'
 

app/components/CurrencyIcon/CurrencyIcon.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { FaDollar } from 'react-icons/lib/fa'
+import FaDollar from 'react-icons/lib/fa/dollar'
 import CryptoIcon from '../CryptoIcon'
 
 const CurrencyIcon = ({ currency, crypto, styles }) => {

app/components/Form/Pay.js

@@ -5,7 +5,7 @@ import find from 'lodash/find'
 import Isvg from 'react-inlinesvg'
 import paperPlane from 'icons/paper_plane.svg'
 import link from 'icons/link.svg'
-import { FaAngleDown } from 'react-icons/lib/fa'
+import FaAngleDown from 'react-icons/lib/fa/angle-down'
 
 import { btc } from 'utils'
 

app/components/Form/Request.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types'
 
 import Isvg from 'react-inlinesvg'
 import hand from 'icons/hand.svg'
-import { FaAngleDown } from 'react-icons/lib/fa'
+import FaAngleDown from 'react-icons/lib/fa/angle-down'
 
 import { btc } from 'utils'
 import styles from './Request.scss'

app/components/GlobalError/GlobalError.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { MdClose } from 'react-icons/lib/md'
+import MdClose from 'react-icons/lib/md/close'
 import styles from './GlobalError.scss'
 
 class GlobalError extends React.Component {

app/components/Onboarding/Autopilot.js

@@ -1,6 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { FaCircle, FaCircleThin } from 'react-icons/lib/fa'
+import FaCircle from 'react-icons/lib/fa/circle'
+import FaCircleThin from 'react-icons/lib/fa/circle-thin'
 import styles from './Autopilot.scss'
 
 const Autopilot = ({ autopilot, setAutopilot }) => (

app/components/Onboarding/ConnectionType.js

@@ -1,6 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { FaCircle, FaCircleThin } from 'react-icons/lib/fa'
+import FaCircle from 'react-icons/lib/fa/circle'
+import FaCircleThin from 'react-icons/lib/fa/circle-thin'
 import styles from './ConnectionType.scss'
 
 const ConnectionType = ({ connectionType, setConnectionType }) => (

app/components/Onboarding/FormContainer.js

@@ -2,7 +2,8 @@ import React from 'react'
 import PropTypes from 'prop-types'
 import Isvg from 'react-inlinesvg'
 
-import { FaAngleLeft, FaAngleRight } from 'react-icons/lib/fa'
+import FaAngleLeft from 'react-icons/lib/fa/angle-left'
+import FaAngleRight from 'react-icons/lib/fa/angle-right'
 
 import zapLogo from 'icons/zap_logo.svg'
 import styles from './FormContainer.scss'

app/components/Onboarding/Signup.js

@@ -1,6 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { FaCircle, FaCircleThin } from 'react-icons/lib/fa'
+import FaCircle from 'react-icons/lib/fa/circle'
+import FaCircleThin from 'react-icons/lib/fa/circle-thin'
 import styles from './Signup.scss'
 
 const Signup = ({ signupForm, setSignupCreate, setSignupImport }) => (

app/components/Wallet/Wallet.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { FaAngleDown } from 'react-icons/lib/fa'
+import FaAngleDown from 'react-icons/lib/fa/angle-down'
 import Isvg from 'react-inlinesvg'
 
 import { btc, blockExplorer } from 'utils'

test/components/CurrencyIcon.spec.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import { shallow } from 'enzyme'
-import { FaDollar } from 'react-icons/lib/fa'
+import FaDollar from 'react-icons/lib/fa/dollar'
 import CryptoIcon from '../../app/components/CryptoIcon'
 import CurrencyIcon from '../../app/components/CurrencyIcon'