1  import React, { Component } from 'react';
 2  import { connect } from 'react-redux';
 3  
 4  import { makeTransaction, IHexStrTransaction } from 'libs/transaction';
 5  import { getTransactionFields } from 'libs/transaction/utils/ether';
 6  import { AppState } from 'features/reducers';
 7  import * as selectors from 'features/selectors';
 8  
 9  interface StateProps {
10    serializedTransaction: Buffer | null;
11  }
12  
13  interface Props {
14    withSerializedTransaction(
15      serializedTransaction: string,
16      transactionFields: IHexStrTransaction
17    ): React.ReactElement<any> | null;
18  }
19  
20  class SerializedTransactionClass extends Component<StateProps & Props, {}> {
21    public render() {
22      const { serializedTransaction, withSerializedTransaction } = this.props;
23      return serializedTransaction
24        ? withSerializedTransaction(
25            serializedTransaction.toString('hex'),
26            getRawTxFields(serializedTransaction.toString('hex'))
27          )
28        : null;
29    }
30  }
31  
32  const getRawTxFields = (serializedTransaction: string) =>
33    getTransactionFields(makeTransaction(serializedTransaction));
34  
35  export const SerializedTransaction = connect((state: AppState) => ({
36    serializedTransaction: selectors.getSerializedTransaction(state)
37  }))(SerializedTransactionClass);