96 lines
3.1 KiB
TypeScript
96 lines
3.1 KiB
TypeScript
import React, { Component } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import TabSection from 'containers/TabSection';
|
|
import { translateRaw } from 'translations';
|
|
import {
|
|
signLocalTransactionSucceeded,
|
|
TSignLocalTransactionSucceeded,
|
|
signTransactionFailed,
|
|
TSignTransactionFailed
|
|
} from 'actions/transaction';
|
|
import { computeIndexingHash } from 'libs/transaction';
|
|
import { QRCode } from 'components/ui';
|
|
import EthTx from 'ethereumjs-tx';
|
|
import classnames from 'classnames';
|
|
import { SendButton } from 'components/SendButton';
|
|
import { toBuffer, bufferToHex } from 'ethereumjs-util';
|
|
import { getSerializedTransaction } from 'selectors/transaction';
|
|
import { AppState } from 'reducers';
|
|
import './index.scss';
|
|
|
|
interface StateProps {
|
|
stateTransaction: AppState['transaction']['sign']['local']['signedTransaction'];
|
|
}
|
|
interface DispatchProps {
|
|
signLocalTransactionSucceeded: TSignLocalTransactionSucceeded;
|
|
signTransactionFailed: TSignTransactionFailed;
|
|
}
|
|
interface State {
|
|
userInput: string;
|
|
}
|
|
const INITIAL_STATE: State = { userInput: '' };
|
|
|
|
class BroadcastTx extends Component<DispatchProps & StateProps> {
|
|
public state: State = INITIAL_STATE;
|
|
|
|
public render() {
|
|
const { userInput } = this.state;
|
|
const { stateTransaction } = this.props;
|
|
const inputClasses = classnames({
|
|
'form-control': true,
|
|
'is-valid': !!stateTransaction,
|
|
'is-invalid': !stateTransaction
|
|
});
|
|
|
|
return (
|
|
<TabSection isUnavailableOffline={true}>
|
|
<div className="Tab-content-pane row block text-center">
|
|
<div className="BroadcastTx">
|
|
<h1 className="BroadcastTx-title">Broadcast Signed Transaction</h1>
|
|
<p className="BroadcastTx-help">
|
|
Paste a signed transaction and press the "SEND TRANSACTION" button.
|
|
</p>
|
|
<label>{translateRaw('SEND_signed')}</label>
|
|
<textarea
|
|
className={inputClasses}
|
|
rows={7}
|
|
value={userInput}
|
|
onChange={this.handleChange}
|
|
/>
|
|
<SendButton onlyTransactionParameters={true} />
|
|
|
|
<div className="BroadcastTx-qr">
|
|
{stateTransaction && <QRCode data={bufferToHex(stateTransaction)} />}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</TabSection>
|
|
);
|
|
}
|
|
|
|
protected handleChange = ({ currentTarget }: React.FormEvent<HTMLTextAreaElement>) => {
|
|
const { value } = currentTarget;
|
|
this.setState({ userInput: value });
|
|
try {
|
|
const bufferTransaction = toBuffer(value);
|
|
const tx = new EthTx(bufferTransaction);
|
|
if (!tx.verifySignature()) {
|
|
throw Error();
|
|
}
|
|
const indexingHash = computeIndexingHash(bufferTransaction);
|
|
this.props.signLocalTransactionSucceeded({
|
|
signedTransaction: bufferTransaction,
|
|
indexingHash,
|
|
noVerify: true
|
|
});
|
|
} catch {
|
|
this.props.signTransactionFailed();
|
|
}
|
|
};
|
|
}
|
|
|
|
export default connect(
|
|
(state: AppState) => ({ stateTransaction: getSerializedTransaction(state) }),
|
|
{ signLocalTransactionSucceeded, signTransactionFailed }
|
|
)(BroadcastTx);
|