diff --git a/packages/app-staking/src/Overview/Address.tsx b/packages/app-staking/src/Overview/Address.tsx index a73de71862..b31142607b 100644 --- a/packages/app-staking/src/Overview/Address.tsx +++ b/packages/app-staking/src/Overview/Address.tsx @@ -26,7 +26,7 @@ interface Props extends I18nProps { currentElected: string[]; defaultName: string; filter: ValidatorFilter; - lastAuthor?: string; + lastAuthors?: string[]; points?: Points; recentlyOnline?: DerivedHeartbeats; stakingInfo?: DerivedStaking; @@ -53,7 +53,7 @@ interface OnlineState { const WITH_VALIDATOR_PREFS = { validatorPayment: true }; -function Address ({ address, authorsMap, className, currentElected, defaultName, filter, lastAuthor, points, recentlyOnline, stakingInfo, t, withNominations }: Props): React.ReactElement | null { +function Address ({ address, authorsMap, className, currentElected, defaultName, filter, lastAuthors, points, recentlyOnline, stakingInfo, t, withNominations }: Props): React.ReactElement | null { const { isSubstrateV2 } = useContext(ApiContext); const [extraInfo, setExtraInfo] = useState<[React.ReactNode, React.ReactNode][] | undefined>(); const [{ hasOfflineWarnings, onlineStatus }, setOnlineStatus] = useState({ @@ -83,7 +83,7 @@ function Address ({ address, authorsMap, className, currentElected, defaultName, useEffect((): void => { if (stakingInfo) { const { controllerId, nextSessionId, stakers, stashId } = stakingInfo; - const nominators = stakers + const nominators = withNominations && stakers ? stakers.others.map(({ who, value }): [AccountId, Balance] => [who, value.unwrap()]) : []; const myAccounts = keyring.getAccounts().map(({ address }): string => address); @@ -148,7 +148,7 @@ function Address ({ address, authorsMap, className, currentElected, defaultName, } const lastBlockNumber = authorsMap[stashId]; - const isAuthor = lastAuthor === stashId; + const isAuthor = lastAuthors && lastAuthors.includes(stashId); // isDisabled={!!points && points.isEmpty} return ( diff --git a/packages/app-staking/src/Overview/CurrentList.tsx b/packages/app-staking/src/Overview/CurrentList.tsx index fa91b08b1a..e62a0915de 100644 --- a/packages/app-staking/src/Overview/CurrentList.tsx +++ b/packages/app-staking/src/Overview/CurrentList.tsx @@ -18,12 +18,12 @@ interface Props extends I18nProps { currentElected: string[]; currentValidators: string[]; eraPoints?: EraPoints; - lastAuthor?: string; + lastAuthors?: string[]; next: string[]; recentlyOnline?: DerivedHeartbeats; } -function renderColumn (addresses: string[], defaultName: string, withExpanded: boolean, filter: string, without: string[], { authorsMap, currentElected, eraPoints, lastAuthor, recentlyOnline }: Props): React.ReactNode { +function renderColumn (addresses: string[], defaultName: string, withNominations: boolean, withPoints: boolean, filter: string, without: string[], { authorsMap, currentElected, eraPoints, lastAuthors, recentlyOnline }: Props): React.ReactNode { return addresses.filter((address): boolean => !without.includes(address)).map((address, index): React.ReactNode => (
)); } @@ -71,14 +71,14 @@ function CurrentList (props: Props): React.ReactElement { emptyText={t('No addresses found')} headerText={t('validators')} > - {renderColumn(currentValidators, t('validator'), true, filter, [], props)} + {renderColumn(currentValidators, t('validator'), true, true, filter, [], props)} - {renderColumn(currentElected, t('intention'), false, filter, currentValidators, props)} - {renderColumn(next, t('intention'), false, filter, currentElected || [], props)} + {renderColumn(currentElected, t('intention'), false, false, filter, currentValidators, props)} + {renderColumn(next, t('intention'), false, false, filter, currentElected || [], props)} diff --git a/packages/app-staking/src/Overview/Summary.tsx b/packages/app-staking/src/Overview/Summary.tsx index 3f41dd7162..3eb622de90 100644 --- a/packages/app-staking/src/Overview/Summary.tsx +++ b/packages/app-staking/src/Overview/Summary.tsx @@ -18,13 +18,13 @@ interface Props extends I18nProps { allControllers: string[]; className?: string; currentValidators: string[]; - lastAuthor?: string; + lastAuthors?: string[]; lastBlock: string; staking_validatorCount?: BN; next: string[]; } -function Summary ({ className, currentValidators, lastAuthor, lastBlock, next, style, staking_validatorCount, t }: Props): React.ReactElement { +function Summary ({ className, currentValidators, lastAuthors, lastBlock, next, style, staking_validatorCount, t }: Props): React.ReactElement { return (
- - {lastAuthor && ( + + {lastAuthors && lastAuthors.map((author): React.ReactNode => ( - )} + ))} {lastBlock}
@@ -64,6 +68,12 @@ export default withMulti( margin-top: -0.25rem; vertical-align: middle; } + + .validator--Summary-authors { + .validator--Account-block-icon+.validator--Account-block-icon { + margin-left: -1.5rem; + } + } `, translate, withCalls('query.staking.validatorCount') diff --git a/packages/app-staking/src/Overview/index.tsx b/packages/app-staking/src/Overview/index.tsx index 4a311bc93d..b536930508 100644 --- a/packages/app-staking/src/Overview/index.tsx +++ b/packages/app-staking/src/Overview/index.tsx @@ -20,7 +20,7 @@ interface Props extends BareProps, ComponentProps { export default function Overview ({ allControllers, allStashes, currentElected, currentValidators, eraPoints, recentlyOnline }: Props): React.ReactElement { const { isSubstrateV2 } = useContext(ApiContext); - const { byAuthor, lastBlockAuthor, lastBlockNumber } = useContext(BlockAuthorsContext); + const { byAuthor, lastBlockAuthors, lastBlockNumber } = useContext(BlockAuthorsContext); const [next, setNext] = useState([]); useEffect((): void => { @@ -40,7 +40,7 @@ export default function Overview ({ allControllers, allStashes, currentElected, currentElected={currentElected} currentValidators={currentValidators} lastBlock={lastBlockNumber} - lastAuthor={lastBlockAuthor} + lastAuthors={lastBlockAuthors} next={next} /> diff --git a/packages/react-query/src/BlockAuthors.tsx b/packages/react-query/src/BlockAuthors.tsx index bbb4cd88b4..a7e2a6e643 100644 --- a/packages/react-query/src/BlockAuthors.tsx +++ b/packages/react-query/src/BlockAuthors.tsx @@ -9,7 +9,7 @@ import { formatNumber } from '@polkadot/util'; interface Authors { byAuthor: Record; - lastBlockAuthor?: string; + lastBlockAuthors?: string[]; lastBlockNumber?: string; lastHeader?: HeaderExtended; lastHeaders: HeaderExtended[]; @@ -33,15 +33,24 @@ function BlockAuthors ({ children }: Props): React.ReactElement { // atm I'm rather typing this than doing it the way it is supposed to be api.isReady.then((): void => { let lastHeaders: HeaderExtended[] = []; + let lastBlockAuthors: string[] = []; + let lastBlockNumber = ''; api.derive.chain.subscribeNewHeads((lastHeader): void => { if (lastHeader && lastHeader.number) { const blockNumber = lastHeader.number.unwrap(); - const lastBlockAuthor = lastHeader.author ? lastHeader.author.toString() : undefined; - const lastBlockNumber = formatNumber(blockNumber); + const thisBlockAuthor = lastHeader.author ? lastHeader.author.toString() : undefined; + const thisBlockNumber = formatNumber(blockNumber); - if (lastBlockAuthor) { - byAuthor[lastBlockAuthor] = lastBlockNumber; + if (thisBlockAuthor) { + byAuthor[thisBlockAuthor] = thisBlockNumber; + + if (thisBlockNumber !== lastBlockNumber) { + lastBlockNumber = thisBlockNumber; + lastBlockAuthors = [thisBlockAuthor]; + } else { + lastBlockAuthors.push(thisBlockAuthor); + } } lastHeaders = lastHeaders @@ -53,7 +62,7 @@ function BlockAuthors ({ children }: Props): React.ReactElement { }, [lastHeader]) .sort((a, b): number => b.number.unwrap().cmp(a.number.unwrap())); - setState({ byAuthor, lastBlockAuthor, lastBlockNumber, lastHeader, lastHeaders }); + setState({ byAuthor, lastBlockAuthors: lastBlockAuthors.slice(), lastBlockNumber, lastHeader, lastHeaders }); } }); });