diff --git a/app/reducers/activity.js b/app/reducers/activity.js index d7c1d06b..49209022 100644 --- a/app/reducers/activity.js +++ b/app/reducers/activity.js @@ -16,7 +16,8 @@ const initialState = { modal: { modalType: null, modalProps: {} - } + }, + searchText: '' } // ------------------------------------ @@ -29,6 +30,8 @@ export const CHANGE_FILTER = 'CHANGE_FILTER' export const TOGGLE_PULLDOWN = 'TOGGLE_PULLDOWN' +export const UPDATE_SEARCH_TEXT = 'UPDATE_SEARCH_TEXT' + // ------------------------------------ // Actions // ------------------------------------ @@ -59,6 +62,13 @@ export function toggleFilterPulldown() { } } +export function updateSearchText(searchText) { + return { + type: UPDATE_SEARCH_TEXT, + searchText + } +} + // ------------------------------------ // Action Handlers // ------------------------------------ @@ -66,7 +76,9 @@ const ACTION_HANDLERS = { [SHOW_ACTIVITY_MODAL]: (state, { modalType, modalProps }) => ({ ...state, modal: { modalType, modalProps } }), [HIDE_ACTIVITY_MODAL]: state => ({ ...state, modal: { modalType: null, modalProps: {} } }), [CHANGE_FILTER]: (state, { filter }) => ({ ...state, filter, filterPulldown: false }), - [TOGGLE_PULLDOWN]: state => ({ ...state, filterPulldown: !state.filterPulldown }) + [TOGGLE_PULLDOWN]: state => ({ ...state, filterPulldown: !state.filterPulldown }), + + [UPDATE_SEARCH_TEXT]: (state, { searchText }) => ({ ...state, searchText }) } // ------------------------------------ @@ -75,20 +87,33 @@ const ACTION_HANDLERS = { const activitySelectors = {} const filtersSelector = state => state.activity.filters const filterSelector = state => state.activity.filter +const searchSelector = state => state.activity.searchText const paymentsSelector = state => state.payment.payments const invoicesSelector = state => state.invoice.invoices const transactionsSelector = state => state.transaction.transactions const allActivity = createSelector( + searchSelector, paymentsSelector, invoicesSelector, transactionsSelector, - (payments, invoices, transactions) => [...payments, ...invoices, ...transactions].sort((a, b) => { - const aTimestamp = Object.prototype.hasOwnProperty.call(a, 'time_stamp') ? a.time_stamp : a.creation_date - const bTimestamp = Object.prototype.hasOwnProperty.call(b, 'time_stamp') ? b.time_stamp : b.creation_date - - return bTimestamp - aTimestamp - }) + (searchText, payments, invoices, transactions) => { + const searchedArr = [...payments, ...invoices, ...transactions].filter(tx => { + if ((tx.tx_hash && tx.tx_hash.includes(searchText)) || + (tx.payment_hash && tx.payment_hash.includes(searchText)) || + (tx.r_hash && tx.r_hash.includes(searchText))) + { return true } + + return false + }) + + return searchedArr.sort((a, b) => { + const aTimestamp = Object.prototype.hasOwnProperty.call(a, 'time_stamp') ? a.time_stamp : a.creation_date + const bTimestamp = Object.prototype.hasOwnProperty.call(b, 'time_stamp') ? b.time_stamp : b.creation_date + + return bTimestamp - aTimestamp + }) + } ) const lnActivity = createSelector( @@ -131,6 +156,18 @@ activitySelectors.nonActiveFilters = createSelector( (filters, filter) => filters.filter(f => f.key !== filter.key) ) +activitySelectors.searchActivity = createSelector( + searchSelector, + paymentsSelector, + transactionsSelector, + invoicesSelector, + (searchText, payments, transactions, invoices) => { + if (!searchText.length) { return } + + + } +) + export { activitySelectors } diff --git a/app/routes/activity/components/Activity.js b/app/routes/activity/components/Activity.js index 2af22af4..60c83d5d 100644 --- a/app/routes/activity/components/Activity.js +++ b/app/routes/activity/components/Activity.js @@ -47,14 +47,14 @@ class Activity extends Component { render() { const { ticker, - searchInvoices, - invoice: { invoicesSearchText, invoiceLoading }, + updateSearchText, + invoice: { invoiceLoading }, address: { address }, balance, info, payment: { paymentLoading }, currentTicker, - activity: { modal, filter, filterPulldown }, + activity: { modal, filter, filterPulldown, searchText }, hideActivityModal, changeFilter, toggleFilterPulldown, @@ -84,10 +84,10 @@ class Activity extends Component { searchInvoices(event.target.value)} + value={searchText} + onChange={event => updateSearchText(event.target.value)} className={`${styles.text} ${styles.input}`} - placeholder='Search by amount, hash, memo, etc' + placeholder='Search by hash...' type='text' id='invoiceSearch' /> @@ -132,7 +132,7 @@ Activity.propTypes = { fetchBalance: PropTypes.func.isRequired, ticker: PropTypes.object.isRequired, - searchInvoices: PropTypes.func.isRequired, + updateSearchText: PropTypes.func.isRequired, invoice: PropTypes.object.isRequired, payment: PropTypes.object.isRequired, currentTicker: PropTypes.object.isRequired, diff --git a/app/routes/activity/containers/ActivityContainer.js b/app/routes/activity/containers/ActivityContainer.js index 3f0df128..1caa3a50 100644 --- a/app/routes/activity/containers/ActivityContainer.js +++ b/app/routes/activity/containers/ActivityContainer.js @@ -3,7 +3,6 @@ import { tickerSelectors } from 'reducers/ticker' import { fetchBalance } from 'reducers/balance' import { fetchInvoices, - searchInvoices, setInvoice, invoiceSelectors } from 'reducers/invoice' @@ -18,7 +17,8 @@ import { hideActivityModal, changeFilter, toggleFilterPulldown, - activitySelectors + activitySelectors, + updateSearchText } from 'reducers/activity' import { newAddress } from 'reducers/address' @@ -30,13 +30,13 @@ const mapDispatchToProps = { fetchPayments, fetchInvoices, fetchTransactions, - searchInvoices, showActivityModal, hideActivityModal, changeFilter, toggleFilterPulldown, newAddress, - fetchBalance + fetchBalance, + updateSearchText } const mapStateToProps = state => ({