From e32d7a32bd386496c67e665d30ec8f569c45ec4a Mon Sep 17 00:00:00 2001 From: Vladimir Volek Date: Wed, 24 Apr 2019 14:05:07 +0200 Subject: [PATCH] split hidden coins, toggle all --- src/actions/LocalStorageActions.js | 106 +++++++++++------- src/actions/WalletActions.js | 4 + src/actions/constants/wallet.js | 2 + src/reducers/WalletReducer.js | 8 ++ .../Wallet/views/WalletSettings/Container.js | 6 +- .../WalletSettings/components/Coins/index.js | 29 ++--- .../Wallet/views/WalletSettings/index.js | 3 +- 7 files changed, 99 insertions(+), 59 deletions(-) diff --git a/src/actions/LocalStorageActions.js b/src/actions/LocalStorageActions.js index d4f3badf..c2fb7790 100644 --- a/src/actions/LocalStorageActions.js +++ b/src/actions/LocalStorageActions.js @@ -60,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 @@ -247,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) { @@ -360,9 +366,10 @@ export const getImportedAccounts = (): ?Array => { export const handleCoinVisibility = ( coinShortcut: string, - shouldBeVisible: boolean + shouldBeVisible: boolean, + isExternal: boolean ): ThunkAction => (dispatch: Dispatch): void => { - const configuration: Array = getHiddenCoins(); + const configuration: Array = getHiddenCoins(isExternal); let newConfig: Array = configuration; const isAlreadyHidden = configuration.find(coin => coin === coinShortcut); @@ -372,45 +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, - }); + console.log(coinShortcut, shouldBeVisible, isExternal); + + 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 = ( - checked: boolean, +export const toggleGroupCoinsVisibility = ( allCoins: Array, - hiddenCoins: Array + checked: boolean, + isExternal: boolean ): ThunkAction => (dispatch: Dispatch) => { - const configuration: Array = getHiddenCoins(); - const newConfig: Array = configuration; - let result = []; - - console.log('old config', newConfig); + if (checked && isExternal) { + dispatch({ + type: WALLET.SET_HIDDEN_COINS_EXTERNAL, + hiddenCoinsExternal: [], + }); + storageUtils.set(TYPE, KEY_HIDDEN_COINS_EXTERNAL, JSON.stringify([])); + } - if (checked) { - const intersection = allCoins.filter(x => hiddenCoins.includes(x)); - if (intersection) { - result = newConfig.filter(x => !intersection.includes(x)); - } - } else { - const intersection = allCoins.filter(x => hiddenCoins.includes(x)); - console.log('intersection', intersection); - result = [configuration, ...intersection]; + if (!checked && isExternal) { + dispatch({ + type: WALLET.SET_HIDDEN_COINS_EXTERNAL, + hiddenCoinsExternal: allCoins, + }); + storageUtils.set(TYPE, KEY_HIDDEN_COINS_EXTERNAL, JSON.stringify(allCoins)); } - dispatch({ - type: WALLET.SET_HIDDEN_COINS, - hiddenCoins: result, - }); + if (checked && !isExternal) { + dispatch({ + 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 => { - const coinsConfig: ?string = storageUtils.get(TYPE, KEY_HIDDEN_COINS); +export const getHiddenCoins = (isExternal: boolean): Array => { + 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); } diff --git a/src/actions/WalletActions.js b/src/actions/WalletActions.js index 221c7c1d..ed84b5e8 100644 --- a/src/actions/WalletActions.js +++ b/src/actions/WalletActions.js @@ -29,6 +29,10 @@ export type WalletAction = type: typeof WALLET.SET_HIDDEN_COINS, hiddenCoins: Array, } + | { + type: typeof WALLET.SET_HIDDEN_COINS_EXTERNAL, + hiddenCoinsExternal: Array, + } | { type: typeof WALLET.TOGGLE_DEVICE_DROPDOWN, opened: boolean, diff --git a/src/actions/constants/wallet.js b/src/actions/constants/wallet.js index a32cddfa..562cd539 100644 --- a/src/actions/constants/wallet.js +++ b/src/actions/constants/wallet.js @@ -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'; diff --git a/src/reducers/WalletReducer.js b/src/reducers/WalletReducer.js index 9a940e0a..04d3a15e 100644 --- a/src/reducers/WalletReducer.js +++ b/src/reducers/WalletReducer.js @@ -25,6 +25,7 @@ type State = { disconnectRequest: ?TrezorDevice, selectedDevice: ?TrezorDevice, hiddenCoins: Array, + hiddenCoinsExternal: Array, }; 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; } diff --git a/src/views/Wallet/views/WalletSettings/Container.js b/src/views/Wallet/views/WalletSettings/Container.js index 0e185bb6..56a5a4ff 100644 --- a/src/views/Wallet/views/WalletSettings/Container.js +++ b/src/views/Wallet/views/WalletSettings/Container.js @@ -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,8 +38,8 @@ const mapDispatchToProps = (dispatch: Dispatch): DispatchProps => ({ setLocalCurrency: bindActionCreators(WalletActions.setLocalCurrency, dispatch), setHideBalance: bindActionCreators(WalletActions.setHideBalance, dispatch), handleCoinVisibility: bindActionCreators(LocalStorageActions.handleCoinVisibility, dispatch), - handleAllCoinsVisibility: bindActionCreators( - LocalStorageActions.handleAllCoinsVisibility, + toggleGroupCoinsVisibility: bindActionCreators( + LocalStorageActions.toggleGroupCoinsVisibility, dispatch ), }); diff --git a/src/views/Wallet/views/WalletSettings/components/Coins/index.js b/src/views/Wallet/views/WalletSettings/components/Coins/index.js index 8b86ed2f..c2215c06 100644 --- a/src/views/Wallet/views/WalletSettings/components/Coins/index.js +++ b/src/views/Wallet/views/WalletSettings/components/Coins/index.js @@ -13,8 +13,9 @@ import l10nMessages from '../../index.messages'; type Props = { networks: Array, hiddenCoins: Array, + hiddenCoinsExternal: Array, handleCoinVisibility: typeof LocalStorageActions.handleCoinVisibility, - handleAllCoinsVisibility: typeof LocalStorageActions.handleAllCoinsVisibility, + toggleGroupCoinsVisibility: typeof LocalStorageActions.toggleGroupCoinsVisibility, }; const Wrapper = styled.div` @@ -118,16 +119,10 @@ const CoinsSettings = (props: Props) => ( .filter(x => !x.isHidden) .map(item => item.shortcut); - props.handleAllCoinsVisibility( - checked, - allCoins, - props.hiddenCoins - ); + props.toggleGroupCoinsVisibility(allCoins, checked, false); }} > - {props.hiddenCoins.every(val => props.networks.includes(val)) - ? 'Hide all' - : 'Show all'} + {props.hiddenCoins.length > 0 ? 'Show all' : 'Hide all'} @@ -147,7 +142,11 @@ const CoinsSettings = (props: Props) => ( checkedIcon={false} uncheckedIcon={false} onChange={visible => { - props.handleCoinVisibility(network.shortcut, visible); + props.handleCoinVisibility( + network.shortcut, + visible, + false + ); }} checked={!props.hiddenCoins.includes(network.shortcut)} /> @@ -180,11 +179,7 @@ const CoinsSettings = (props: Props) => ( .filter(x => !x.isHidden) .map(coin => coin.id); - props.handleAllCoinsVisibility( - checked, - allCoins, - props.hiddenCoins - ); + props.toggleGroupCoinsVisibility(allCoins, checked, true); }} > Show all @@ -207,9 +202,9 @@ const CoinsSettings = (props: Props) => ( checkedIcon={false} uncheckedIcon={false} 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)} /> diff --git a/src/views/Wallet/views/WalletSettings/index.js b/src/views/Wallet/views/WalletSettings/index.js index 677cd5f2..a9b4626b 100644 --- a/src/views/Wallet/views/WalletSettings/index.js +++ b/src/views/Wallet/views/WalletSettings/index.js @@ -120,8 +120,9 @@ const WalletSettings = (props: Props) => (