From 3a3b043d7da29856a849876152ab5c247a460aaa Mon Sep 17 00:00:00 2001 From: Jaco Greeff Date: Sun, 14 Mar 2021 18:08:23 +0100 Subject: [PATCH] Display lifecycle in all tables (#4848) --- .../page-parachains/src/Overview/Parachain.tsx | 18 +++++++++++++----- .../src/Overview/ParachainList.tsx | 2 ++ .../page-parachains/src/Overview/Upcoming.tsx | 7 ++++--- .../src/Overview/UpcomingList.tsx | 5 +++-- .../page-parachains/src/Proposals/Proposal.tsx | 2 +- packages/page-parachains/src/util.ts | 2 +- 6 files changed, 24 insertions(+), 12 deletions(-) diff --git a/packages/page-parachains/src/Overview/Parachain.tsx b/packages/page-parachains/src/Overview/Parachain.tsx index f9aff0a0c1..aa35268429 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, BlockNumber, HeadData, Header, ParaId } from '@polkadot/types/interfaces'; +import type { AccountId, BlockNumber, HeadData, Header, ParaId, ParaLifecycle } from '@polkadot/types/interfaces'; import type { Codec } from '@polkadot/types/types'; import BN from 'bn.js'; @@ -26,10 +26,11 @@ interface Props { validators?: AccountId[]; } -type QueryResult = [Option, Option, Vec, Vec, Vec, Vec, Option]; +type QueryResult = [Option, Option, Option, Vec, Vec, Vec, Vec, Option]; interface QueryState { headHex: string | null; + lifecycle: ParaLifecycle | null; updateAt: BlockNumber | null; qDmp: number; qUmp: number; @@ -45,6 +46,7 @@ const transformHeader = { const optionsMulti = { defaultValue: { headHex: null, + lifecycle: null, qDmp: 0, qHrmpE: 0, qHrmpI: 0, @@ -52,10 +54,11 @@ const optionsMulti = { updateAt: null, watermark: null }, - transform: ([headData, optUp, dmp, ump, hrmpE, hrmpI, optWm]: QueryResult): QueryState => ({ + transform: ([headData, optUp, optLifecycle, dmp, ump, hrmpE, hrmpI, optWm]: QueryResult): QueryState => ({ headHex: headData.isSome - ? sliceHex(headData.unwrap(), 12) + ? sliceHex(headData.unwrap()) : null, + lifecycle: optLifecycle.unwrapOr(null), qDmp: dmp.length, qHrmpE: hrmpE.length, qHrmpI: hrmpI.length, @@ -73,6 +76,7 @@ function Parachain ({ bestNumber, className = '', id, isScheduled, lastBacked, l const paraInfo = useCallMulti([ [api.query.paras.heads, id], [api.query.paras.futureCodeUpgrades, id], + [api.query.paras.paraLifecycles, id], [api.query.dmp.downwardMessageQueues, id], [api.query.ump.relayDispatchQueues, id], [api.query.hrmp.hrmpEgressChannelsIndex, id], @@ -119,7 +123,11 @@ function Parachain ({ bestNumber, className = '', id, isScheduled, lastBacked, l /> )} - {paraInfo.headHex} + {paraInfo.headHex} + + {paraInfo.lifecycle && paraInfo.lifecycle.toString()} + + {blockDelay && } {lastInclusion diff --git a/packages/page-parachains/src/Overview/ParachainList.tsx b/packages/page-parachains/src/Overview/ParachainList.tsx index 2d3b0d639c..9362dc9ad7 100644 --- a/packages/page-parachains/src/Overview/ParachainList.tsx +++ b/packages/page-parachains/src/Overview/ParachainList.tsx @@ -109,6 +109,8 @@ function ParachainList ({ ids, scheduled }: Props): React.ReactElement { [t('parachains'), 'start', 3], ['', 'media--1500'], [t('heads'), 'start'], + [t('lifecycle'), 'start media--1100'], + [], [t('included'), undefined, 2], [t('backed')], [t('chain best'), 'media--900'], diff --git a/packages/page-parachains/src/Overview/Upcoming.tsx b/packages/page-parachains/src/Overview/Upcoming.tsx index 04e2a89f20..4beda7a5f5 100644 --- a/packages/page-parachains/src/Overview/Upcoming.tsx +++ b/packages/page-parachains/src/Overview/Upcoming.tsx @@ -74,14 +74,15 @@ function Upcoming ({ currentPeriod, id }: Props): React.ReactElement {

{formatNumber(id)}

- + {upcomingGenesis && ( - sliceHex(upcomingGenesis.genesisHead, 8) + sliceHex(upcomingGenesis.genesisHead) )} - + {lifecycle && lifecycle.toString()} + {currentPeriod && leases.map(({ period }) => formatNumber(currentPeriod.addn(period))).join(', ') diff --git a/packages/page-parachains/src/Overview/UpcomingList.tsx b/packages/page-parachains/src/Overview/UpcomingList.tsx index 61d1a7bc2a..f84607001e 100644 --- a/packages/page-parachains/src/Overview/UpcomingList.tsx +++ b/packages/page-parachains/src/Overview/UpcomingList.tsx @@ -21,8 +21,9 @@ function UpcomingList ({ currentPeriod, ids }: Props): React.ReactElement const headerRef = useRef([ [t('upcoming'), 'start', 2], - [t('genesis'), 'start all'], - [t('lifecycle'), 'number'], + [t('genesis'), 'start'], + [t('lifecycle'), 'start'], + [], [t('leases'), 'start'], [t('parachain'), 'start'] ]); diff --git a/packages/page-parachains/src/Proposals/Proposal.tsx b/packages/page-parachains/src/Proposals/Proposal.tsx index 8de86f0094..1c540bbfa1 100644 --- a/packages/page-parachains/src/Proposals/Proposal.tsx +++ b/packages/page-parachains/src/Proposals/Proposal.tsx @@ -43,7 +43,7 @@ function Proposal ({ approvedIds, id, scheduled }: Props): React.ReactElement proposal?.proposal && sliceHex(proposal.proposal.genesisHead, 8), + () => proposal?.proposal && sliceHex(proposal.proposal.genesisHead), [proposal] ); diff --git a/packages/page-parachains/src/util.ts b/packages/page-parachains/src/util.ts index c80855f40c..ccc4dbdb4f 100644 --- a/packages/page-parachains/src/util.ts +++ b/packages/page-parachains/src/util.ts @@ -3,7 +3,7 @@ import type { Codec } from '@polkadot/types/types'; -export function sliceHex (value: Codec, max: number): string { +export function sliceHex (value: Codec, max = 8): string { const hex = value.toHex(); return hex.length > ((2 * max) + 2)