feature(wallet): add wallet search

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 }
 

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 {
             <MdSearch />
           </label>
           <input
-            value={invoicesSearchText}
-            onChange={event => 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,

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 => ({