diff --git a/src/components/TransactionItem.js b/src/components/TransactionItem.js index cd5e524dbb28..6e218d6530ae 100644 --- a/src/components/TransactionItem.js +++ b/src/components/TransactionItem.js @@ -1,7 +1,9 @@ -import React from 'react'; +import React, {Component} from 'react'; import PropTypes from 'prop-types'; +import { View, Text, Pressable } from 'react-native-web'; import ReportActionPropTypes from '../pages/home/report/ReportActionPropTypes'; import ReportActionItemIOUPreview from '../components/ReportActionItemIOUPreview'; +import styles from '../styles/styles'; const propTypes = { action: PropTypes.shape(ReportActionPropTypes).isRequired, @@ -17,6 +19,9 @@ const propTypes = { // The transaction amount amount: PropTypes.number, + + // Was this transaction created by the current user + createdByUser: PropTypes.bool, }).isRequired, }; @@ -26,13 +31,36 @@ const defaultProps = { }, }; -const TransactionItem = props => ( - +class TransactionItem extends Component { + constructor(props) { + super(props); + + this.removeTransaction = this.removeTransaction.bind(this); + } -); + removeTransaction() { + console.debug('removeTransaction'); + } + + render() { + return ( + + + this.removeTransaction()} + > + + {this.props.transaction.createdByUser ? 'Cancel' : 'Decline'} + + + + ); + } +}; TransactionItem.displayName = 'TransactionItem'; TransactionItem.propTypes = propTypes; diff --git a/src/styles/utilities/flex.js b/src/styles/utilities/flex.js index d8d115bf5c38..e51d5cd66ff8 100644 --- a/src/styles/utilities/flex.js +++ b/src/styles/utilities/flex.js @@ -52,6 +52,10 @@ export default { alignItems: 'flex-end', }, + alignItemsStart: { + alignItems: 'start', + }, + flexWrap: { flexWrap: 'wrap', },