From f32d51f72741c023c51b03cf5c1f6c3c57720cda Mon Sep 17 00:00:00 2001 From: Dima Date: Tue, 19 Dec 2023 20:26:47 +0300 Subject: [PATCH] fix(sigma, keys ): owner balance, double add (#1072) --- .../Header/SwitchAccount/SwitchAccount.tsx | 15 +- .../sigma/hooks/useGetBalanceBostrom.ts | 25 +-- .../sigma/hooks/useGetBalanceMainToken.js | 28 +-- src/containers/sigma/hooks/utils.js | 19 +- src/containers/sigma/index.tsx | 2 +- .../adviser/AdviserContainer.module.scss | 3 + src/pages/Keys/ActionBar/actionBarConnect.tsx | 183 +++--------------- src/redux/features/pocket.ts | 76 +++++++- src/types/defaultAccount.d.ts | 4 +- 9 files changed, 142 insertions(+), 213 deletions(-) diff --git a/src/containers/application/Header/SwitchAccount/SwitchAccount.tsx b/src/containers/application/Header/SwitchAccount/SwitchAccount.tsx index b9d457c1f..cb8e8fc9e 100644 --- a/src/containers/application/Header/SwitchAccount/SwitchAccount.tsx +++ b/src/containers/application/Header/SwitchAccount/SwitchAccount.tsx @@ -1,6 +1,6 @@ import React, { useMemo, useRef } from 'react'; import cx from 'classnames'; -import { Link } from 'react-router-dom'; +import { Link, useLocation } from 'react-router-dom'; import { usePopperTooltip } from 'react-popper-tooltip'; import { Transition } from 'react-transition-group'; @@ -28,6 +28,7 @@ function AccountItem({ link, }) { const address = data?.cyber?.bech32; + const location = useLocation(); const { passport } = usePassportByAddress(address); @@ -41,13 +42,15 @@ function AccountItem({ setControlledVisible(false); } + const robotPath = nickname + ? routes.robotPassport.getLink(nickname) + : routes.robot.path; + + const linkToRobot = location.pathname.includes('@') ? robotPath : undefined; + return ( ) { const { marketData } = useAppData(); const { traseDenom } = useIbcDenom(); const { balance: balanceMainToken, loading: loadingMalin } = @@ -24,14 +25,15 @@ function useGetBalanceBostrom(address) { const [balances, setBalances] = useState({}); useEffect(() => { - if (address !== null) { - const { bech32 } = address; - const keyLs = `lastBalances-${bech32}`; + if (address) { + const keyLs = `lastBalances-${address}`; const lastBalancesLs = localStorage.getItem(keyLs); - if (!loadingToken && !loadingMalin) { + if (!loadingMalin && !loadingToken) { let dataResult = {}; - const mainToken = { [CYBER.DENOM_CYBER]: { ...balanceMainToken } }; + const mainToken = { + [CYBER.DENOM_CYBER]: { ...balanceMainToken }, + }; const dataResultTemp = { ...mainToken, ...balanceToken }; const tempData = getBalanceMarket(dataResultTemp); dataResult = { ...tempData }; @@ -39,7 +41,7 @@ function useGetBalanceBostrom(address) { if (Object.keys(dataResult).length > 0) { localStorage.setItem(keyLs, JSON.stringify(dataResult)); } - } else if (lastBalancesLs !== null) { + } else if (lastBalancesLs) { const dataLs = JSON.parse(lastBalancesLs); setBalances(dataLs); } @@ -105,12 +107,11 @@ function useGetBalanceBostrom(address) { }, [balances]); useEffect(() => { - if (address !== null) { - const { bech32 } = address; - const keyLs = `lastCap-${bech32}`; + if (address) { + const keyLs = `lastCap-${address}`; const lastCapLs = localStorage.getItem(keyLs); let lastCap = new BigNumber(0); - if (lastCapLs !== null) { + if (lastCapLs) { lastCap = lastCap.plus(JSON.parse(lastCapLs)); } @@ -136,7 +137,7 @@ function useGetBalanceBostrom(address) { } } // eslint-disable-next-line react-hooks/exhaustive-deps - }, [useGetCapTokens]); + }, [useGetCapTokens, address]); return { totalAmountInLiquid, diff --git a/src/containers/sigma/hooks/useGetBalanceMainToken.js b/src/containers/sigma/hooks/useGetBalanceMainToken.js index eec57d76d..16b540533 100644 --- a/src/containers/sigma/hooks/useGetBalanceMainToken.js +++ b/src/containers/sigma/hooks/useGetBalanceMainToken.js @@ -1,38 +1,12 @@ -import BigNumber from 'bignumber.js'; -import { useEffect, useState } from 'react'; import { useQueryClient } from 'src/contexts/queryClient'; import { useGetBalance, initValueMainToken } from './utils'; function useGetBalanceMainToken(address) { const queryClient = useQueryClient(); const addressActive = address?.bech32 || address; - const [balance, setBalance] = useState({ ...initValueMainToken }); const data = useGetBalance(queryClient, addressActive); - const [loading, setLoading] = useState(true); - useEffect(() => { - setLoading(true); - if (data !== undefined) { - setBalance({ ...initValueMainToken }); - Object.keys(data).forEach((key) => { - if (data[key] && data[key].amount > 0) { - setBalance((item) => ({ - ...item, - [key]: { ...data[key] }, - total: { - ...item.total, - amount: new BigNumber(item.total.amount) - .plus(data[key].amount) - .toNumber(), - }, - })); - } - }); - setLoading(false); - } - }, [data]); - - return { balance, loading }; + return { balance: data || { ...initValueMainToken }, loading: !data }; } export default useGetBalanceMainToken; diff --git a/src/containers/sigma/hooks/utils.js b/src/containers/sigma/hooks/utils.js index db6b71d08..0c105fd4e 100644 --- a/src/containers/sigma/hooks/utils.js +++ b/src/containers/sigma/hooks/utils.js @@ -118,12 +118,27 @@ export const useGetBalance = (client, addressBech32) => { responsevalidatorCommission ); - return { + const resultBalance = { liquid: responsegetBalance, frozen: delegationsAmount, melting: unbondingAmount, growth: rewardsAmount, - commission: commissionAmount, + }; + + if (commissionAmount.amount > 0) { + resultBalance.commission = commissionAmount; + } + + const total = Object.values(resultBalance).reduce((acc, item) => { + return new BigNumber(acc).plus(item.amount).toString(); + }, 0); + + return { + ...resultBalance, + total: { + denom: DENOM_CYBER, + amount: total, + }, }; }, { diff --git a/src/containers/sigma/index.tsx b/src/containers/sigma/index.tsx index bda8e28ac..7751f4d0a 100644 --- a/src/containers/sigma/index.tsx +++ b/src/containers/sigma/index.tsx @@ -109,7 +109,7 @@ function Sigma() { const updateDataCap = (newData) => { setValue((item) => ({ ...item, - dataCap: { ...item.dataCap, ...newData }, + dataCap: superSigma ? { ...item.dataCap, ...newData } : { ...newData }, })); }; diff --git a/src/features/adviser/AdviserContainer.module.scss b/src/features/adviser/AdviserContainer.module.scss index 788954293..08f80667d 100644 --- a/src/features/adviser/AdviserContainer.module.scss +++ b/src/features/adviser/AdviserContainer.module.scss @@ -1,12 +1,15 @@ .wrapper { position: sticky; top: 75px; + width: 60%; z-index: 3; min-height: 90px; // 3 lines margin-top: -45px; margin-bottom: 15px; + margin-left: auto; + margin-right: auto; display: flex; justify-content: center; diff --git a/src/pages/Keys/ActionBar/actionBarConnect.tsx b/src/pages/Keys/ActionBar/actionBarConnect.tsx index 4baa54286..0198d0daa 100644 --- a/src/pages/Keys/ActionBar/actionBarConnect.tsx +++ b/src/pages/Keys/ActionBar/actionBarConnect.tsx @@ -11,7 +11,8 @@ import { import { LEDGER, CYBER, PATTERN_CYBER } from 'src/utils/config'; import { useSigningClient } from 'src/contexts/signerClient'; import { useDispatch } from 'react-redux'; -import { initPocket, setDefaultAccount } from 'src/redux/features/pocket'; +import { addAddressPocket } from 'src/redux/features/pocket'; +import { AccountValue } from 'src/types/defaultAccount'; const { STAGE_INIT, HDPATH, STAGE_ERROR } = LEDGER; @@ -81,182 +82,42 @@ function ActionBarConnect({ }; const onClickAddAddressUserToLocalStr = async () => { - const accounts = {}; - let key = 'Account 1'; - let dataPocketAccount = null; - let pocketAccount = {}; - let valueObj = {}; - let count = 1; + const accounts = { bech32: valueInputAddres, keys: 'read-only' }; - const localStorageStory = await localStorage.getItem('pocketAccount'); - const localStoragePocket = await localStorage.getItem('pocket'); - const localStorageCount = await localStorage.getItem('count'); - if (localStorageCount !== null) { - const dataCount = JSON.parse(localStorageCount); - count = parseFloat(dataCount); - key = `Account ${count}`; - } - localStorage.setItem('count', JSON.stringify(count + 1)); - if (localStorageStory !== null) { - dataPocketAccount = JSON.parse(localStorageStory); - valueObj = Object.values(dataPocketAccount); - if (selectAccount !== null) { - key = selectAccount.key; - } - } - if (selectNetwork === 'cyber' || addCyberAddress) { - let cyberAddress = null; - if (valueInputAddres.match(PATTERN_CYBER)) { - cyberAddress = valueInputAddres; - } - if ( - selectAccount !== null || - !checkAddress(valueObj, 'cyber', cyberAddress) - ) { - accounts.cyber = { bech32: cyberAddress, keys: 'read-only' }; - } - } + setTimeout(() => { + dispatch(addAddressPocket(accounts)); + }, 100); - setStage(STAGE_ADD_ADDRESS_OK); - if (selectAccount === null) { - if (localStorageStory !== null) { - if (Object.keys(accounts).length > 0) { - pocketAccount = { [key]: accounts, ...dataPocketAccount }; - } - } else { - pocketAccount = { [key]: accounts }; - } + setStage(STAGE_ADD_ADDRESS_OK); - if (Object.keys(pocketAccount).length > 0) { - localStorage.setItem('pocketAccount', JSON.stringify(pocketAccount)); - clearState(); - if (updateAddress) { - updateAddress(); - } - if (updateFuncActionBar) { - updateFuncActionBar(); - } - } else { - setStage(STAGE_ERROR); - } - } else { - dataPocketAccount[selectAccount.key][selectNetwork] = - accounts[selectNetwork]; - if (Object.keys(dataPocketAccount).length > 0) { - localStorage.setItem( - 'pocketAccount', - JSON.stringify(dataPocketAccount) - ); - } - if (localStoragePocket !== null) { - const localStoragePocketData = JSON.parse(localStoragePocket); - const keyPocket = Object.keys(localStoragePocketData)[0]; - localStoragePocketData[keyPocket][selectNetwork] = - accounts[selectNetwork]; - if (keyPocket === selectAccount.key) { - localStorage.setItem( - 'pocket', - JSON.stringify(localStoragePocketData) - ); - } - } - clearState(); - if (updateAddress) { - updateAddress(); - } - if (updateFuncActionBar) { - updateFuncActionBar(); - } + clearState(); + if (updateAddress) { + updateAddress(); + } + if (updateFuncActionBar) { + updateFuncActionBar(); } }; const connectKeplr = async () => { - console.log('signer', signer); if (signer) { - const accounts = {}; - let key = 'Account 1'; - let dataPocketAccount = null; - let valueObj = {}; - let pocketAccount = {}; - const chainId = CYBER.CHAIN_ID; - let count = 1; const { bech32Address, pubKey, name } = await signer.keplr.getKey( - chainId + CYBER.CHAIN_ID ); const pk = Buffer.from(pubKey).toString('hex'); - const localStorageStory = localStorage.getItem('pocketAccount'); - const localStoragePocket = localStorage.getItem('pocket'); - const localStorageCount = localStorage.getItem('count'); - if (localStorageCount !== null) { - const dataCount = JSON.parse(localStorageCount); - count = parseFloat(dataCount); - key = `Account ${count}`; - } - localStorage.setItem('count', JSON.stringify(count + 1)); - if (localStorageStory !== null) { - dataPocketAccount = JSON.parse(localStorageStory); - valueObj = Object.values(dataPocketAccount); - if (selectAccount !== null) { - key = selectAccount.key; - } - } - if (selectNetwork === 'cyber' || addCyberAddress) { - const cyberBech32 = bech32Address; - if ( - selectAccount !== null || - !checkAddress(valueObj, 'cyber', cyberBech32) - ) { - accounts.cyber = { - bech32: cyberBech32, - keys: 'keplr', - pk, - path: HDPATH, - name, - }; - } - } + const accounts: AccountValue = { + bech32: bech32Address, + keys: 'keplr', + pk, + path: HDPATH, + name, + }; setStage(STAGE_ADD_ADDRESS_OK); - if (selectAccount === null) { - if (localStorageStory !== null) { - if (Object.keys(accounts).length > 0) { - pocketAccount = { [key]: accounts, ...dataPocketAccount }; - } - } else { - pocketAccount = { [key]: accounts }; - } - if (Object.keys(pocketAccount).length > 0) { - localStorage.setItem('pocketAccount', JSON.stringify(pocketAccount)); - } - } else { - dataPocketAccount[selectAccount.key][selectNetwork] = - accounts[selectNetwork]; - if (Object.keys(dataPocketAccount).length > 0) { - localStorage.setItem( - 'pocketAccount', - JSON.stringify(dataPocketAccount) - ); - } - if (localStoragePocket !== null) { - const localStoragePocketData = JSON.parse(localStoragePocket); - const keyPocket = Object.keys(localStoragePocketData)[0]; - localStoragePocketData[keyPocket][selectNetwork] = - accounts[selectNetwork]; - if (keyPocket === selectAccount.key) { - localStorage.setItem( - 'pocket', - JSON.stringify(localStoragePocketData) - ); - } - } - } - - // need remove code above - dispatch(initPocket()); setTimeout(() => { - dispatch(setDefaultAccount({ name: key })); + dispatch(addAddressPocket(accounts)); }, 100); clearState(); diff --git a/src/redux/features/pocket.ts b/src/redux/features/pocket.ts index da346f4b5..b262e8a98 100644 --- a/src/redux/features/pocket.ts +++ b/src/redux/features/pocket.ts @@ -1,7 +1,12 @@ import { Dispatch } from 'redux'; import { localStorageKeys } from 'src/constants/localStorageKeys'; -import { Account, Accounts, DefaultAccount } from 'src/types/defaultAccount'; +import { + Account, + AccountValue, + Accounts, + DefaultAccount, +} from 'src/types/defaultAccount'; import { PayloadAction, createSlice } from '@reduxjs/toolkit'; import { POCKET } from '../../utils/config'; import { RootState } from '../store'; @@ -11,7 +16,7 @@ type SliceState = { tweet: string; }; defaultAccount: DefaultAccount; - accounts: null | { [key: string]: Account }; + accounts: null | Accounts; }; const initialState: SliceState = { @@ -25,6 +30,13 @@ const initialState: SliceState = { accounts: null, }; +const checkAddress = (obj, network, address) => + Object.keys(obj).some((k) => { + if (obj[k][network]) { + return obj[k][network].bech32 === address; + } + }); + function saveToLocalStorage(state: SliceState) { const { defaultAccount, accounts } = state; @@ -61,6 +73,8 @@ const slice = createSlice({ }, setAccounts: (state, { payload }: PayloadAction) => { state.accounts = payload; + + saveToLocalStorage(state); }, setStageTweetActionBar: (state, { payload }: PayloadAction) => { state.actionBar.tweet = payload; @@ -178,3 +192,61 @@ export const initPocket = () => (dispatch: Dispatch) => { accountsTemp && dispatch(setAccounts(accountsTemp)); }; + +const defaultNameAccount = () => { + let key = 'Account 1'; + let count = 1; + + const localStorageCount = localStorage.getItem('count'); + + if (localStorageCount !== null) { + const dataCount = JSON.parse(localStorageCount); + count = parseFloat(dataCount); + key = `Account ${count}`; + } + + localStorage.setItem('count', JSON.stringify(count + 1)); + + return key; +}; + +export const addAddressPocket = + (accounts: AccountValue) => (dispatch: Dispatch) => { + const key = accounts.name || defaultNameAccount(); + + let dataPocketAccount = null; + let valueObj = {}; + let pocketAccount: Accounts = {}; + + const localStorageStory = localStorage.getItem( + localStorageKeys.pocket.POCKET_ACCOUNT + ); + + if (localStorageStory !== null) { + dataPocketAccount = JSON.parse(localStorageStory); + valueObj = Object.values(dataPocketAccount); + } + + const isAdded = !checkAddress(valueObj, 'cyber', accounts.bech32); + + if (!isAdded) { + return; + } + + const cyberAccounts: Account = { + cyber: accounts, + }; + + if (localStorageStory !== null) { + pocketAccount = { [key]: cyberAccounts, ...dataPocketAccount }; + } else { + pocketAccount = { [key]: cyberAccounts }; + } + + if (Object.keys(pocketAccount).length > 0) { + dispatch(setAccounts(pocketAccount)); + if (accounts.keys !== 'read-only') { + dispatch(setDefaultAccount({ name: key, account: cyberAccounts })); + } + } + }; diff --git a/src/types/defaultAccount.d.ts b/src/types/defaultAccount.d.ts index c4829b8c0..36cbe5c99 100644 --- a/src/types/defaultAccount.d.ts +++ b/src/types/defaultAccount.d.ts @@ -1,7 +1,7 @@ type AccountKey = 'cyber' | 'cosmos'; export type AccountValue = { - keys: 'read-only' | 'ledger' | 'keplr'; + keys: 'read-only' | 'keplr'; bech32: string; name?: string; path?: number[]; @@ -12,7 +12,7 @@ type Account = { [key in AccountKey]: AccountValue; }; -type Accounts = { +export type Accounts = { [key in string]: Account; };