From a577cdf05a06d8f235bc4b937f58a8e8684b1b5c Mon Sep 17 00:00:00 2001
From: Tom Kirkpatrick <tkp@kirkdesigns.co.uk>
Date: Sat, 3 Nov 2018 12:02:09 +0100
Subject: [PATCH 1/2] fix(wallet): improve fee estimate presentation

---
 app/components/Pay/PaySummaryLightning.js     | 31 ++++++++++++-------
 app/components/Pay/PaySummaryOnChain.js       |  4 +--
 app/components/Pay/messages.js                |  9 +++---
 app/lib/utils/crypto.js                       |  6 ++--
 .../PaySummaryLightning.spec.js.snap          | 10 ++++--
 .../PaySummaryOnchain.spec.js.snap            |  2 +-
 6 files changed, 39 insertions(+), 23 deletions(-)

diff --git a/app/components/Pay/PaySummaryLightning.js b/app/components/Pay/PaySummaryLightning.js
index 77556042..d39dbd9a 100644
--- a/app/components/Pay/PaySummaryLightning.js
+++ b/app/components/Pay/PaySummaryLightning.js
@@ -78,6 +78,23 @@ class PaySummaryLightning extends React.PureComponent {
     const fiatAmount = satoshisToFiat(satoshis, currentTicker[fiatCurrency].last)
     const nodeAlias = getNodeAlias(payeeNodeKey, nodes)
 
+    // Select an appropriate fee message...
+    // Default to unknown.
+    let feeMessage = messages.fee_unknown
+
+    // If thex max fee is 0 or 1 then show a message like "less than 1".
+    if (maxFee === 0 || maxFee === 1) {
+      feeMessage = messages.fee_less_than_1
+    }
+    // Otherwise, if we have both a min and max fee that are different, present the fee range.
+    else if (minFee !== null && maxFee !== null && minFee !== maxFee) {
+      feeMessage = messages.fee_range
+    }
+    // Finally, if we at least have a max fee then present it as upto that amount.
+    else if (maxFee) {
+      feeMessage = messages.fee_upto
+    }
+
     return (
       <React.Fragment>
         <Box pb={2}>
@@ -108,7 +125,7 @@ class PaySummaryLightning extends React.PureComponent {
             </Box>
             <Box width={5 / 11}>
               <Text textAlign="right" className="hint--bottom-left" data-hint={payeeNodeKey}>
-                {<Truncate text={nodeAlias || payeeNodeKey} />}
+                {<Truncate text={nodeAlias || payeeNodeKey} maxlen={nodeAlias ? 30 : 15} />}
               </Text>
             </Box>
           </Flex>
@@ -127,10 +144,8 @@ class PaySummaryLightning extends React.PureComponent {
                 </Text>
                 <Spinner color="lightningOrange" />
               </Flex>
-            ) : minFee === null || maxFee === null ? (
-              <FormattedMessage {...messages.unknown} />
             ) : (
-              <FormattedMessage {...messages.fee_range} values={{ minFee, maxFee }} />
+              feeMessage && <FormattedMessage {...feeMessage} values={{ minFee, maxFee }} />
             )
           }
         />
@@ -141,13 +156,7 @@ class PaySummaryLightning extends React.PureComponent {
           left={<FormattedMessage {...messages.total} />}
           right={
             <React.Fragment>
-              <Value value={satoshis} currency={cryptoCurrency} /> {cryptoCurrencyTicker}
-              {!isQueryingRoutes &&
-                maxFee && (
-                  <Text fontSize="s">
-                    (+ <FormattedMessage {...messages.upto} /> {maxFee} msats)
-                  </Text>
-                )}
+              <Value value={satoshis + maxFee} currency={cryptoCurrency} /> {cryptoCurrencyTicker}
             </React.Fragment>
           }
         />
diff --git a/app/components/Pay/PaySummaryOnChain.js b/app/components/Pay/PaySummaryOnChain.js
index 9799f320..97ccc439 100644
--- a/app/components/Pay/PaySummaryOnChain.js
+++ b/app/components/Pay/PaySummaryOnChain.js
@@ -122,11 +122,11 @@ class PaySummaryOnChain extends React.Component {
                 <Spinner color="lightningOrange" />
               </Flex>
             ) : !fee ? (
-              <FormattedMessage {...messages.unknown} />
+              <FormattedMessage {...messages.fee_unknown} />
             ) : (
               <React.Fragment>
                 <Text>
-                  {fee} satoshis <FormattedMessage {...messages.per_byte} />
+                  {fee} satoshis <FormattedMessage {...messages.fee_per_byte} />
                 </Text>
                 <Text fontSize="s">
                   (<FormattedMessage {...messages.next_block_confirmation} />)
diff --git a/app/components/Pay/messages.js b/app/components/Pay/messages.js
index 173a8134..25458593 100644
--- a/app/components/Pay/messages.js
+++ b/app/components/Pay/messages.js
@@ -15,11 +15,12 @@ export default defineMessages({
   back: 'Back',
   send: 'Send',
   fee: 'Fee',
-  fee_range: 'between {minFee} and {maxFee} msat',
-  unknown: 'unknown',
+  fee_less_than_1: 'less than 1 satoshi',
+  fee_range: 'between {minFee} and {maxFee} satoshis',
+  fee_upto: 'up to {maxFee} satoshi',
+  fee_unknown: 'unknown',
+  fee_per_byte: 'per byte',
   amount: 'Amount',
-  per_byte: 'per byte',
-  upto: 'up to',
   total: 'Total',
   memo: 'Memo',
   description:
diff --git a/app/lib/utils/crypto.js b/app/lib/utils/crypto.js
index 39b3a74d..bd327c1a 100644
--- a/app/lib/utils/crypto.js
+++ b/app/lib/utils/crypto.js
@@ -150,13 +150,13 @@ export const getNodeAlias = (pubkey, nodes = []) => {
 /**
  * Given a list of routest, find the minimum fee.
  * @param {QueryRoutesResponse} routes
- * @return {Number} minimum fee.
+ * @return {Number} minimum fee rounded up to the nearest satoshi.
  */
 export const getMinFee = (routes = []) => {
   if (!routes || !routes.length) {
     return null
   }
-  return routes.reduce((min, b) => Math.min(min, b.total_fees_msat), routes[0].total_fees_msat)
+  return routes.reduce((min, b) => Math.min(min, b.total_fees), routes[0].total_fees)
 }
 
 /**
@@ -168,7 +168,7 @@ export const getMaxFee = routes => {
   if (!routes || !routes.length) {
     return null
   }
-  return routes.reduce((max, b) => Math.max(max, b.total_fees_msat), routes[0].total_fees_msat)
+  return routes.reduce((max, b) => Math.max(max, b.total_fees), routes[0].total_fees)
 }
 
 /**
diff --git a/test/unit/components/Pay/__snapshots__/PaySummaryLightning.spec.js.snap b/test/unit/components/Pay/__snapshots__/PaySummaryLightning.spec.js.snap
index 2b7e6a7c..56a39e9c 100644
--- a/test/unit/components/Pay/__snapshots__/PaySummaryLightning.spec.js.snap
+++ b/test/unit/components/Pay/__snapshots__/PaySummaryLightning.spec.js.snap
@@ -81,6 +81,7 @@ exports[`component.Form.PaySummaryLightning should render correctly 1`] = `
           textAlign="right"
         >
           <Truncate
+            maxlen={15}
             text="03c856d2dbec7454c48f311031f06bb99e3ca1ab15a9b9b35de14e139aa663b463"
           />
         </Text>
@@ -99,8 +100,13 @@ exports[`component.Form.PaySummaryLightning should render correctly 1`] = `
     right={
       <FormattedMessage
         defaultMessage="unknown"
-        id="components.Pay.unknown"
-        values={Object {}}
+        id="components.Pay.fee_unknown"
+        values={
+          Object {
+            "maxFee": null,
+            "minFee": null,
+          }
+        }
       />
     }
   />
diff --git a/test/unit/components/Pay/__snapshots__/PaySummaryOnchain.spec.js.snap b/test/unit/components/Pay/__snapshots__/PaySummaryOnchain.spec.js.snap
index 0849acec..9dfbcd42 100644
--- a/test/unit/components/Pay/__snapshots__/PaySummaryOnchain.spec.js.snap
+++ b/test/unit/components/Pay/__snapshots__/PaySummaryOnchain.spec.js.snap
@@ -99,7 +99,7 @@ exports[`component.Form.PaySummaryOnchain should render correctly 1`] = `
     right={
       <FormattedMessage
         defaultMessage="unknown"
-        id="components.Pay.unknown"
+        id="components.Pay.fee_unknown"
         values={Object {}}
       />
     }

From 145899aa6bf2257dc653693921ec34a68b549b7e Mon Sep 17 00:00:00 2001
From: Tom Kirkpatrick <tkp@kirkdesigns.co.uk>
Date: Fri, 2 Nov 2018 12:51:49 +0100
Subject: [PATCH 2/2] refactor: remove old pay forms

---
 app/components/Form/Pay/Pay.js      | 217 ----------------------
 app/components/Form/Pay/Pay.scss    | 122 -------------
 app/components/Form/Pay/index.js    |   3 -
 app/components/Form/Pay/messages.js |  11 --
 app/containers/Activity.js          |   3 +-
 app/containers/App.js               |  97 +---------
 app/reducers/index.js               |   2 -
 app/reducers/invoice.js             |   7 -
 app/reducers/ipc.js                 |   9 +-
 app/reducers/payform.js             | 268 ----------------------------
 app/reducers/payment.js             |  15 +-
 app/reducers/requestform.js         |   2 +-
 app/reducers/transaction.js         |   4 -
 test/unit/components/Form.spec.js   |  41 +----
 14 files changed, 15 insertions(+), 786 deletions(-)
 delete mode 100644 app/components/Form/Pay/Pay.js
 delete mode 100644 app/components/Form/Pay/Pay.scss
 delete mode 100644 app/components/Form/Pay/index.js
 delete mode 100644 app/components/Form/Pay/messages.js
 delete mode 100644 app/reducers/payform.js

diff --git a/app/components/Form/Pay/Pay.js b/app/components/Form/Pay/Pay.js
deleted file mode 100644
index 0f7779f1..00000000
--- a/app/components/Form/Pay/Pay.js
+++ /dev/null
@@ -1,217 +0,0 @@
-import React, { Component } from 'react'
-import PropTypes from 'prop-types'
-import { btc } from 'lib/utils'
-import PaperPlane from 'components/Icon/PaperPlane'
-import ChainLink from 'components/Icon/ChainLink'
-import AmountInput from 'components/AmountInput'
-import { Button, Dropdown } from 'components/UI'
-import { FormattedNumber, FormattedMessage, injectIntl } from 'react-intl'
-import messages from './messages'
-import styles from './Pay.scss'
-
-class Pay extends Component {
-  constructor(props) {
-    super(props)
-    this.paymentRequestInput = React.createRef()
-  }
-
-  componentDidMount() {
-    const { setPayInput, setPayAmount } = this.props
-
-    // Clear the form of any previous data.
-    setPayInput('')
-    setPayAmount('')
-
-    // Focus the payment request input field.
-    this.paymentRequestInput.current.focus()
-  }
-
-  componentDidUpdate(prevProps) {
-    const {
-      isLn,
-      payform: { payInput },
-      fetchInvoice
-    } = this.props
-
-    // If LN go retrieve invoice details
-    if (prevProps.payform.payInput !== payInput && isLn) {
-      fetchInvoice(payInput)
-    }
-  }
-
-  render() {
-    const {
-      payform: { payInput, showErrors, invoice },
-      nodes,
-      ticker,
-      isOnchain,
-      isLn,
-      currentAmount,
-      fiatAmount,
-      payFormIsValid: { errors, isValid },
-      currencyFilters,
-      setPayAmount,
-      onPayAmountBlur,
-      setPayInput,
-      onPayInputBlur,
-      onPaySubmit,
-      setCurrency,
-      intl
-    } = this.props
-
-    const displayNodeName = pubkey => {
-      const node = nodes.find(n => n.pub_key === pubkey)
-
-      if (node && node.alias.length) {
-        return node.alias
-      }
-
-      return pubkey ? pubkey.substring(0, 10) : ''
-    }
-
-    const onCurrencyFilterClick = currency => {
-      if (!isLn) {
-        // change the input amount
-        setPayAmount(btc.convert(ticker.currency, currency, currentAmount))
-      }
-      setCurrency(currency)
-    }
-
-    return (
-      <div className={styles.container}>
-        <header className={styles.header}>
-          <PaperPlane width="2em" height="2em" />
-          <h1>
-            <FormattedMessage {...messages.title} />
-          </h1>
-        </header>
-
-        <div className={styles.content}>
-          <section className={styles.destination}>
-            <div className={styles.top}>
-              <label htmlFor="paymentRequest">
-                <FormattedMessage {...messages.destination} />
-              </label>
-              <span
-                className={`${styles.description} ${isOnchain || isLn ? styles.active : undefined}`}
-              >
-                {isOnchain && (
-                  <i>
-                    <ChainLink />
-                    <span>
-                      <FormattedMessage {...messages.onchain_description} />
-                    </span>
-                  </i>
-                )}
-                {isLn && (
-                  <i>
-                    <span>
-                      {displayNodeName(invoice.destination)} ({invoice.description})
-                    </span>
-                  </i>
-                )}
-              </span>
-            </div>
-            <div className={styles.bottom}>
-              <textarea
-                type="text"
-                placeholder={intl.formatMessage({ ...messages.request_placeholder })}
-                value={payInput}
-                onChange={event => setPayInput(event.target.value)}
-                onBlur={onPayInputBlur}
-                id="paymentRequest"
-                rows="4"
-                ref={this.paymentRequestInput}
-              />
-              <section
-                className={`${styles.errorMessage} ${
-                  showErrors.payInput ? styles.active : undefined
-                }`}
-              >
-                {showErrors.payInput && <span>{errors.payInput}</span>}
-              </section>
-            </div>
-          </section>
-
-          <section className={styles.amount}>
-            <div className={styles.top}>
-              <label htmlFor="amount">
-                <FormattedMessage {...messages.amount} />
-              </label>
-              <span />
-            </div>
-            <div className={styles.bottom}>
-              <AmountInput
-                id="amount"
-                amount={currentAmount}
-                currency={ticker.currency}
-                onChangeEvent={setPayAmount}
-                onBlurEvent={onPayAmountBlur}
-                readOnly={isLn}
-              />
-              <Dropdown
-                activeKey={ticker.currency}
-                items={currencyFilters}
-                onChange={onCurrencyFilterClick}
-                ml={2}
-              />
-            </div>
-
-            <div className={styles.fiatAmount}>
-              {'≈ '}
-              <FormattedNumber
-                currency={ticker.fiatTicker}
-                style="currency"
-                value={fiatAmount || 0}
-              />
-            </div>
-
-            <section
-              className={`${styles.errorMessage} ${styles.amount} ${
-                showErrors.amount ? styles.active : undefined
-              }`}
-            >
-              {showErrors.amount && <span>{errors.amount}</span>}
-            </section>
-          </section>
-
-          <section className={styles.submit}>
-            <Button disabled={!isValid} onClick={onPaySubmit} width={200}>
-              <FormattedMessage {...messages.pay} />
-            </Button>
-          </section>
-        </div>
-      </div>
-    )
-  }
-}
-
-Pay.propTypes = {
-  payform: PropTypes.shape({
-    amount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    payInput: PropTypes.string.isRequired,
-    invoice: PropTypes.object.isRequired,
-    showErrors: PropTypes.object.isRequired
-  }).isRequired,
-  currencyName: PropTypes.string.isRequired,
-  isOnchain: PropTypes.bool.isRequired,
-  isLn: PropTypes.bool.isRequired,
-  currentAmount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  fiatAmount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  payFormIsValid: PropTypes.shape({
-    errors: PropTypes.object,
-    isValid: PropTypes.bool
-  }).isRequired,
-  setPayAmount: PropTypes.func.isRequired,
-  onPayAmountBlur: PropTypes.func.isRequired,
-  setPayInput: PropTypes.func.isRequired,
-  onPayInputBlur: PropTypes.func.isRequired,
-  fetchInvoice: PropTypes.func.isRequired,
-  onPaySubmit: PropTypes.func.isRequired,
-  setCurrency: PropTypes.func.isRequired,
-  ticker: PropTypes.object.isRequired,
-  nodes: PropTypes.array.isRequired,
-  currencyFilters: PropTypes.array.isRequired
-}
-
-export default injectIntl(Pay)
diff --git a/app/components/Form/Pay/Pay.scss b/app/components/Form/Pay/Pay.scss
deleted file mode 100644
index 609dfba4..00000000
--- a/app/components/Form/Pay/Pay.scss
+++ /dev/null
@@ -1,122 +0,0 @@
-@import 'styles/variables.scss';
-
-.container {
-  margin: 0 auto;
-  width: 500px;
-}
-
-.header {
-  text-align: center;
-  padding-bottom: 20px;
-  color: var(--primaryText);
-  border-bottom: 1px solid $spaceborder;
-
-  h1 {
-    font-size: 22px;
-    font-weight: 100;
-    margin-top: 10px;
-    letter-spacing: 1.5px;
-  }
-}
-
-.content {
-  margin-top: 40px;
-  color: var(--primaryText);
-
-  .destination {
-    margin-bottom: 10px;
-
-    .description {
-      font-size: 12px;
-      line-height: 14px;
-      padding: 0 15px;
-      min-height: 14px;
-
-      &.active {
-        background: var(--lightBackground);
-        border-radius: 10px;
-        min-height: 0;
-      }
-    }
-
-    svg {
-      width: 10px;
-      height: 10px;
-      line-height: 14px;
-      margin-right: 5px;
-    }
-  }
-
-  .amount .bottom {
-    display: flex;
-    align-items: center;
-
-    input {
-      font-size: 20px;
-      max-width: 150px;
-      border: 1px solid #404040;
-      border-radius: 4px;
-      padding: 15px;
-    }
-  }
-
-  .top {
-    margin-bottom: 10px;
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: center;
-
-    label {
-      font-size: 14px;
-    }
-  }
-
-  .bottom {
-    input,
-    textarea {
-      background: transparent;
-      outline: none;
-      border: 1px solid #404040;
-      color: var(--lightningOrange);
-      -webkit-text-fill-color: var(--primaryText);
-      font-size: 12px;
-      width: 100%;
-      font-weight: 200;
-      padding: 10px;
-    }
-
-    input::-webkit-input-placeholder,
-    textarea::-webkit-input-placeholder {
-      text-shadow: none;
-      -webkit-text-fill-color: initial;
-    }
-  }
-
-  .fiatAmount {
-    margin-top: 10px;
-    opacity: 0.5;
-    font-size: 14px;
-  }
-
-  .submit {
-    margin-top: 20px;
-    text-align: center;
-  }
-}
-
-.errorMessage {
-  color: var(--superRed);
-  font-size: 12px;
-  min-height: 20px;
-  opacity: 0;
-  transition: all 0.25s ease;
-
-  &.amount {
-    margin-top: 10px;
-  }
-
-  &.active {
-    opacity: 1;
-  }
-}
diff --git a/app/components/Form/Pay/index.js b/app/components/Form/Pay/index.js
deleted file mode 100644
index 89680350..00000000
--- a/app/components/Form/Pay/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import Pay from './Pay'
-
-export default Pay
diff --git a/app/components/Form/Pay/messages.js b/app/components/Form/Pay/messages.js
deleted file mode 100644
index 1d7d2664..00000000
--- a/app/components/Form/Pay/messages.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { defineMessages } from 'react-intl'
-
-/* eslint-disable max-len */
-export default defineMessages({
-  title: 'Make Payment',
-  destination: 'Destination',
-  amount: 'Amount',
-  request_placeholder: 'Paste payment request or bitcoin address here',
-  pay: 'Pay',
-  onchain_description: 'On-Chain (~10 minutes)'
-})
diff --git a/app/containers/Activity.js b/app/containers/Activity.js
index e6d22246..6f529967 100644
--- a/app/containers/Activity.js
+++ b/app/containers/Activity.js
@@ -19,7 +19,6 @@ import {
 } from 'reducers/activity'
 import { walletAddress, openWalletModal } from 'reducers/address'
 import { setFormType } from 'reducers/form'
-import { payFormSelectors } from 'reducers/payform'
 import { setSettingsOpen, setActiveSubMenu, disableSubMenu } from 'reducers/settings'
 import { setTheme, themeSelectors } from 'reducers/theme'
 
@@ -82,7 +81,7 @@ const mapStateToProps = state => ({
   nonActiveFilters: activitySelectors.nonActiveFilters(state),
   showExpiredToggle: activitySelectors.showExpiredToggle(state),
 
-  showPayLoadingScreen: payFormSelectors.showPayLoadingScreen(state)
+  showPayLoadingScreen: paymentSelectors.showPayLoadingScreen(state)
 })
 
 const mergeProps = (stateProps, dispatchProps, ownProps) => ({
diff --git a/app/containers/App.js b/app/containers/App.js
index 7eb9b928..84574e85 100644
--- a/app/containers/App.js
+++ b/app/containers/App.js
@@ -9,10 +9,7 @@ import { setCurrency, tickerSelectors } from 'reducers/ticker'
 import { closeWalletModal } from 'reducers/address'
 import { fetchInfo, infoSelectors } from 'reducers/info'
 import { setFormType } from 'reducers/form'
-import { setPayAmount, setPayInput, updatePayErrors, payFormSelectors } from 'reducers/payform'
 import { setRequestAmount, setRequestMemo, requestFormSelectors } from 'reducers/requestform'
-import { sendCoins } from 'reducers/transaction'
-import { payInvoice } from 'reducers/payment'
 import { createInvoice, fetchInvoice } from 'reducers/invoice'
 import { lndSelectors } from 'reducers/lnd'
 import {
@@ -55,13 +52,8 @@ const mapDispatchToProps = {
   closeWalletModal,
   fetchInfo,
   setFormType,
-  setPayAmount,
-  setPayInput,
-  updatePayErrors,
   setRequestAmount,
   setRequestMemo,
-  sendCoins,
-  payInvoice,
   createInvoice,
   fetchInvoice,
   clearError,
@@ -104,7 +96,6 @@ const mapStateToProps = state => ({
   contactsform: state.contactsform,
   balance: state.balance,
   form: state.form,
-  payform: state.payform,
   requestform: state.requestform,
   invoice: state.invoice,
   error: state.error,
@@ -123,15 +114,6 @@ const mapStateToProps = state => ({
   currentTicker: tickerSelectors.currentTicker(state),
   currencyFilters: tickerSelectors.currencyFilters(state),
   currencyName: tickerSelectors.currencyName(state),
-
-  isOnchain: payFormSelectors.isOnchain(state),
-  isLn: payFormSelectors.isLn(state),
-  currentAmount: payFormSelectors.currentAmount(state),
-  fiatAmount: payFormSelectors.fiatAmount(state),
-  inputCaption: payFormSelectors.inputCaption(state),
-  showPayLoadingScreen: payFormSelectors.showPayLoadingScreen(state),
-  payFormIsValid: payFormSelectors.payFormIsValid(state),
-  payInputMin: payFormSelectors.payInputMin(state),
   requestFiatAmount: requestFormSelectors.fiatAmount(state),
   syncPercentage: lndSelectors.syncPercentage(state),
 
@@ -150,80 +132,6 @@ const mapStateToProps = state => ({
 })
 
 const mergeProps = (stateProps, dispatchProps, ownProps) => {
-  const payFormProps = {
-    payform: stateProps.payform,
-    currency: stateProps.ticker.currency,
-    crypto: stateProps.ticker.crypto,
-    nodes: stateProps.network.nodes,
-    ticker: stateProps.ticker,
-
-    isOnchain: stateProps.isOnchain,
-    isLn: stateProps.isLn,
-    currentAmount: stateProps.currentAmount,
-    fiatAmount: stateProps.fiatAmount,
-    inputCaption: stateProps.inputCaption,
-    showPayLoadingScreen: stateProps.showPayLoadingScreen,
-    payFormIsValid: stateProps.payFormIsValid,
-    payInputMin: stateProps.payInputMin,
-    currencyFilters: stateProps.currencyFilters,
-    currencyName: stateProps.currencyName,
-
-    setPayAmount: dispatchProps.setPayAmount,
-    setPayInput: dispatchProps.setPayInput,
-    fetchInvoice: dispatchProps.fetchInvoice,
-    setCurrency: dispatchProps.setCurrency,
-
-    onPayAmountBlur: () => {
-      // If the amount is now valid and showErrors was on, turn it off
-      if (stateProps.payFormIsValid.amountIsValid && stateProps.payform.showErrors.amount) {
-        dispatchProps.updatePayErrors({ amount: false })
-      }
-
-      // If the amount is not valid and showErrors was off, turn it on
-      if (!stateProps.payFormIsValid.amountIsValid && !stateProps.payform.showErrors.amount) {
-        dispatchProps.updatePayErrors({ amount: true })
-      }
-    },
-
-    onPayInputBlur: () => {
-      // If the input is now valid and showErrors was on, turn it off
-      if (stateProps.payFormIsValid.payInputIsValid && stateProps.payform.showErrors.payInput) {
-        dispatchProps.updatePayErrors({ payInput: false })
-      }
-
-      // If the input is not valid and showErrors was off, turn it on
-      if (!stateProps.payFormIsValid.payInputIsValid && !stateProps.payform.showErrors.payInput) {
-        dispatchProps.updatePayErrors({ payInput: true })
-      }
-    },
-
-    onPaySubmit: () => {
-      if (!stateProps.payFormIsValid.isValid) {
-        dispatchProps.updatePayErrors({
-          amount: Object.prototype.hasOwnProperty.call(stateProps.payFormIsValid.errors, 'amount'),
-          payInput: Object.prototype.hasOwnProperty.call(
-            stateProps.payFormIsValid.errors,
-            'payInput'
-          )
-        })
-
-        return
-      }
-
-      if (stateProps.isOnchain) {
-        dispatchProps.sendCoins({
-          value: stateProps.payform.amount,
-          addr: stateProps.payform.payInput,
-          currency: stateProps.ticker.currency
-        })
-      }
-
-      if (stateProps.isLn) {
-        dispatchProps.payInvoice(stateProps.payform.payInput)
-      }
-    }
-  }
-
   const requestFormProps = {
     requestform: stateProps.requestform,
     ticker: stateProps.ticker,
@@ -249,9 +157,6 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
       return {}
     }
 
-    if (formType === 'PAY_FORM') {
-      return payFormProps
-    }
     if (formType === 'REQUEST_FORM') {
       return requestFormProps
     }
@@ -419,7 +324,7 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
     connectManuallyProps,
     // props for the channel form wrapper
     channelFormProps,
-    // Props to pass to the pay form
+    // Props to pass to the request form
     formProps: formProps(stateProps.form.formType),
     // action to close form
     closeForm: () => dispatchProps.setFormType(null)
diff --git a/app/reducers/index.js b/app/reducers/index.js
index 7a9ddcbc..35b38af7 100644
--- a/app/reducers/index.js
+++ b/app/reducers/index.js
@@ -14,7 +14,6 @@ import channels from './channels'
 import contactsform from './contactsform'
 import form from './form'
 import pay from './pay'
-import payform from './payform'
 import requestform from './requestform'
 import invoice from './invoice'
 import address from './address'
@@ -44,7 +43,6 @@ const rootReducer = combineReducers({
   contactsform,
   form,
   pay,
-  payform,
   requestform,
   invoice,
   address,
diff --git a/app/reducers/invoice.js b/app/reducers/invoice.js
index 64bf5387..f62a9c37 100644
--- a/app/reducers/invoice.js
+++ b/app/reducers/invoice.js
@@ -9,7 +9,6 @@ import { btc } from 'lib/utils'
 import { showActivityModal } from './activity'
 import { fetchBalance } from './balance'
 import { setFormType } from './form'
-import { setPayInvoice } from './payform'
 import { resetRequestForm } from './requestform'
 import { setError } from './error'
 
@@ -92,12 +91,6 @@ export const fetchInvoice = payreq => dispatch => {
   ipcRenderer.send('lnd', { msg: 'invoice', data: { payreq } })
 }
 
-// Receive IPC event for form invoice
-export const receiveFormInvoice = (event, invoice) => dispatch => {
-  dispatch(setPayInvoice(invoice))
-  dispatch({ type: RECEIVE_FORM_INVOICE })
-}
-
 // Send IPC event for invoices
 export const fetchInvoices = () => dispatch => {
   dispatch(getInvoices())
diff --git a/app/reducers/ipc.js b/app/reducers/ipc.js
index 0d37def7..7c5e626c 100644
--- a/app/reducers/ipc.js
+++ b/app/reducers/ipc.js
@@ -29,13 +29,7 @@ import {
 } from './channels'
 import { lightningPaymentUri, queryRoutesSuccess, queryRoutesFailure } from './pay'
 import { receivePayments, paymentSuccessful, paymentFailed } from './payment'
-import {
-  receiveInvoices,
-  createdInvoice,
-  receiveFormInvoice,
-  invoiceUpdate,
-  invoiceFailed
-} from './invoice'
+import { receiveInvoices, createdInvoice, invoiceUpdate, invoiceFailed } from './invoice'
 import { receiveBalance } from './balance'
 import {
   receiveTransactions,
@@ -75,7 +69,6 @@ const ipc = createIpc({
   receivePayments,
 
   receiveInvoices,
-  receiveInvoice: receiveFormInvoice,
   createdInvoice,
   invoiceFailed,
   invoiceUpdate,
diff --git a/app/reducers/payform.js b/app/reducers/payform.js
deleted file mode 100644
index 62262152..00000000
--- a/app/reducers/payform.js
+++ /dev/null
@@ -1,268 +0,0 @@
-import { createSelector } from 'reselect'
-import bitcoin from 'bitcoinjs-lib'
-import { btc, bech32 } from 'lib/utils'
-import { setFormType } from './form'
-import { tickerSelectors } from './ticker'
-import { infoSelectors } from './info'
-
-// Initial State
-const initialState = {
-  amount: '',
-  payInput: '',
-
-  invoice: {
-    payreq: '',
-    r_hash: '',
-    amount: '0',
-    description: '',
-    destination: ''
-  },
-
-  showErrors: {
-    amount: false,
-    payInput: false
-  }
-}
-
-// Constants
-// ------------------------------------
-export const SET_PAY_AMOUNT = 'SET_PAY_AMOUNT'
-export const SET_PAY_INPUT = 'SET_PAY_INPUT'
-export const SET_PAY_INVOICE = 'SET_PAY_INVOICE'
-export const UPDATE_PAY_ERRORS = 'UPDATE_PAY_ERRORS'
-export const RESET_FORM = 'RESET_FORM'
-
-// ------------------------------------
-// Actions
-// ------------------------------------
-export function setPayAmount(amount) {
-  return {
-    type: SET_PAY_AMOUNT,
-    amount
-  }
-}
-
-export function setPayInput(payInput) {
-  return {
-    type: SET_PAY_INPUT,
-    payInput
-  }
-}
-
-export function setPayInvoice(invoice) {
-  return {
-    type: SET_PAY_INVOICE,
-    invoice
-  }
-}
-
-export function updatePayErrors(errorsObject) {
-  return {
-    type: UPDATE_PAY_ERRORS,
-    errorsObject
-  }
-}
-
-export const lightningPaymentUri = (event, { payreq }) => dispatch => {
-  // Open pay form
-  dispatch(setFormType('PAY_FORM'))
-  // Set payreq
-  dispatch(setPayInput(payreq))
-}
-
-export function resetPayForm() {
-  return {
-    type: RESET_FORM
-  }
-}
-
-// ------------------------------------
-// Action Handlers
-// ------------------------------------
-const ACTION_HANDLERS = {
-  [SET_PAY_AMOUNT]: (state, { amount }) => ({
-    ...state,
-    amount,
-    showErrors: Object.assign(state.showErrors, { amount: false })
-  }),
-  [SET_PAY_INPUT]: (state, { payInput }) => ({
-    ...state,
-    payInput,
-    showErrors: Object.assign(state.showErrors, { payInput: false })
-  }),
-  [SET_PAY_INVOICE]: (state, { invoice }) => ({
-    ...state,
-    invoice,
-    showErrors: Object.assign(state.showErrors, { amount: false })
-  }),
-
-  [UPDATE_PAY_ERRORS]: (state, { errorsObject }) => ({
-    ...state,
-    showErrors: Object.assign(state.showErrors, errorsObject)
-  }),
-
-  [RESET_FORM]: () => initialState
-}
-
-// ------------------------------------
-// Selector
-// ------------------------------------
-const payFormSelectors = {}
-const payAmountSelector = state => state.payform.amount
-const payInputSelector = state => state.payform.payInput
-const payInvoiceSelector = state => state.payform.invoice
-
-// transaction
-const sendingTransactionSelector = state => state.transaction.sendingTransaction
-
-// payment
-const sendingPaymentSelector = state => state.payment.sendingPayment
-
-// ticker
-const currencySelector = state => state.ticker.currency
-const fiatTickerSelector = state => state.ticker.fiatTicker
-
-payFormSelectors.isOnchain = createSelector(
-  payInputSelector,
-  infoSelectors.networkSelector,
-  (input, network) => {
-    try {
-      bitcoin.address.toOutputScript(input, network.bitcoinJsNetwork)
-      return true
-    } catch (e) {
-      return false
-    }
-  }
-)
-
-payFormSelectors.isLn = createSelector(payInputSelector, input => {
-  if (!input.startsWith('ln')) {
-    return false
-  }
-
-  try {
-    bech32.decode(input)
-    return true
-  } catch (e) {
-    return false
-  }
-})
-
-payFormSelectors.currentAmount = createSelector(
-  payFormSelectors.isLn,
-  payAmountSelector,
-  payInvoiceSelector,
-  currencySelector,
-  (isLn, amount, invoice, currency) => {
-    if (isLn) {
-      switch (currency) {
-        case 'btc':
-          return btc.satoshisToBtc(invoice.num_satoshis || 0)
-        case 'bits':
-          return btc.satoshisToBits(invoice.num_satoshis || 0)
-        case 'sats':
-          return invoice.num_satoshis
-        default:
-          return invoice.num_satoshis
-      }
-    }
-
-    return amount
-  }
-)
-
-payFormSelectors.fiatAmount = createSelector(
-  payFormSelectors.isLn,
-  payAmountSelector,
-  payInvoiceSelector,
-  currencySelector,
-  tickerSelectors.currentTicker,
-  fiatTickerSelector,
-  (isLn, amount, invoice, currency, currentTicker, fiatTicker) => {
-    if (!currentTicker || !currentTicker[fiatTicker].last) {
-      return false
-    }
-
-    if (isLn) {
-      return btc.satoshisToFiat(invoice.num_satoshis || 0, currentTicker[fiatTicker].last)
-    }
-
-    return btc.convert(currency, 'fiat', amount, currentTicker[fiatTicker].last)
-  }
-)
-
-payFormSelectors.payInputMin = createSelector(currencySelector, currency => {
-  switch (currency) {
-    case 'btc':
-      return '0.00000001'
-    case 'bits':
-      return '0.01'
-    case 'sats':
-      return '1'
-    default:
-      return '0'
-  }
-})
-
-payFormSelectors.inputCaption = createSelector(
-  payFormSelectors.isOnchain,
-  payFormSelectors.isLn,
-  payFormSelectors.currentAmount,
-  currencySelector,
-  (isOnchain, isLn, amount, currency) => {
-    if (!isOnchain && !isLn) {
-      return ''
-    }
-
-    if (isOnchain) {
-      return `You're about to send ${amount} ${currency.toUpperCase()} on-chain which should take around 10 minutes`
-    }
-
-    if (isLn) {
-      return `You're about to send ${amount} ${currency.toUpperCase()} over the Lightning Network which will be instant`
-    }
-
-    return ''
-  }
-)
-
-payFormSelectors.showPayLoadingScreen = createSelector(
-  sendingTransactionSelector,
-  sendingPaymentSelector,
-  (sendingTransaction, sendingPayment) => sendingTransaction || sendingPayment
-)
-
-payFormSelectors.payFormIsValid = createSelector(
-  payFormSelectors.isOnchain,
-  payFormSelectors.isLn,
-  payAmountSelector,
-  (isOnchain, isLn, amount) => {
-    const errors = {}
-
-    if (!isLn && amount <= 0) {
-      errors.amount = 'Amount must be more than 0'
-    }
-
-    if (!isOnchain && !isLn) {
-      errors.payInput = 'Must be a valid BTC address or Lightning Network request'
-    }
-
-    return {
-      errors,
-      amountIsValid: !errors.amount,
-      payInputIsValid: !errors.payInput,
-      isValid: Object.keys(errors).length === 0
-    }
-  }
-)
-
-export { payFormSelectors }
-
-// ------------------------------------
-// Reducer
-// ------------------------------------
-export default function payFormReducer(state = initialState, action) {
-  const handler = ACTION_HANDLERS[action.type]
-
-  return handler ? handler(state, action) : state
-}
diff --git a/app/reducers/payment.js b/app/reducers/payment.js
index c6744776..d0cd00dc 100644
--- a/app/reducers/payment.js
+++ b/app/reducers/payment.js
@@ -2,7 +2,6 @@ import { createSelector } from 'reselect'
 import { ipcRenderer } from 'electron'
 import { fetchBalance } from './balance'
 import { setFormType } from './form'
-import { resetPayForm } from './payform'
 import { setError } from './error'
 
 // ------------------------------------
@@ -107,9 +106,6 @@ export const paymentSuccessful = () => dispatch => {
   // Refetch payments (TODO: dont do a full refetch, rather append new tx to list)
   dispatch(fetchPayments())
 
-  // Reset the payment form
-  dispatch(resetPayForm())
-
   // Fetch new balance
   dispatch(fetchBalance())
 }
@@ -184,11 +180,20 @@ const ACTION_HANDLERS = {
   [HIDE_SUCCESS_SCREEN]: state => ({ ...state, showSuccessPayScreen: false })
 }
 
-const paymentSelectors = {}
+const sendingTransactionSelector = state => state.transaction.sendingTransaction
+const sendingPaymentSelector = state => state.payment.sendingPayment
 const modalPaymentSelector = state => state.payment.payment
 
+const paymentSelectors = {}
+
 paymentSelectors.paymentModalOpen = createSelector(modalPaymentSelector, payment => !!payment)
 
+paymentSelectors.showPayLoadingScreen = createSelector(
+  sendingTransactionSelector,
+  sendingPaymentSelector,
+  (sendingTransaction, sendingPayment) => sendingTransaction || sendingPayment
+)
+
 export { paymentSelectors }
 
 // ------------------------------------
diff --git a/app/reducers/requestform.js b/app/reducers/requestform.js
index 0cdc7295..8ee892e6 100644
--- a/app/reducers/requestform.js
+++ b/app/reducers/requestform.js
@@ -71,7 +71,7 @@ export { requestFormSelectors }
 // ------------------------------------
 // Reducer
 // ------------------------------------
-export default function payFormReducer(state = initialState, action) {
+export default function requestFormReducer(state = initialState, action) {
   const handler = ACTION_HANDLERS[action.type]
 
   return handler ? handler(state, action) : state
diff --git a/app/reducers/transaction.js b/app/reducers/transaction.js
index fcd19397..198a1090 100644
--- a/app/reducers/transaction.js
+++ b/app/reducers/transaction.js
@@ -4,7 +4,6 @@ import { btc } from 'lib/utils'
 import { newAddress } from './address'
 import { fetchBalance } from './balance'
 import { setFormType } from './form'
-import { resetPayForm } from './payform'
 import { setError } from './error'
 import { fetchChannels } from './channels'
 
@@ -114,9 +113,6 @@ export const transactionSuccessful = (event, { txid }) => dispatch => {
   // Show successful tx state for 5 seconds
   dispatch(showSuccessTransactionScreen(txid))
   setTimeout(() => dispatch(hideSuccessTransactionScreen()), 5000)
-
-  // Reset the payment form
-  dispatch(resetPayForm())
 }
 
 export const transactionError = (event, { error }) => dispatch => {
diff --git a/test/unit/components/Form.spec.js b/test/unit/components/Form.spec.js
index a05327de..b9f74924 100644
--- a/test/unit/components/Form.spec.js
+++ b/test/unit/components/Form.spec.js
@@ -8,54 +8,15 @@ import Request from 'components/Form/Request'
 
 configure({ adapter: new Adapter() })
 
-const payFormProps = {
-  payform: {
-    amount: 0,
-    payInput: '',
-    invoice: {},
-    showErrors: {}
-  },
-  currency: '',
-  crypto: '',
-  nodes: [],
-  ticker: {
-    currency: 'btc'
-  },
-
-  isOnchain: false,
-  isLn: true,
-  currentAmount: 0,
-  usdAmount: 0,
-  inputCaption: '',
-  showPayLoadingScreen: true,
-  payFormIsValid: {},
-  currencyFilters: [],
-  currencyName: '',
-
-  setPayAmount: () => {},
-  setPayInput: () => {},
-  fetchInvoice: () => {},
-  setCurrency: () => {},
-
-  onPayAmountBlur: () => {},
-
-  onPayInputBlur: () => {},
-
-  onPaySubmit: () => {}
-}
-
 const requestFormProps = {
   requestform: {},
   ticker: {},
-
   currencyFilters: [],
   currencyName: '',
   requestFiatAmount: '',
-
   setRequestAmount: () => {},
   setRequestMemo: () => {},
   setCurrency: () => {},
-
   onRequestSubmit: () => {}
 }
 
@@ -67,7 +28,7 @@ const defaultProps = {
 
 describe('Form', () => {
   describe('should show pay form when formType is PAY_FORM', () => {
-    const props = { ...defaultProps, formType: 'PAY_FORM', formProps: payFormProps }
+    const props = { ...defaultProps, formType: 'PAY_FORM' }
     const el = shallow(<Form {...props} />)
     it('should contain Pay', () => {
       expect(el.find(Pay)).toHaveLength(1)