From 6e7018fb7a0319a65a94d828636d2c7791a82e62 Mon Sep 17 00:00:00 2001 From: Tom Kirkpatrick Date: Sat, 3 Nov 2018 12:02:09 +0100 Subject: [PATCH] fix(wallet): improve fee estimate presentation --- app/components/Pay/PaySummaryLightning.js | 31 ++++++++++++------- app/components/Pay/PaySummaryOnChain.js | 6 ++-- 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, 40 insertions(+), 24 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 ( @@ -108,7 +125,7 @@ class PaySummaryLightning extends React.PureComponent { - {} + {} @@ -127,10 +144,8 @@ class PaySummaryLightning extends React.PureComponent { - ) : minFee === null || maxFee === null ? ( - ) : ( - + feeMessage && ) } /> @@ -141,13 +156,7 @@ class PaySummaryLightning extends React.PureComponent { left={} right={ - {cryptoCurrencyTicker} - {!isQueryingRoutes && - maxFee && ( - - (+ {maxFee} msats) - - )} + {cryptoCurrencyTicker} } /> diff --git a/app/components/Pay/PaySummaryOnChain.js b/app/components/Pay/PaySummaryOnChain.js index 9799f320..0de81c71 100644 --- a/app/components/Pay/PaySummaryOnChain.js +++ b/app/components/Pay/PaySummaryOnChain.js @@ -122,11 +122,11 @@ class PaySummaryOnChain extends React.Component { ) : !fee ? ( - + ) : ( - {fee} satoshis + {fee} satoshis () @@ -143,7 +143,7 @@ class PaySummaryOnChain extends React.Component { right={ {cryptoCurrencyTicker} - {!isQueryingFees && fee && (+ {fee} satoshis per byte} + {!isQueryingFees && fee && (+ {fee} satoshis per byte)} } /> 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" > @@ -99,8 +100,13 @@ exports[`component.Form.PaySummaryLightning should render correctly 1`] = ` right={ } /> 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={ }