LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

improve wallet list ui/ux #4008

Merged
jessopb merged 1 commit from fix-txFilter into master 2020-04-16 22:36:41 +02:00
Conversation 0 Commits 1 Files changed 2 +42 -33
2 changed files with 42 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ui/component/transactionListTable/internal/txo-list-item.jsx
View file

@ -120,7 +120,7 @@ class TxoListItem extends React.PureComponent<Props, State> {
<td className="table__item--actionable"> <td className="table__item--actionable">
<span> <span>
{(isTip && __(toCapitalCase('tip'))) || {(isTip && __(toCapitalCase('tip'))) ||
(valueType && __(toCapitalCase(valueType))) || (valueType && ((valueType === 'stream' && __('Publish')) || __(toCapitalCase(valueType)))) ||
(type && __(toCapitalCase(type)))} (type && __(toCapitalCase(type)))}
</span>{' '} </span>{' '}
{isRevokeable && this.getLink(type)} {isRevokeable && this.getLink(type)}

73
ui/component/txoList/view.jsx
View file

@ -43,6 +43,11 @@ function TxoList(props: Props) {
subtype, subtype,
}; };
const hideStatus =
type === TXO.SENT ||
(currentUrlParams.type === TXO.RECEIVED &&
(currentUrlParams.subtype === TXO.PAYMENT || currentUrlParams.subtype === TXO.PURCHASE));
const params = {}; const params = {};
if (currentUrlParams.type) { if (currentUrlParams.type) {
if (currentUrlParams.type === TXO.ALL) { if (currentUrlParams.type === TXO.ALL) {
@ -54,7 +59,7 @@ function TxoList(props: Props) {
params[TXO.TX_TYPE] = TXO.SUPPORT; params[TXO.TX_TYPE] = TXO.SUPPORT;
} else if (currentUrlParams.subtype === TXO.PURCHASE) { } else if (currentUrlParams.subtype === TXO.PURCHASE) {
params[TXO.TX_TYPE] = TXO.PURCHASE; params[TXO.TX_TYPE] = TXO.PURCHASE;
} else if (currentUrlParams.subtype === TXO.PURCHASE) { } else if (currentUrlParams.subtype === TXO.PAYMENT) {
params[TXO.TX_TYPE] = TXO.OTHER; params[TXO.TX_TYPE] = TXO.OTHER;
} else { } else {
params[TXO.TX_TYPE] = [TXO.OTHER, TXO.PURCHASE, TXO.SUPPORT]; params[TXO.TX_TYPE] = [TXO.OTHER, TXO.PURCHASE, TXO.SUPPORT];
@ -89,6 +94,7 @@ function TxoList(props: Props) {
params[TXO.IS_NOT_SPENT] = true; params[TXO.IS_NOT_SPENT] = true;
} }
} }
if (currentUrlParams.page) params[TXO.PAGE] = Number(page); if (currentUrlParams.page) params[TXO.PAGE] = Number(page);
if (currentUrlParams.pageSize) params[TXO.PAGE_SIZE] = Number(pageSize); if (currentUrlParams.pageSize) params[TXO.PAGE_SIZE] = Number(pageSize);
@ -115,6 +121,7 @@ function TxoList(props: Props) {
case TXO.TYPE: case TXO.TYPE:
newUrlParams.set(TXO.TYPE, delta.value); newUrlParams.set(TXO.TYPE, delta.value);
if (delta.value === TXO.SENT || delta.value === TXO.RECEIVED) { if (delta.value === TXO.SENT || delta.value === TXO.RECEIVED) {
newUrlParams.set(TXO.ACTIVE, 'all');
if (currentUrlParams.subtype) { if (currentUrlParams.subtype) {
newUrlParams.set(TXO.SUB_TYPE, currentUrlParams.subtype); newUrlParams.set(TXO.SUB_TYPE, currentUrlParams.subtype);
} else { } else {
@ -213,37 +220,39 @@ function TxoList(props: Props) {
</FormField> </FormField>
</div> </div>
)} )}
<div> {!hideStatus && (
<fieldset-section> <div>
<label>Status</label> <fieldset-section>
<div className={'txo__radios'}> <label>Status</label>
<Button <div className={'txo__radios'}>
button="alt" <Button
onClick={e => handleChange({ dkey: TXO.ACTIVE, value: 'active' })} button="alt"
className={classnames(`button-toggle`, { onClick={e => handleChange({ dkey: TXO.ACTIVE, value: 'active' })}
'button-toggle--active': active === TXO.ACTIVE, className={classnames(`button-toggle`, {
})} 'button-toggle--active': active === TXO.ACTIVE,
label={__('Active')} })}
/> label={__('Active')}
<Button />
button="alt" <Button
onClick={e => handleChange({ dkey: TXO.ACTIVE, value: 'spent' })} button="alt"
className={classnames(`button-toggle`, { onClick={e => handleChange({ dkey: TXO.ACTIVE, value: 'spent' })}
'button-toggle--active': active === 'spent', className={classnames(`button-toggle`, {
})} 'button-toggle--active': active === 'spent',
label={__('Historical')} })}
/> label={__('Historical')}
<Button />
button="alt" <Button
onClick={e => handleChange({ dkey: TXO.ACTIVE, value: 'all' })} button="alt"
className={classnames(`button-toggle`, { onClick={e => handleChange({ dkey: TXO.ACTIVE, value: 'all' })}
'button-toggle--active': active === 'all', className={classnames(`button-toggle`, {
})} 'button-toggle--active': active === 'all',
label={__('All')} })}
/> label={__('All')}
</div> />
</fieldset-section> </div>
</div> </fieldset-section>
</div>
)}
</div> </div>
</div> </div>
<TransactionListTable txos={txoPage} /> <TransactionListTable txos={txoPage} />