1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
import { Order, ZeroEx } from '0x.js';
import * as _ from 'lodash';
import * as React from 'react';
import ReactTooltip = require('react-tooltip');
import { Blockchain } from 'ts/blockchain';
import { FakeTextField } from 'ts/components/ui/fake_text_field';
import { HashData, Styles } from 'ts/types';
import { constants } from 'ts/utils/constants';
const styles: Styles = {
textField: {
overflow: 'hidden',
paddingTop: 8,
textOverflow: 'ellipsis',
whiteSpace: 'nowrap',
},
};
interface HashInputProps {
blockchain: Blockchain;
blockchainIsLoaded: boolean;
hashData: HashData;
label: string;
}
interface HashInputState {}
export class HashInput extends React.Component<HashInputProps, HashInputState> {
public render() {
const msgHashHex = this.props.blockchainIsLoaded ? this._generateMessageHashHex() : '';
return (
<div>
<FakeTextField label={this.props.label}>
<div style={styles.textField} data-tip={true} data-for="hashTooltip">
{msgHashHex}
</div>
</FakeTextField>
<ReactTooltip id="hashTooltip">{msgHashHex}</ReactTooltip>
</div>
);
}
private _generateMessageHashHex() {
const exchangeContractAddress = this.props.blockchain.getExchangeContractAddressIfExists();
const hashData = this.props.hashData;
const order: Order = {
exchangeContractAddress,
expirationUnixTimestampSec: hashData.orderExpiryTimestamp,
feeRecipient: hashData.feeRecipientAddress,
maker: _.isEmpty(hashData.orderMakerAddress) ? constants.NULL_ADDRESS : hashData.orderMakerAddress,
makerFee: hashData.makerFee,
makerTokenAddress: hashData.depositTokenContractAddr,
makerTokenAmount: hashData.depositAmount,
salt: hashData.orderSalt,
taker: hashData.orderTakerAddress,
takerFee: hashData.takerFee,
takerTokenAddress: hashData.receiveTokenContractAddr,
takerTokenAmount: hashData.receiveAmount,
};
const orderHash = ZeroEx.getOrderHashHex(order);
return orderHash;
}
}
|
