diff --git a/packages/page-parachains/src/Overview/Parachain.tsx b/packages/page-parachains/src/Overview/Parachain.tsx index a706de6e93..dac853b42c 100644 --- a/packages/page-parachains/src/Overview/Parachain.tsx +++ b/packages/page-parachains/src/Overview/Parachain.tsx @@ -2,7 +2,7 @@ // SPDX-License-Identifier: Apache-2.0 import type { Option, Vec } from '@polkadot/types'; -import type { AccountId, BalanceOf, BlockNumber, CandidatePendingAvailability, GroupIndex, HeadData, HrmpChannel, HrmpChannelId, ParaId, ParaInfo, ParaLifecycle } from '@polkadot/types/interfaces'; +import type { AccountId, BalanceOf, BlockNumber, CandidatePendingAvailability, GroupIndex, HeadData, ParaId, ParaInfo, ParaLifecycle } from '@polkadot/types/interfaces'; import type { Codec, ITuple } from '@polkadot/types/types'; import type { LeasePeriod, QueuedAction } from '../types'; import type { EventMapInfo, ValidatorInfo } from './types'; @@ -13,7 +13,7 @@ import React, { useCallback, useEffect, useMemo, useState } from 'react'; import { AddressMini, Expander, ParaLink } from '@polkadot/react-components'; import { useApi, useCallMulti } from '@polkadot/react-hooks'; import { BlockToTime } from '@polkadot/react-query'; -import { BN_ZERO, formatNumber } from '@polkadot/util'; +import { formatNumber } from '@polkadot/util'; import { useTranslation } from '../translate'; import { sliceHex } from '../util'; @@ -23,8 +23,6 @@ import Periods from './Periods'; interface Props { bestNumber?: BN; - channelDst?: [HrmpChannelId, HrmpChannel][]; - channelSrc?: [HrmpChannelId, HrmpChannel][]; className?: string; id: ParaId; isScheduled?: boolean; @@ -96,7 +94,7 @@ function renderAddresses (list?: AccountId[], indices?: BN[]): JSX.Element[] | u )); } -function Parachain ({ bestNumber, channelDst, channelSrc, className = '', id, lastBacked, lastInclusion, lastTimeout, leasePeriod, nextAction, sessionValidators, validators }: Props): React.ReactElement { +function Parachain ({ bestNumber, className = '', id, lastBacked, lastInclusion, lastTimeout, leasePeriod, nextAction, sessionValidators, validators }: Props): React.ReactElement { const { t } = useTranslation(); const { api } = useApi(); const paraInfo = useCallMulti([ @@ -114,14 +112,6 @@ function Parachain ({ bestNumber, channelDst, channelSrc, className = '', id, la ], optionsMulti); const [nonBacked, setNonBacked] = useState([]); - const channelCounts = useMemo( - () => [ - channelDst ? channelDst.reduce((count, [, channel]) => count.iadd(channel.msgCount), new BN(0)) : BN_ZERO, - channelSrc ? channelSrc.reduce((count, [, channel]) => count.iadd(channel.msgCount), new BN(0)) : BN_ZERO - ], - [channelDst, channelSrc] - ); - const blockDelay = useMemo( () => bestNumber && ( lastInclusion @@ -226,11 +216,10 @@ function Parachain ({ bestNumber, channelDst, channelSrc, className = '', id, la - {/* {formatNumber(paraInfo.qUmp)} / {formatNumber(paraInfo.qDmp)} / {formatNumber(paraInfo.qHrmpE)} / {formatNumber(paraInfo.qHrmpI)} ({formatNumber(channelCounts[0])} / {formatNumber(channelCounts[1])}) */} - {formatNumber(paraInfo.qHrmpI)} ({formatNumber(channelCounts[0])}) + {formatNumber(paraInfo.qHrmpI)} - {formatNumber(paraInfo.qHrmpE)} ({formatNumber(channelCounts[1])}) + {formatNumber(paraInfo.qHrmpE)} { + paraEvents && lastBlock.events.forEach(({ event, phase }) => { if (phase.isApplyExtrinsic) { - if ((api.events.paraInclusion || api.events.parasInclusion || api.events.inclusion)?.CandidateBacked.is(event)) { + if (paraEvents.CandidateBacked.is(event)) { includeEntry(backed, event, blockHash, blockNumber); wasBacked = true; - } else if ((api.events.paraInclusion || api.events.parasInclusion || api.events.inclusion)?.CandidateIncluded.is(event)) { + } else if (paraEvents.CandidateIncluded.is(event)) { includeEntry(included, event, blockHash, blockNumber); wasIncluded = true; - } else if ((api.events.paraInclusion || api.events.parasInclusion || api.events.inclusion)?.CandidateTimedOut.is(event)) { + } else if (paraEvents.CandidateTimedOut.is(event)) { includeEntry(timeout, event, blockHash, blockNumber); wasTimeout = true; } @@ -164,7 +164,6 @@ function Parachains ({ actionsQueue, ids, leasePeriod, scheduled }: Props): Reac (api.query.parasScheduler || api.query.paraScheduler || api.query.scheduler)?.validatorGroups, (api.query.parasShared || api.query.paraShared || api.query.shared)?.activeValidatorIndices ], optionsMulti); - const hrmp = useHrmp(); const hasLinksMap = useIsParasLinked(ids); const [validatorMap, setValidatorMap] = useState>({}); @@ -178,7 +177,7 @@ function Parachains ({ actionsQueue, ids, leasePeriod, scheduled }: Props): Reac [t('backed'), 'no-pad-left media--800'], [t('timeout'), 'no-pad-left media--900'], [t('chain'), 'no-pad-left'], - [t('in/out (msg)'), 'media--1200', 2], + [t('in/out'), 'media--1200', 2], [t('leases'), 'media--1000'] ]); @@ -217,8 +216,6 @@ function Parachains ({ actionsQueue, ids, leasePeriod, scheduled }: Props): Reac {knownIds?.map(([id, key]): React.ReactNode => ( []]): AllChannels => - channelIds - .map((id, index): [HrmpChannelId, Option] => [id, channels[index]]) - .filter(([, opt]) => opt.isSome) - .map(([id, opt]): [HrmpChannelId, HrmpChannel] => [id, opt.unwrap()]) - .reduce((all: AllChannels, [id, channel]): AllChannels => { - all.dst[id.receiver.toString()] ||= []; - all.src[id.sender.toString()] ||= []; - - all.dst[id.receiver.toString()].push([id, channel]); - all.src[id.sender.toString()].push([id, channel]); - - return all; - }, { dst: {}, src: {} }), - withParamsTransform: true -}; - -function extractChannelIds (keys: StorageKey<[HrmpChannelId]>[]): HrmpChannelId[] { - return keys.map(({ args: [id] }) => id); -} - -export default function useHrmp (): AllChannels | undefined { - const { api } = useApi(); - const trigger = useEventTrigger([ - (api.events.parasHrmp || api.events.paraHrmp || api.events.hrmp)?.OpenChannelAccepted, - (api.events.parasHrmp || api.events.paraHrmp || api.events.hrmp)?.ChannelClosed - ]); - const channelIds = useMapKeys((api.query.parasHrmp || api.query.paraHrmp || api.query.hrmp)?.hrmpChannels, { at: trigger.blockHash, transform: extractChannelIds }); - - return useCall(channelIds && (api.query.parasHrmp || api.query.paraHrmp || api.query.hrmp)?.hrmpChannels.multi, [channelIds], optChannels); -}