import React from 'react';
import {inject, observer} from "mobx-react";
import { Spin, Alert, Divider } from 'antd';

import './style.scss';
import NavigationArrowBack from 'material-ui/svg-icons/navigation/arrow-back';
import {FlatButton} from "material-ui";

@inject("appstate")
@observer
export default class TransactionPage extends React.Component {
  constructor(props){
    super(props);
    this.props = props;
  }

  render() {
    return(
      <div className={'transactionContainer'}>
        <div className={'parentContainer'}>
          <div className={'barContainer'}>
            <FlatButton
              className="headerMenu"
              hoverColor="#f1f5f9"
              style={{ background: '#ffffff00' }}
              onClick={() => this.props.history.goBack()}
              label="Back"
              primary={true}
              icon={<NavigationArrowBack />}
            />
            <div className={'optionContainer'}>
              <span className={'optionTitle'}>Show  :</span>
              <span className={'optionSelect'}>All</span>
              <span className={'optionSelect'}>Success</span>
              <span className={'optionSelect'}>Failed</span>
              <span className={'optionSelect'}>Pending</span>
            </div>
          </div>
          <Divider className={'dividerTop'} />
        </div>
      </div>
    )
  }
}
