diff --git a/src/library/ListItem/Labels/EraStatus.tsx b/src/library/ListItem/Labels/EraStatus.tsx index 75ac70ad8..169147d61 100644 --- a/src/library/ListItem/Labels/EraStatus.tsx +++ b/src/library/ListItem/Labels/EraStatus.tsx @@ -1,7 +1,7 @@ // Copyright 2023 @paritytech/polkadot-staking-dashboard authors & contributors // SPDX-License-Identifier: GPL-3.0-only -import { capitalizeFirstLetter, planckToUnit } from '@polkadot-cloud/utils'; +import { planckToUnit } from '@polkadot-cloud/utils'; import { useTranslation } from 'react-i18next'; import { useStaking } from 'contexts/Staking'; import { useUi } from 'contexts/UI'; @@ -23,11 +23,9 @@ export const EraStatus = ({ noMargin, status, totalStake }: EraStatusProps) => {
{isSyncing || erasStakersSyncing ? t('syncing') - : validatorStatus !== 'waiting' - ? `${t('listItemActive')} / ${planckToUnit(totalStake, units) - .integerValue() - .toFormat()} ${unit}` - : capitalizeFirstLetter(t(`${validatorStatus}`) ?? '')} + : `${t('listItemActive')} / ${planckToUnit(totalStake, units) + .integerValue() + .toFormat()} ${unit}`}
); diff --git a/src/library/ValidatorList/ValidatorItem/index.tsx b/src/library/ValidatorList/ValidatorItem/index.tsx index 69568262d..baf8dca76 100644 --- a/src/library/ValidatorList/ValidatorItem/index.tsx +++ b/src/library/ValidatorList/ValidatorItem/index.tsx @@ -18,7 +18,10 @@ export const ValidatorItemInner = (props: ValidatorItemProps) => { export class ValidatorItem extends React.Component { shouldComponentUpdate(nextProps: ValidatorItemProps) { - return this.props.validator.address !== nextProps.validator.address; + return ( + this.props.validator.address !== nextProps.validator.address || + this.props.validator.totalStake !== nextProps.validator.totalStake + ); } render() { diff --git a/src/library/ValidatorList/index.tsx b/src/library/ValidatorList/index.tsx index f6a116124..21c5030dc 100644 --- a/src/library/ValidatorList/index.tsx +++ b/src/library/ValidatorList/index.tsx @@ -35,6 +35,7 @@ import type { ValidatorListProps } from './types'; import { FilterHeaders } from './Filters/FilterHeaders'; import { FilterBadges } from './Filters/FilterBadges'; import type { NominationStatus } from './ValidatorItem/types'; +import { useStaking } from 'contexts/Staking'; export const ValidatorListInner = ({ nominator: initialNominator, @@ -79,10 +80,11 @@ export const ValidatorListInner = ({ const { activeEra } = useNetworkMetrics(); const { activeAccount } = useActiveAccounts(); const { setModalResize } = useOverlay().modal; - const { injectValidatorListData } = useValidators(); + const { injectValidatorListData, sessionValidators } = useValidators(); const { getNomineesStatus } = useNominationStatus(); const { getPoolNominationStatus } = useBondedPools(); const { applyFilter, applyOrder, applySearch } = useValidatorFilters(); + const { eraStakers } = useStaking(); const { selected, listFormat, setListFormat } = listProvider; const includes = getFilters('include', 'validators'); @@ -164,6 +166,10 @@ export const ValidatorListInner = ({ setRenderIterationState(iter); }; + useEffect(() => { + setupValidatorList(); + }, [eraStakers]); + // Pagination. const totalPages = Math.ceil(validators.length / ListItemsPerPage); const pageEnd = page * ListItemsPerPage - 1; @@ -303,7 +309,7 @@ export const ValidatorListInner = ({ // List ui changes / validator changes trigger re-render of list. useEffect(() => { if (allowFilters && fetched) handleValidatorsFilterUpdate(); - }, [order, isSyncing, includes?.length, excludes?.length]); + }, [order, isSyncing, includes?.length, excludes?.length, sessionValidators]); // Handle modal resize on list format change. useEffect(() => { diff --git a/src/workers/stakers.ts b/src/workers/stakers.ts index 2404b971e..4b21eff5c 100644 --- a/src/workers/stakers.ts +++ b/src/workers/stakers.ts @@ -126,69 +126,69 @@ const processExposures = (data: DataInitialiseExposures) => { })) ?? []; // Accumulate active nominators and min active stake threshold. - if (others.length) { - // Sort `others` by value bonded, largest first. - others = others.sort((a, b) => { - const r = new BigNumber(rmCommas(b.value)).minus(rmCommas(a.value)); - return r.isZero() ? 0 : r.isLessThan(0) ? -1 : 1; - }); - - const lowestRewardIndex = Math.min( - maxNominatorRewardedPerValidator - 1, - others.length - ); - - const lowestReward = - others.length > 0 - ? planckToUnit( - new BigNumber(others[lowestRewardIndex]?.value || 0), - units - ).toString() - : '0'; - - const oversubscribed = others.length > maxNominatorRewardedPerValidator; - - stakers.push({ - address, - lowestReward, - oversubscribed, - others, - own: rmCommas(val.own), - total: rmCommas(val.total), - }); - - // Accumulate active stake for all nominators. - for (const o of others) { - const value = new BigNumber(rmCommas(o.value)); - - // Check nominator already exists. - const index = nominators.findIndex(({ who }) => who === o.who); - - // Add value to nominator, otherwise add new entry. - if (index === -1) { - nominators.push({ - who: o.who, - value: value.toString(), - }); - } else { - nominators[index].value = new BigNumber(nominators[index].value) - .plus(value) - .toFixed(); - } - } - - // get own stake if present - const own = others.find(({ who }) => who === activeAccount); - if (own !== undefined) { - activeAccountOwnStake.push({ - address, - value: planckToUnit( - new BigNumber(rmCommas(own.value)), + // if (others.length) { + // Sort `others` by value bonded, largest first. + others = others.sort((a, b) => { + const r = new BigNumber(rmCommas(b.value)).minus(rmCommas(a.value)); + return r.isZero() ? 0 : r.isLessThan(0) ? -1 : 1; + }); + + const lowestRewardIndex = Math.min( + maxNominatorRewardedPerValidator - 1, + others.length + ); + + const lowestReward = + others.length > 0 + ? planckToUnit( + new BigNumber(others[lowestRewardIndex]?.value || 0), units - ).toFixed(), + ).toString() + : '0'; + + const oversubscribed = others.length > maxNominatorRewardedPerValidator; + + stakers.push({ + address, + lowestReward, + oversubscribed, + others, + own: rmCommas(val.own), + total: rmCommas(val.total), + }); + + // Accumulate active stake for all nominators. + for (const o of others) { + const value = new BigNumber(rmCommas(o.value)); + + // Check nominator already exists. + const index = nominators.findIndex(({ who }) => who === o.who); + + // Add value to nominator, otherwise add new entry. + if (index === -1) { + nominators.push({ + who: o.who, + value: value.toString(), }); + } else { + nominators[index].value = new BigNumber(nominators[index].value) + .plus(value) + .toFixed(); } } + + // get own stake if present + const own = others.find(({ who }) => who === activeAccount); + if (own !== undefined) { + activeAccountOwnStake.push({ + address, + value: planckToUnit( + new BigNumber(rmCommas(own.value)), + units + ).toFixed(), + }); + } + // } }); return {