diff --git a/app/reducers/activity.js b/app/reducers/activity.js index f7032706..761efb09 100644 --- a/app/reducers/activity.js +++ b/app/reducers/activity.js @@ -18,7 +18,8 @@ const initialState = { showCurrencyFilters: false }, searchActive: false, - searchText: '' + searchText: '', + showExpiredRequests: false } // ------------------------------------ @@ -31,6 +32,8 @@ export const CHANGE_FILTER = 'CHANGE_FILTER' export const TOGGLE_PULLDOWN = 'TOGGLE_PULLDOWN' +export const TOGGLE_EXPIRED_REQUESTS = 'TOGGLE_EXPIRED_REQUESTS' + export const SET_ACTIVITY_MODAL_CURRENCY_FILTERS = 'SET_ACTIVITY_MODAL_CURRENCY_FILTERS' export const UPDATE_SEARCH_ACTIVE = 'UPDATE_SEARCH_ACTIVE' @@ -87,6 +90,12 @@ export function setActivityModalCurrencyFilters(showCurrencyFilters) { } } +export function toggleExpiredRequests() { + return { + type: TOGGLE_EXPIRED_REQUESTS + } +} + // ------------------------------------ // Action Handlers // ------------------------------------ @@ -98,6 +107,10 @@ const ACTION_HANDLERS = { [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_EXPIRED_REQUESTS]: state => ({ + ...state, + showExpiredRequests: !state.showExpiredRequests + }), [SET_ACTIVITY_MODAL_CURRENCY_FILTERS]: (state, { showCurrencyFilters }) => ({ ...state, @@ -119,6 +132,7 @@ const activitySelectors = {} const filtersSelector = state => state.activity.filters const filterSelector = state => state.activity.filter const searchSelector = state => state.activity.searchText +const showExpiredSelector = state => state.activity.showExpiredRequests const paymentsSelector = state => state.payment.payments const invoicesSelector = state => state.invoice.invoices const transactionsSelector = state => state.transaction.transactions @@ -201,8 +215,13 @@ const allActivity = createSelector( paymentsSelector, invoicesSelector, transactionsSelector, - (searchText, payments, invoices, transactions) => { - const searchedArr = [...payments, ...invoices, ...transactions].filter(tx => { + showExpiredSelector, + (searchText, payments, invoices, transactions, showExpired) => { + const filteredInvoices = invoices.filter( + invoice => showExpired || invoice.settled || !invoiceExpired(invoice) + ) + + const searchedArr = [...payments, ...filteredInvoices, ...transactions].filter(tx => { if ( (tx.tx_hash && tx.tx_hash.includes(searchText)) || (tx.payment_hash && tx.payment_hash.includes(searchText)) || @@ -222,7 +241,12 @@ const allActivity = createSelector( } ) -const invoiceActivity = createSelector(invoicesSelector, invoices => groupAll(invoices)) +const invoiceActivity = createSelector( + invoicesSelector, + showExpiredSelector, + (invoices, showExpired) => + groupAll(invoices.filter(invoice => showExpired || invoice.settled || !invoiceExpired(invoice))) +) const sentActivity = createSelector( transactionsSelector, @@ -250,6 +274,11 @@ activitySelectors.nonActiveFilters = createSelector( (filters, filter) => filters.filter(f => f.key !== filter.key) ) +activitySelectors.showExpiredToggle = createSelector( + filterSelector, + filter => filter.key === 'REQUESTED_ACTIVITY' || filter.key === 'ALL_ACTIVITY' +) + export { activitySelectors } // ------------------------------------ diff --git a/app/routes/activity/components/Activity.js b/app/routes/activity/components/Activity.js index 2c7d8647..080654ce 100644 --- a/app/routes/activity/components/Activity.js +++ b/app/routes/activity/components/Activity.js @@ -74,9 +74,11 @@ class Activity extends Component { render() { const { balance, - activity: { filters, filter, filterPulldown, searchActive, searchText }, + activity: { filters, filter, filterPulldown, searchActive, searchText, showExpiredRequests }, changeFilter, currentActivity, + showExpiredToggle, + toggleExpiredRequests, fetchPayments, fetchInvoices, @@ -199,6 +201,13 @@ class Activity extends Component { ))} + {showExpiredToggle && ( +