diff --git a/app/components/Activity/ActivityModal.js b/app/components/Activity/ActivityModal.js
index e9c500d0..b255ece3 100644
--- a/app/components/Activity/ActivityModal.js
+++ b/app/components/Activity/ActivityModal.js
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types'
import Isvg from 'react-inlinesvg'
import x from 'icons/x.svg'
-// import Transaction from './Transaction'
+import TransactionModal from './TransactionModal'
import PaymentModal from './PaymentModal'
import InvoiceModal from './InvoiceModal'
@@ -19,7 +19,7 @@ const ActivityModal = ({
toggleCurrencyProps
}) => {
const MODAL_COMPONENTS = {
- // TRANSACTION: Transaction,
+ TRANSACTION: TransactionModal,
PAYMENT: PaymentModal,
INVOICE: InvoiceModal
}
diff --git a/app/components/Activity/TransactionModal.js b/app/components/Activity/TransactionModal.js
index e69de29b..96109854 100644
--- a/app/components/Activity/TransactionModal.js
+++ b/app/components/Activity/TransactionModal.js
@@ -0,0 +1,67 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+
+import Moment from 'react-moment'
+import 'moment-timezone'
+
+import { FaAngleDown } from 'react-icons/lib/fa'
+
+import Value from 'components/Value'
+
+import styles from './PaymentModal.scss'
+
+const PaymentModal = ({
+ transaction,
+ ticker,
+ currentTicker,
+
+ toggleCurrencyProps: {
+ setActivityModalCurrencyFilters,
+ showCurrencyFilters,
+ currencyName,
+ currentCurrencyFilters,
+ onCurrencyFilterClick
+ }
+}) => {
+ console.log('transaction: ', transaction)
+ return (
+
+
+
+
+
+
+
+
+
+ setActivityModalCurrencyFilters(!showCurrencyFilters)}>
+ {currencyName}
+
+
+ {
+ currentCurrencyFilters.map(filter =>
+ - onCurrencyFilterClick(filter.key)}>{filter.name}
)
+ }
+
+
+
+
+ {transaction.time_stamp * 1000}
+
+
+
+
+
+
+ )
+}
+
+PaymentModal.propTypes = {
+ transaction: PropTypes.object.isRequired,
+ ticker: PropTypes.object.isRequired,
+ currentTicker: PropTypes.object.isRequired,
+
+ toggleCurrencyProps: PropTypes.object.isRequired
+}
+
+export default PaymentModal
diff --git a/app/components/Form/Pay.js b/app/components/Form/Pay.js
index 67ba87c6..7096f526 100644
--- a/app/components/Form/Pay.js
+++ b/app/components/Form/Pay.js
@@ -60,6 +60,9 @@ class Pay extends Component {
setCurrency
} = this.props
+ console.log('errors: ', errors)
+ console.log('showErrors: ', showErrors)
+
const displayNodeName = (pubkey) => {
const node = find(nodes, n => n.pub_key === pubkey)
@@ -116,6 +119,11 @@ class Pay extends Component {
id='destination'
rows='2'
/>
+
+ {showErrors.payInput &&
+ {errors.payInput}
+ }
+
@@ -153,6 +161,12 @@ class Pay extends Component {
{`≈ ${usdAmount || 0} USD`}
+
+
+ {showErrors.amount &&
+ {errors.amount}
+ }
+
diff --git a/app/components/Form/Pay.scss b/app/components/Form/Pay.scss
index 55a8b954..7f0a7c2b 100644
--- a/app/components/Form/Pay.scss
+++ b/app/components/Form/Pay.scss
@@ -164,3 +164,19 @@
}
}
}
+
+.errorMessage {
+ color: $red;
+ font-size: 12px;
+ min-height: 20px;
+ opacity: 0;
+ transition: all 0.25s ease;
+
+ &.amount {
+ margin-top: 10px;
+ }
+
+ &.active {
+ opacity: 1;
+ }
+}
diff --git a/app/components/Value/Value.js b/app/components/Value/Value.js
index e87a2df9..5391e4b4 100644
--- a/app/components/Value/Value.js
+++ b/app/components/Value/Value.js
@@ -8,7 +8,7 @@ Value.propTypes = {
value: PropTypes.oneOfType([
PropTypes.string,
PropTypes.number
- ]).isRequired,
+ ]),
currency: PropTypes.string.isRequired,
currentTicker: PropTypes.object.isRequired
}