fix: ๐Ÿ› correct fee unit

This commit is contained in:
AP 2020-05-25 22:32:11 +02:00
parent 60ad4b3bef
commit ca9a2cfcee
3 changed files with 35 additions and 55 deletions

View file

@ -4,6 +4,7 @@ import { ChevronRight, X } from 'react-feather';
import { useAccountState } from 'src/context/AccountContext';
import { useChannelFeesQuery } from 'src/graphql/queries/__generated__/getChannelFees.generated';
import { useUpdateFeesMutation } from 'src/graphql/mutations/__generated__/updateFees.generated';
import { InputWithDeco } from 'src/components/input/InputWithDeco';
import {
Card,
CardWithTitle,
@ -11,10 +12,7 @@ import {
SingleLine,
Sub4Title,
Separation,
DarkSubTitle,
RightAlign,
ResponsiveLine,
NoWrapTitle,
} from '../src/components/generic/Styled';
import { getErrorContent } from '../src/utils/error';
import { LoadingCard } from '../src/components/loading/LoadingCard';
@ -22,7 +20,6 @@ import { FeeCard } from '../src/views/fees/FeeCard';
import { SecureButton } from '../src/components/buttons/secureButton/SecureButton';
import { AdminSwitch } from '../src/components/adminSwitch/AdminSwitch';
import { ColorButton } from '../src/components/buttons/colorButton/ColorButton';
import { Input } from '../src/components/input/Input';
const FeesView = () => {
const [indexOpen, setIndexOpen] = useState(0);
@ -68,26 +65,20 @@ const FeesView = () => {
{isEdit && (
<>
<Separation />
<ResponsiveLine>
<NoWrapTitle>
<DarkSubTitle>{'Base Fee:'}</DarkSubTitle>
</NoWrapTitle>
<Input
placeholder={'Sats'}
type={'number'}
onChange={e => setBaseFee(Number(e.target.value))}
/>
</ResponsiveLine>
<ResponsiveLine>
<NoWrapTitle>
<DarkSubTitle>{'Fee Rate:'}</DarkSubTitle>
</NoWrapTitle>
<Input
placeholder={'Sats/Million'}
type={'number'}
onChange={e => setFeeRate(Number(e.target.value))}
/>
</ResponsiveLine>
<InputWithDeco
title={'BaseFee'}
placeholder={'Sats'}
amount={baseFee}
inputType={'number'}
inputCallback={value => setBaseFee(Number(value))}
/>
<InputWithDeco
title={'Fee Rate'}
placeholder={'MilliSats/Million'}
amount={feeRate / 1000}
inputType={'number'}
inputCallback={value => setFeeRate(Number(value))}
/>
<RightAlign>
<SecureButton
callback={updateFees}

View file

@ -42,7 +42,7 @@ export const getValue = ({
if (currency === 'sat') {
const breakAmount = breakNumber
? getValueString(value)
: numeral(value).format('0,0');
: numeral(value).format('0,0.[000]');
return `${breakAmount} sats`;
}

View file

@ -2,6 +2,7 @@ import React, { useState } from 'react';
import { toast } from 'react-toastify';
import { ChevronRight } from 'react-feather';
import { useUpdateFeesMutation } from 'src/graphql/mutations/__generated__/updateFees.generated';
import { InputWithDeco } from 'src/components/input/InputWithDeco';
import {
SubCard,
Separation,
@ -18,9 +19,6 @@ import {
} from '../../components/generic/CardGeneric';
import { getErrorContent } from '../../utils/error';
import { SecureButton } from '../../components/buttons/secureButton/SecureButton';
import { useConfigState } from '../../context/ConfigContext';
import { textColorMap } from '../../styles/Themes';
import { Input } from '../../components/input/Input';
import { AdminSwitch } from '../../components/adminSwitch/AdminSwitch';
interface FeeCardProps {
@ -39,8 +37,6 @@ export const FeeCard = ({
const [newBaseFee, setBaseFee] = useState(0);
const [newFeeRate, setFeeRate] = useState(0);
const { theme } = useConfigState();
const {
alias,
color,
@ -51,6 +47,8 @@ export const FeeCard = ({
public_key,
} = channelInfo;
const feeRateSats = feeRate / 1000;
const [updateFees] = useUpdateFeesMutation({
onError: error => toast.error(getErrorContent(error)),
onCompleted: data => {
@ -78,28 +76,20 @@ export const FeeCard = ({
{renderLine('Transaction Vout:', transactionVout)}
<Separation />
<AdminSwitch>
<ResponsiveLine>
<NoWrapTitle>
<DarkSubTitle>{'Base Fee:'}</DarkSubTitle>
</NoWrapTitle>
<Input
placeholder={'Sats'}
color={textColorMap[theme]}
type={textColorMap[theme]}
onChange={e => setBaseFee(Number(e.target.value))}
/>
</ResponsiveLine>
<ResponsiveLine>
<NoWrapTitle>
<DarkSubTitle>{'Fee Rate:'}</DarkSubTitle>
</NoWrapTitle>
<Input
placeholder={'Sats/Million'}
color={textColorMap[theme]}
type={'number'}
onChange={e => setFeeRate(Number(e.target.value))}
/>
</ResponsiveLine>
<InputWithDeco
title={'BaseFee'}
placeholder={'Sats'}
amount={newBaseFee}
inputType={'number'}
inputCallback={value => setBaseFee(Number(value))}
/>
<InputWithDeco
title={'Fee Rate'}
placeholder={'MilliSats/Million'}
amount={newFeeRate / 1000}
inputType={'number'}
inputCallback={value => setFeeRate(Number(value))}
/>
<SecureButton
callback={updateFees}
variables={{
@ -112,7 +102,6 @@ export const FeeCard = ({
feeRate: newFeeRate,
}),
}}
color={textColorMap[theme]}
disabled={newBaseFee === 0 && newFeeRate === 0}
fullWidth={true}
withMargin={'16px 0 0'}
@ -145,9 +134,9 @@ export const FeeCard = ({
<DarkSubTitle>{'Fee Rate:'}</DarkSubTitle>
</NoWrapTitle>
<SingleLine>
{feeRate}
{feeRateSats}
<DarkSubTitle>
{feeRate === 1 ? 'sat/million' : 'sats/million'}
{feeRateSats === 1 ? 'sat/million' : 'sats/million'}
</DarkSubTitle>
</SingleLine>
</SingleLine>