persists transaction filter

This commit is contained in:
Jessop Breth 2018-10-18 13:56:10 -04:00
parent f5d762b718
commit c74def28ca
3 changed files with 28 additions and 45 deletions

View file

@ -10,6 +10,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
* Focus on search bar with {cmd,ctrl} + "l" ([#2003](https://github.com/lbryio/lbry-desktop/pull/2003))
* Add support for clickable channel names on explore page headings ([#2023](https://github.com/lbryio/lbry-desktop/pull/2023))
* Content loading placeholder styles on FileCard/FileTile ([#2022](https://github.com/lbryio/lbry-desktop/pull/2022))
* Adds Persistence to Transaction List Filter Selection ([#2048](https://github.com/lbryio/lbry-desktop/pull/2048))
### Changed
* Make tooltip smarter ([#1979](https://github.com/lbryio/lbry-desktop/pull/1979))
@ -19,7 +20,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
* Credit card verification messaging ([#2025](https://github.com/lbryio/lbry-desktop/pull/2025))
* Reverse Order & Use System/Location Time/Date ([#2036]https://github.com/lbryio/lbry-desktop/pull/2036)
* Limit file type can be uploaded as thumbnail for publishing ([#2034](https://github.com/lbryio/lbry-desktop/pull/2034))
* Change snackbar notification postion to bottom-left ([#2040](https://github.com/lbryio/lbry-desktop/pull/2040))
* Change snackbar notification postion to bottom-left ([#2040](https://github.com/lbryio/lbry-desktop/pull/2040))
### Fixed

View file

@ -1,17 +1,24 @@
import { connect } from 'react-redux';
import { selectClaimedRewardsByTransactionId } from 'lbryinc';
import { doNavigate } from 'redux/actions/navigation';
import { selectAllMyClaimsByOutpoint, doNotify } from 'lbry-redux';
import {
selectAllMyClaimsByOutpoint,
doNotify,
selectTransactionListFilter,
doSetTransactionListFilter,
} from 'lbry-redux';
import TransactionList from './view';
const select = state => ({
rewards: selectClaimedRewardsByTransactionId(state),
myClaims: selectAllMyClaimsByOutpoint(state),
filterSetting: selectTransactionListFilter(state),
});
const perform = dispatch => ({
navigate: (path, params) => dispatch(doNavigate(path, params)),
openModal: (modal, props) => dispatch(doNotify(modal, props)),
setTransactionFilter: filterSetting => dispatch(doSetTransactionListFilter(filterSetting)),
});
export default connect(

View file

@ -25,20 +25,14 @@ type Props = {
rewards: {},
openModal: ({ id: string }, { nout: number, txid: string }) => void,
myClaims: any,
filterSetting: string,
setTransactionFilter: string => void,
};
type State = {
filter: string,
};
class TransactionList extends React.PureComponent<Props, State> {
class TransactionList extends React.PureComponent<Props> {
constructor(props: Props) {
super(props);
this.state = {
filter: 'all',
};
(this: any).handleFilterChanged = this.handleFilterChanged.bind(this);
(this: any).filterTransaction = this.filterTransaction.bind(this);
(this: any).revokeClaim = this.revokeClaim.bind(this);
@ -50,15 +44,13 @@ class TransactionList extends React.PureComponent<Props, State> {
}
handleFilterChanged(event: SyntheticInputEvent<*>) {
this.setState({
filter: event.target.value,
});
this.props.setTransactionFilter(event.target.value);
}
filterTransaction(transaction: Transaction) {
const { filter } = this.state;
return filter === 'all' || filter === transaction.type;
return (
this.props.filterSetting === TRANSACTIONS.ALL || this.props.filterSetting === transaction.type
);
}
isRevokeable(txid: string, nout: number) {
@ -73,9 +65,12 @@ class TransactionList extends React.PureComponent<Props, State> {
}
render() {
const { emptyMessage, rewards, transactions, slim } = this.props;
const { filter } = this.state;
const { emptyMessage, rewards, transactions, slim, filterSetting } = this.props;
const transactionList = transactions.filter(this.filterTransaction);
// Flow offers little support for Object.values() typing.
// https://github.com/facebook/flow/issues/2221
// $FlowFixMe
const transactionTypes: Array<string> = Object.values(TRANSACTIONS);
return (
<React.Fragment>
@ -98,7 +93,7 @@ class TransactionList extends React.PureComponent<Props, State> {
<div className="card__actions-top-corner">
<FormField
type="select"
value={filter}
value={filterSetting || TRANSACTIONS.ALL}
onChange={this.handleFilterChanged}
affixClass="form-field--align-center"
prefix={__('Show')}
@ -111,31 +106,11 @@ class TransactionList extends React.PureComponent<Props, State> {
/>
}
>
<option value="all">{__('All')}</option>
<option value={TRANSACTIONS.SPEND}>
{__(`${this.capitalize(TRANSACTIONS.SPEND)}s`)}
</option>
<option value={TRANSACTIONS.RECEIVE}>
{__(`${this.capitalize(TRANSACTIONS.RECEIVE)}s`)}
</option>
<option value={TRANSACTIONS.PUBLISH}>
{__(`${this.capitalize(TRANSACTIONS.PUBLISH)}es`)}
</option>
<option value={TRANSACTIONS.CHANNEL}>
{__(`${this.capitalize(TRANSACTIONS.CHANNEL)}s`)}
</option>
<option value={TRANSACTIONS.TIP}>
{__(`${this.capitalize(TRANSACTIONS.TIP)}s`)}
</option>
<option value={TRANSACTIONS.SUPPORT}>
{__(`${this.capitalize(TRANSACTIONS.SUPPORT)}s`)}
</option>
<option value={TRANSACTIONS.UPDATE}>
{__(`${this.capitalize(TRANSACTIONS.UPDATE)}s`)}
</option>
<option value={TRANSACTIONS.ABANDON}>
{__(`${this.capitalize(TRANSACTIONS.ABANDON)}s`)}
</option>
{transactionTypes.map(tt => (
<option key={tt} value={tt}>
{__(`${this.capitalize(tt)}`)}
</option>
))}
</FormField>
</div>
)}