show shapeshift rate

This commit is contained in:
Sean Yesmunt 2017-12-04 12:18:34 -05:00
parent d043233094
commit d4b4b78e10
5 changed files with 73 additions and 9 deletions

View file

@ -5,6 +5,7 @@ import * as statuses from "constants/shape_shift";
import Address from "component/address";
import Link from "component/link";
import type { Dispatch } from "redux/actions/shape_shift";
import ShiftMarketInfo from "./market_info";
type Props = {
shiftState: ?string,
@ -16,6 +17,10 @@ type Props = {
clearShapeShift: Dispatch,
doShowSnackBar: Dispatch,
getActiveShift: Dispatch,
shapeShiftRate: ?number,
originCoinDepositMax: ?number,
originCoinDepositFee: ?number,
originCoinDepositMin: ?string,
};
class ActiveShapeShift extends React.PureComponent<Props> {
@ -63,6 +68,9 @@ class ActiveShapeShift extends React.PureComponent<Props> {
originCoinDepositMax,
clearShapeShift,
doShowSnackBar,
shapeShiftRate,
originCoinDepositFee,
originCoinDepositMin,
} = this.props;
return (
@ -76,6 +84,13 @@ class ActiveShapeShift extends React.PureComponent<Props> {
</span>{" "}
to the address below.
</p>
<ShiftMarketInfo
originCoin={shiftCoinType}
shapeShiftRate={shapeShiftRate}
originCoinDepositFee={originCoinDepositFee}
originCoinDepositMin={originCoinDepositMin}
originCoinDepositMax={originCoinDepositMax}
/>
<div className="shapeshift__deposit-address-wrapper">
<Address address={shiftDepositAddress} showCopyButton />

View file

@ -3,6 +3,7 @@ import Link from "component/link";
import { getExampleAddress } from "util/shape_shift";
import { Submit, FormRow } from "component/form";
import type { ShapeShiftFormValues, Dispatch } from "redux/actions/shape_shift";
import ShiftMarketInfo from "./market_info";
type ShapeShiftFormErrors = {
returnAddress?: string,
@ -24,6 +25,7 @@ type Props = {
originCoinDepositFee: number,
originCoinDepositMin: string,
originCoinDepositMax: number,
shapeShiftRate: number,
};
export default (props: Props) => {
@ -43,6 +45,7 @@ export default (props: Props) => {
originCoinDepositMax,
originCoinDepositMin,
originCoinDepositFee,
shapeShiftRate,
} = props;
return (
<form onSubmit={handleSubmit}>
@ -63,18 +66,18 @@ export default (props: Props) => {
))}
</select>
<span> {__("for LBC")}</span>
<p className="shapeshift__tx-info help">
<div className="shapeshift__tx-info">
{!updating &&
originCoinDepositMax && (
<span>
{__("Exchange max")}: {originCoinDepositMax} {originCoin}
<br />
{__("Exchange minimun")}: {originCoinDepositMin} {originCoin}
<br />
{__("Fee")}: {originCoinDepositFee} LBC
</span>
<ShiftMarketInfo
originCoin={originCoin}
shapeShiftRate={shapeShiftRate}
originCoinDepositFee={originCoinDepositFee}
originCoinDepositMin={originCoinDepositMin}
originCoinDepositMax={originCoinDepositMax}
/>
)}
</p>
</div>
</div>
<FormRow

View file

@ -0,0 +1,34 @@
// @flow
import React from "react";
type Props = {
shapeShiftRate: ?number,
originCoin: ?string,
originCoinDepositFee: ?number,
originCoinDepositMax: ?number,
originCoinDepositMin: ?string,
};
export default (props: Props) => {
const {
shapeShiftRate,
originCoin,
originCoinDepositFee,
originCoinDepositMax,
originCoinDepositMin,
} = props;
return (
<div>
<span className="help">
{__("Receive")} {shapeShiftRate} LBC
{" / "}
{"1"} {originCoin} {__("less")} {originCoinDepositFee} LBC {__("fee")}.
<br />
{__("Exchange max")}: {originCoinDepositMax} {originCoin}
<br />
{__("Exchange min")}: {originCoinDepositMin} {originCoin}
</span>
</div>
);
};

View file

@ -65,6 +65,7 @@ class ShapeShift extends React.PureComponent<Props> {
shiftCoinType,
shiftOrderId,
shiftState,
shapeShiftRate,
} = shapeShift;
const initialFormValues: ShapeShiftFormValues = {
@ -116,6 +117,8 @@ class ShapeShift extends React.PureComponent<Props> {
originCoinDepositMax={originCoinDepositMax}
originCoinDepositMin={originCoinDepositMin}
originCoinDepositFee={originCoinDepositFee}
shapeShiftRate={shapeShiftRate}
updating={updating}
/>
)}
/>
@ -131,6 +134,11 @@ class ShapeShift extends React.PureComponent<Props> {
shiftState={shiftState}
clearShapeShift={clearShapeShift}
doShowSnackBar={doShowSnackBar}
originCoinDepositMax={originCoinDepositMax}
originCoinDepositMin={originCoinDepositMin}
originCoinDepositFee={originCoinDepositFee}
shapeShiftRate={shapeShiftRate}
updating={updating}
/>
)}
</div>

View file

@ -21,6 +21,7 @@ export type ShapeShiftState = {
// using Number(x) or parseInt(x) will either change it back to scientific notation or round to zero
originCoinDepositMin: ?string,
originCoinDepositFee: ?number,
shapeShiftRate: ?number,
};
// All ShapeShift actions that will have some payload
@ -63,6 +64,7 @@ type ShapeShiftMarketInfo = {
limit: number,
minimum: number,
minerFee: number,
rate: number,
};
type ActiveShiftInfo = {
@ -91,6 +93,7 @@ const defaultState: ShapeShiftState = {
originCoinDepositMax: undefined,
originCoinDepositMin: undefined,
originCoinDepositFee: undefined,
shapeShiftRate: undefined,
};
export default handleActions(
@ -149,6 +152,7 @@ export default handleActions(
.toFixed(10)
.replace(/\.?0+$/, ""),
originCoinDepositFee: marketInfo.minerFee,
shapeShiftRate: marketInfo.rate,
};
},
[actions.GET_COIN_STATS_FAIL]: (