arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2025-03-20 18:16:10 +00:00
Code Issues Releases Wiki Activity

merge

Browse Source
This commit is contained in:
Vladimir Volek 2019-04-24 14:47:48 +02:00
commit 5437ddb9f2
8 changed files with 267 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

93
src/actions/LocalStorageActions.js
View File

@ -12,7 +12,6 @@ import * as buildUtils from 'utils/build';
import * as storageUtils from 'utils/storage';
import * as WalletActions from 'actions/WalletActions';
import * as l10nUtils from 'utils/l10n';
import { getAccountTokens } from 'reducers/utils';
import type { Account } from 'reducers/AccountsReducer';
import type { Token } from 'reducers/TokensReducer';
@ -61,6 +60,7 @@ const KEY_LANGUAGE: string = `${STORAGE_PATH}language`;
const KEY_LOCAL_CURRENCY: string = `${STORAGE_PATH}localCurrency`;
const KEY_HIDE_BALANCE: string = `${STORAGE_PATH}hideBalance`;
const KEY_HIDDEN_COINS: string = `${STORAGE_PATH}hiddenCoins`;
const KEY_HIDDEN_COINS_EXTERNAL: string = `${STORAGE_PATH}hiddenCoinsExternal`;
// https://github.com/STRML/react-localstorage/blob/master/react-localstorage.js
// or
@ -248,13 +248,18 @@ const loadStorageData = (): ThunkAction => (dispatch: Dispatch): void => {
});
}
const hiddenCoins = getHiddenCoins();
if (hiddenCoins) {
dispatch({
type: WALLET.SET_HIDDEN_COINS,
hiddenCoins,
});
}
const hiddenCoins = getHiddenCoins(false);
dispatch({
type: WALLET.SET_HIDDEN_COINS,
hiddenCoins,
});
const isExternal = true;
const hiddenCoinsExternal = getHiddenCoins(isExternal);
dispatch({
type: WALLET.SET_HIDDEN_COINS_EXTERNAL,
hiddenCoinsExternal,
});
const userTokens: ?string = storageUtils.get(TYPE, KEY_TOKENS);
if (userTokens) {
@ -361,9 +366,10 @@ export const getImportedAccounts = (): ?Array<Account> => {
export const handleCoinVisibility = (
coinShortcut: string,
shouldBeVisible: boolean
shouldBeVisible: boolean,
isExternal: boolean
): ThunkAction => (dispatch: Dispatch): void => {
const configuration: Array<string> = getHiddenCoins();
const configuration: Array<string> = getHiddenCoins(isExternal);
let newConfig: Array<string> = configuration;
const isAlreadyHidden = configuration.find(coin => coin === coinShortcut);
@ -373,17 +379,68 @@ export const handleCoinVisibility = (
newConfig = [...configuration, coinShortcut];
}
storageUtils.set(TYPE, KEY_HIDDEN_COINS, JSON.stringify(newConfig));
dispatch({
type: WALLET.SET_HIDDEN_COINS,
hiddenCoins: newConfig,
});
if (isExternal) {
storageUtils.set(TYPE, KEY_HIDDEN_COINS_EXTERNAL, JSON.stringify(newConfig));
dispatch({
type: WALLET.SET_HIDDEN_COINS_EXTERNAL,
hiddenCoinsExternal: newConfig,
});
} else {
storageUtils.set(TYPE, KEY_HIDDEN_COINS, JSON.stringify(newConfig));
dispatch({
type: WALLET.SET_HIDDEN_COINS,
hiddenCoins: newConfig,
});
}
};
// export const handleAllCoinsVisibility => ();
export const toggleGroupCoinsVisibility = (
allCoins: Array<string>,
checked: boolean,
isExternal: boolean
): ThunkAction => (dispatch: Dispatch) => {
// supported coins
if (checked && !isExternal) {
dispatch({
type: WALLET.SET_HIDDEN_COINS,
hiddenCoins: [],
});
storageUtils.set(TYPE, KEY_HIDDEN_COINS, JSON.stringify([]));
}
export const getHiddenCoins = (): Array<string> => {
const coinsConfig: ?string = storageUtils.get(TYPE, KEY_HIDDEN_COINS);
if (!checked && !isExternal) {
dispatch({
type: WALLET.SET_HIDDEN_COINS,
hiddenCoins: allCoins,
});
storageUtils.set(TYPE, KEY_HIDDEN_COINS, JSON.stringify(allCoins));
}
// external coins
if (checked && isExternal) {
dispatch({
type: WALLET.SET_HIDDEN_COINS_EXTERNAL,
hiddenCoinsExternal: [],
});
storageUtils.set(TYPE, KEY_HIDDEN_COINS_EXTERNAL, JSON.stringify([]));
}
if (!checked && isExternal) {
dispatch({
type: WALLET.SET_HIDDEN_COINS_EXTERNAL,
hiddenCoinsExternal: allCoins,
});
storageUtils.set(TYPE, KEY_HIDDEN_COINS_EXTERNAL, JSON.stringify(allCoins));
}
};
export const getHiddenCoins = (isExternal: boolean): Array<string> => {
let coinsConfig: ?string = '';
if (isExternal) {
coinsConfig = storageUtils.get(TYPE, KEY_HIDDEN_COINS_EXTERNAL);
} else {
coinsConfig = storageUtils.get(TYPE, KEY_HIDDEN_COINS);
}
if (coinsConfig) {
return JSON.parse(coinsConfig);
}

4
src/actions/WalletActions.js
View File

@ -29,6 +29,10 @@ export type WalletAction =
type: typeof WALLET.SET_HIDDEN_COINS,
hiddenCoins: Array<string>,
}
| {
type: typeof WALLET.SET_HIDDEN_COINS_EXTERNAL,
hiddenCoinsExternal: Array<string>,
}
| {
type: typeof WALLET.TOGGLE_DEVICE_DROPDOWN,
opened: boolean,

2
src/actions/constants/wallet.js
View File

@ -20,3 +20,5 @@ export const SET_LANGUAGE: 'wallet__set_language' = 'wallet__set_language';
export const SET_LOCAL_CURRENCY: 'wallet__set_local_currency' = 'wallet__set_local_currency';
export const SET_HIDE_BALANCE: 'wallet__set_hide_balance' = 'wallet__set_hide_balance';
export const SET_HIDDEN_COINS: 'wallet__set_hidden_coins' = 'wallet__set_hidden_coins';
export const SET_HIDDEN_COINS_EXTERNAL: 'wallet__set_hidden_coins_external' =
'wallet__set_hidden_coins_external';

8
src/reducers/WalletReducer.js
View File

@ -25,6 +25,7 @@ type State = {
disconnectRequest: ?TrezorDevice,
selectedDevice: ?TrezorDevice,
hiddenCoins: Array<string>,
hiddenCoinsExternal: Array<string>,
};
const initialState: State = {
@ -43,6 +44,7 @@ const initialState: State = {
disconnectRequest: null,
selectedDevice: null,
hiddenCoins: [],
hiddenCoinsExternal: [],
};
export default function wallet(state: State = initialState, action: Action): State {
@ -153,6 +155,12 @@ export default function wallet(state: State = initialState, action: Action): Sta
hiddenCoins: action.hiddenCoins,
};
case WALLET.SET_HIDDEN_COINS_EXTERNAL:
return {
...state,
hiddenCoinsExternal: action.hiddenCoinsExternal,
};
default:
return state;
}

8
src/views/Wallet/components/LeftNavigation/components/CoinMenu/index.js
View File

@ -56,11 +56,11 @@ class CoinMenu extends PureComponent<Props> {
}
getOtherCoins() {
const { hiddenCoins } = this.props.wallet;
const { hiddenCoinsExternal } = this.props.wallet;
return coins
.sort((a, b) => a.order - b.order)
.filter(item => !item.isHidden) // hide coins globally in config
.filter(item => !hiddenCoins.includes(item.id))
.filter(item => !hiddenCoinsExternal.includes(item.id))
.map(coin => {
const row = (
<RowCoin
@ -102,10 +102,10 @@ class CoinMenu extends PureComponent<Props> {
}
isBottomMenuEmpty() {
const { hiddenCoins } = this.props.wallet;
const { hiddenCoinsExternal } = this.props.wallet;
const numberOfVisibleNetworks = coins
.filter(item => !item.isHidden)
.filter(item => !hiddenCoins.includes(item.id));
.filter(item => !hiddenCoinsExternal.includes(item.id));
return numberOfVisibleNetworks.length <= 0;
}

10
src/views/Wallet/views/WalletSettings/Container.js
View File

@ -23,7 +23,7 @@ type DispatchProps = {|
setLocalCurrency: typeof WalletActions.setLocalCurrency,
setHideBalance: typeof WalletActions.setHideBalance,
handleCoinVisibility: typeof LocalStorageActions.handleCoinVisibility,
// handleAllCoinsVisibility: typeof LocalStorageActions.handleAllCoinsVisibility,
toggleGroupCoinsVisibility: typeof LocalStorageActions.toggleGroupCoinsVisibility,
|};
export type Props = {| ...OwnProps, ...StateProps, ...DispatchProps |};
@ -38,10 +38,10 @@ const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({
setLocalCurrency: bindActionCreators(WalletActions.setLocalCurrency, dispatch),
setHideBalance: bindActionCreators(WalletActions.setHideBalance, dispatch),
handleCoinVisibility: bindActionCreators(LocalStorageActions.handleCoinVisibility, dispatch),
// handleAllCoinsVisibility: bindActionCreators(
// LocalStorageActions.handleAllCoinsVisibility,
// dispatch
// ),
toggleGroupCoinsVisibility: bindActionCreators(
LocalStorageActions.toggleGroupCoinsVisibility,
dispatch
),
});
export default injectIntl<OwnProps>(

248
src/views/Wallet/views/WalletSettings/components/Coins/index.js
View File

@ -1,6 +1,6 @@
/* @flow */
import styled from 'styled-components';
import React from 'react';
import React, { PureComponent } from 'react';
import { FormattedMessage } from 'react-intl';
import { FONT_SIZE } from 'config/variables';
import coins from 'constants/coins';
@ -13,7 +13,14 @@ import l10nMessages from '../../index.messages';
type Props = {
networks: Array<Network>,
hiddenCoins: Array<string>,
hiddenCoinsExternal: Array<string>,
handleCoinVisibility: typeof LocalStorageActions.handleCoinVisibility,
toggleGroupCoinsVisibility: typeof LocalStorageActions.toggleGroupCoinsVisibility,
};
type State = {
showAllCoins: boolean,
showAllCoinsExternal: boolean,
};
const Wrapper = styled.div`
@ -85,99 +92,170 @@ const LogoWrapper = styled.div`
align-items: center;
`;
const CoinsSettings = (props: Props) => (
<Wrapper>
<Row>
<Content>
<Label>
<Left>
<FormattedMessage {...l10nMessages.TR_VISIBLE_COINS} />
<Tooltip
content={
<FormattedMessage {...l10nMessages.TR_VISIBLE_COINS_EXPLAINED} />
}
maxWidth={210}
placement="right"
>
<TooltipIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
</Tooltip>
</Left>
<Right />
</Label>
{props.networks
.filter(network => !network.isHidden)
.map(network => (
<CoinRow key={network.shortcut}>
const ToggleAll = styled.div`
cursor: pointer;
`;
class CoinsSettings extends PureComponent<Props, State> {
constructor(props: Props) {
super(props);
this.state = {
showAllCoins: this.props.hiddenCoins.length === 0,
showAllCoinsExternal: this.props.hiddenCoinsExternal.length === 0,
};
}
render() {
const { props } = this;
return (
<Wrapper>
<Row>
<Content>
<Label>
<Left>
<LogoWrapper>
<CoinLogo height="23" network={network.shortcut} />
</LogoWrapper>
<Name>{network.name}</Name>
<FormattedMessage {...l10nMessages.TR_VISIBLE_COINS} />
<Tooltip
content={
<FormattedMessage
{...l10nMessages.TR_VISIBLE_COINS_EXPLAINED}
/>
}
maxWidth={210}
placement="right"
>
<TooltipIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
</Tooltip>
</Left>
<Right>
<Switch
isSmall
checkedIcon={false}
uncheckedIcon={false}
onChange={visible => {
props.handleCoinVisibility(network.shortcut, visible);
<ToggleAll
onClick={() => {
const allCoins = props.networks
.filter(x => !x.isHidden)
.map(item => item.shortcut);
props.toggleGroupCoinsVisibility(
allCoins,
!this.state.showAllCoins,
false
);
this.setState(prevState => ({
showAllCoins: !prevState.showAllCoins,
}));
}}
checked={!props.hiddenCoins.includes(network.shortcut)}
/>
>
{props.hiddenCoins.length > 0 ? 'Show all' : 'Hide all'}
</ToggleAll>
</Right>
</CoinRow>
))}
</Content>
<Content>
<Label>
<Left>
<FormattedMessage {...l10nMessages.TR_VISIBLE_COINS_EXTERNAL} />
<Tooltip
content={
<FormattedMessage {...l10nMessages.TR_VISIBLE_COINS_EXPLAINED} />
}
maxWidth={210}
placement="right"
>
<TooltipIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
</Tooltip>
</Left>
<Right />
</Label>
{coins
.sort((a, b) => a.order - b.order)
.map(network => (
<CoinRow key={network.id}>
</Label>
{props.networks
.filter(network => !network.isHidden)
.map(network => (
<CoinRow key={network.shortcut}>
<Left>
<LogoWrapper>
<CoinLogo height="23" network={network.shortcut} />
</LogoWrapper>
<Name>{network.name}</Name>
</Left>
<Right>
<Switch
isSmall
checkedIcon={false}
uncheckedIcon={false}
onChange={visible => {
props.handleCoinVisibility(
network.shortcut,
visible,
false
);
}}
checked={!props.hiddenCoins.includes(network.shortcut)}
/>
</Right>
</CoinRow>
))}
</Content>
<Content>
<Label>
<Left>
<LogoWrapper>
<CoinLogo height="23" network={network.id} />
</LogoWrapper>
<Name>{network.coinName}</Name>
<FormattedMessage {...l10nMessages.TR_VISIBLE_COINS_EXTERNAL} />
<Tooltip
content={
<FormattedMessage
{...l10nMessages.TR_VISIBLE_COINS_EXPLAINED}
/>
}
maxWidth={210}
placement="right"
>
<TooltipIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
</Tooltip>
</Left>
<Right>
<Switch
isSmall
checkedIcon={false}
uncheckedIcon={false}
onChange={visible => {
props.handleCoinVisibility(network.id, visible);
<ToggleAll
onClick={() => {
const allCoins = coins
.filter(x => !x.isHidden)
.map(coin => coin.id);
props.toggleGroupCoinsVisibility(
allCoins,
!this.state.showAllCoinsExternal,
true
);
this.setState(prevState => ({
showAllCoinsExternal: !prevState.showAllCoinsExternal,
}));
}}
checked={!props.hiddenCoins.includes(network.id)}
/>
>
{props.hiddenCoinsExternal.length > 0 ? 'Show all' : 'Hide all'}
</ToggleAll>
</Right>
</CoinRow>
))}
</Content>
</Row>
</Wrapper>
);
</Label>
{coins
.sort((a, b) => a.order - b.order)
.map(network => (
<CoinRow key={network.id}>
<Left>
<LogoWrapper>
<CoinLogo height="23" network={network.id} />
</LogoWrapper>
<Name>{network.coinName}</Name>
</Left>
<Right>
<Switch
isSmall
checkedIcon={false}
uncheckedIcon={false}
onChange={visible => {
props.handleCoinVisibility(
network.id,
visible,
true
);
}}
checked={
!props.hiddenCoinsExternal.includes(network.id)
}
/>
</Right>
</CoinRow>
))}
</Content>
</Row>
</Wrapper>
);
}
}
export default CoinsSettings;

7
src/views/Wallet/views/WalletSettings/index.js
View File

@ -73,7 +73,10 @@ const TooltipIcon = styled(Icon)`
`;
const buildCurrencyOption = currency => {
return { value: currency, label: currency.toUpperCase() };
return {
value: currency,
label: currency.toUpperCase(),
};
};
const WalletSettings = (props: Props) => (
@ -117,7 +120,9 @@ const WalletSettings = (props: Props) => (
<Coins
networks={props.localStorage.config.networks}
handleCoinVisibility={props.handleCoinVisibility}
toggleGroupCoinsVisibility={props.toggleGroupCoinsVisibility}
hiddenCoins={props.wallet.hiddenCoins}
hiddenCoinsExternal={props.wallet.hiddenCoinsExternal}
/>
</Section>
<Actions>