split hidden coins, toggle all

pull/513/head
Vladimir Volek 5 years ago
parent 59a3284e67
commit e32d7a32bd

@ -60,6 +60,7 @@ const KEY_LANGUAGE: string = `${STORAGE_PATH}language`;
const KEY_LOCAL_CURRENCY: string = `${STORAGE_PATH}localCurrency`; const KEY_LOCAL_CURRENCY: string = `${STORAGE_PATH}localCurrency`;
const KEY_HIDE_BALANCE: string = `${STORAGE_PATH}hideBalance`; const KEY_HIDE_BALANCE: string = `${STORAGE_PATH}hideBalance`;
const KEY_HIDDEN_COINS: string = `${STORAGE_PATH}hiddenCoins`; 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 // https://github.com/STRML/react-localstorage/blob/master/react-localstorage.js
// or // or
@ -247,13 +248,18 @@ const loadStorageData = (): ThunkAction => (dispatch: Dispatch): void => {
}); });
} }
const hiddenCoins = getHiddenCoins(); const hiddenCoins = getHiddenCoins(false);
if (hiddenCoins) { dispatch({
dispatch({ type: WALLET.SET_HIDDEN_COINS,
type: WALLET.SET_HIDDEN_COINS, hiddenCoins,
hiddenCoins, });
});
} const isExternal = true;
const hiddenCoinsExternal = getHiddenCoins(isExternal);
dispatch({
type: WALLET.SET_HIDDEN_COINS_EXTERNAL,
hiddenCoinsExternal,
});
const userTokens: ?string = storageUtils.get(TYPE, KEY_TOKENS); const userTokens: ?string = storageUtils.get(TYPE, KEY_TOKENS);
if (userTokens) { if (userTokens) {
@ -360,9 +366,10 @@ export const getImportedAccounts = (): ?Array<Account> => {
export const handleCoinVisibility = ( export const handleCoinVisibility = (
coinShortcut: string, coinShortcut: string,
shouldBeVisible: boolean shouldBeVisible: boolean,
isExternal: boolean
): ThunkAction => (dispatch: Dispatch): void => { ): ThunkAction => (dispatch: Dispatch): void => {
const configuration: Array<string> = getHiddenCoins(); const configuration: Array<string> = getHiddenCoins(isExternal);
let newConfig: Array<string> = configuration; let newConfig: Array<string> = configuration;
const isAlreadyHidden = configuration.find(coin => coin === coinShortcut); const isAlreadyHidden = configuration.find(coin => coin === coinShortcut);
@ -372,45 +379,68 @@ export const handleCoinVisibility = (
newConfig = [...configuration, coinShortcut]; newConfig = [...configuration, coinShortcut];
} }
storageUtils.set(TYPE, KEY_HIDDEN_COINS, JSON.stringify(newConfig)); console.log(coinShortcut, shouldBeVisible, isExternal);
dispatch({
type: WALLET.SET_HIDDEN_COINS, if (isExternal) {
hiddenCoins: newConfig, 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 = (
checked: boolean,
allCoins: Array<string>, allCoins: Array<string>,
hiddenCoins: Array<string> checked: boolean,
isExternal: boolean
): ThunkAction => (dispatch: Dispatch) => { ): ThunkAction => (dispatch: Dispatch) => {
const configuration: Array<string> = getHiddenCoins(); if (checked && isExternal) {
const newConfig: Array<string> = configuration; dispatch({
let result = []; type: WALLET.SET_HIDDEN_COINS_EXTERNAL,
hiddenCoinsExternal: [],
console.log('old config', newConfig); });
storageUtils.set(TYPE, KEY_HIDDEN_COINS_EXTERNAL, JSON.stringify([]));
}
if (checked) { if (!checked && isExternal) {
const intersection = allCoins.filter(x => hiddenCoins.includes(x)); dispatch({
if (intersection) { type: WALLET.SET_HIDDEN_COINS_EXTERNAL,
result = newConfig.filter(x => !intersection.includes(x)); hiddenCoinsExternal: allCoins,
} });
} else { storageUtils.set(TYPE, KEY_HIDDEN_COINS_EXTERNAL, JSON.stringify(allCoins));
const intersection = allCoins.filter(x => hiddenCoins.includes(x));
console.log('intersection', intersection);
result = [configuration, ...intersection];
} }
dispatch({ if (checked && !isExternal) {
type: WALLET.SET_HIDDEN_COINS, dispatch({
hiddenCoins: result, type: WALLET.SET_HIDDEN_COINS,
}); hiddenCoins: [],
});
storageUtils.set(TYPE, KEY_HIDDEN_COINS, JSON.stringify([]));
}
storageUtils.set(TYPE, KEY_HIDDEN_COINS, JSON.stringify(result)); if (!checked && !isExternal) {
dispatch({
type: WALLET.SET_HIDDEN_COINS,
hiddenCoins: allCoins,
});
storageUtils.set(TYPE, KEY_HIDDEN_COINS, JSON.stringify(allCoins));
}
}; };
export const getHiddenCoins = (): Array<string> => { export const getHiddenCoins = (isExternal: boolean): Array<string> => {
const coinsConfig: ?string = storageUtils.get(TYPE, KEY_HIDDEN_COINS); let coinsConfig: ?string = '';
if (isExternal) {
coinsConfig = storageUtils.get(TYPE, KEY_HIDDEN_COINS_EXTERNAL);
} else {
coinsConfig = storageUtils.get(TYPE, KEY_HIDDEN_COINS);
}
if (coinsConfig) { if (coinsConfig) {
return JSON.parse(coinsConfig); return JSON.parse(coinsConfig);
} }

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

@ -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_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_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: 'wallet__set_hidden_coins' = 'wallet__set_hidden_coins';
export const SET_HIDDEN_COINS_EXTERNAL: 'wallet__set_hidden_coins_external' =
'wallet__set_hidden_coins_external';

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

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

@ -13,8 +13,9 @@ import l10nMessages from '../../index.messages';
type Props = { type Props = {
networks: Array<Network>, networks: Array<Network>,
hiddenCoins: Array<string>, hiddenCoins: Array<string>,
hiddenCoinsExternal: Array<string>,
handleCoinVisibility: typeof LocalStorageActions.handleCoinVisibility, handleCoinVisibility: typeof LocalStorageActions.handleCoinVisibility,
handleAllCoinsVisibility: typeof LocalStorageActions.handleAllCoinsVisibility, toggleGroupCoinsVisibility: typeof LocalStorageActions.toggleGroupCoinsVisibility,
}; };
const Wrapper = styled.div` const Wrapper = styled.div`
@ -118,16 +119,10 @@ const CoinsSettings = (props: Props) => (
.filter(x => !x.isHidden) .filter(x => !x.isHidden)
.map(item => item.shortcut); .map(item => item.shortcut);
props.handleAllCoinsVisibility( props.toggleGroupCoinsVisibility(allCoins, checked, false);
checked,
allCoins,
props.hiddenCoins
);
}} }}
> >
{props.hiddenCoins.every(val => props.networks.includes(val)) {props.hiddenCoins.length > 0 ? 'Show all' : 'Hide all'}
? 'Hide all'
: 'Show all'}
</ToggleAll> </ToggleAll>
</Right> </Right>
</Label> </Label>
@ -147,7 +142,11 @@ const CoinsSettings = (props: Props) => (
checkedIcon={false} checkedIcon={false}
uncheckedIcon={false} uncheckedIcon={false}
onChange={visible => { onChange={visible => {
props.handleCoinVisibility(network.shortcut, visible); props.handleCoinVisibility(
network.shortcut,
visible,
false
);
}} }}
checked={!props.hiddenCoins.includes(network.shortcut)} checked={!props.hiddenCoins.includes(network.shortcut)}
/> />
@ -180,11 +179,7 @@ const CoinsSettings = (props: Props) => (
.filter(x => !x.isHidden) .filter(x => !x.isHidden)
.map(coin => coin.id); .map(coin => coin.id);
props.handleAllCoinsVisibility( props.toggleGroupCoinsVisibility(allCoins, checked, true);
checked,
allCoins,
props.hiddenCoins
);
}} }}
> >
Show all Show all
@ -207,9 +202,9 @@ const CoinsSettings = (props: Props) => (
checkedIcon={false} checkedIcon={false}
uncheckedIcon={false} uncheckedIcon={false}
onChange={visible => { onChange={visible => {
props.handleCoinVisibility(network.id, visible); props.handleCoinVisibility(network.id, visible, true);
}} }}
checked={!props.hiddenCoins.includes(network.id)} checked={!props.hiddenCoinsExternal.includes(network.id)}
/> />
</Right> </Right>
</CoinRow> </CoinRow>

@ -120,8 +120,9 @@ const WalletSettings = (props: Props) => (
<Coins <Coins
networks={props.localStorage.config.networks} networks={props.localStorage.config.networks}
handleCoinVisibility={props.handleCoinVisibility} handleCoinVisibility={props.handleCoinVisibility}
handleAllCoinsVisibility={props.handleAllCoinsVisibility} toggleGroupCoinsVisibility={props.toggleGroupCoinsVisibility}
hiddenCoins={props.wallet.hiddenCoins} hiddenCoins={props.wallet.hiddenCoins}
hiddenCoinsExternal={props.wallet.hiddenCoinsExternal}
/> />
</Section> </Section>
<Actions> <Actions>

Loading…
Cancel
Save