-
Notifications
You must be signed in to change notification settings - Fork 1.6k
Staking Next Page #11483
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: master
Are you sure you want to change the base?
Staking Next Page #11483
Changes from 29 commits
6217628
a2d53d9
d31da2b
739064b
57d61ae
5df46e4
a18b2b8
cea2d33
fdce3a4
723e46d
294ad9b
21ef80b
78cb444
20aa25c
728e73b
f0615b0
d4e9e31
11e1691
ad9ad08
149fd3b
103ca72
477159d
5ad5cfa
822f7cd
4a8ca8c
d4e01f4
18146d7
49abc2d
6eb4020
58c2152
30707a9
9263093
1505d35
9f3214e
4028536
19a75a2
a7e6758
204baad
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
// Copyright 2017-2025 @polkadot/apps-routing authors & contributors | ||
// SPDX-License-Identifier: Apache-2.0 | ||
|
||
import type { ApiPromise } from '@polkadot/api'; | ||
import type { Route, TFunction } from './types.js'; | ||
|
||
import Component from '@polkadot/app-staking-next'; | ||
|
||
function needsApiCheck (api: ApiPromise): boolean { | ||
try { | ||
return !!((api.tx.stakingNextAhClient) || (api.tx.staking && api.tx.stakingNextRcClient)); | ||
} catch { | ||
return false; | ||
} | ||
} | ||
|
||
export default function create (t: TFunction): Route { | ||
return { | ||
Component, | ||
display: { | ||
needsApi: [], | ||
needsApiCheck | ||
}, | ||
group: 'network', | ||
icon: 'certificate', | ||
name: 'staking-next', | ||
text: t('nav.staking-next', 'Staking Next', { ns: 'apps-routing' }) | ||
}; | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
{ | ||
"Accounts": "Accounts", | ||
"Asset Hub chain": "Asset Hub chain", | ||
"Asset Hub client pallet(AhClient) is blocked currently, useful for migration signal from the fellowship.": "Asset Hub client pallet(AhClient) is blocked currently, useful for migration signal from the fellowship.", | ||
"Bags": "Bags", | ||
"Command Center": "Command Center", | ||
"No events available": "No events available", | ||
"Overview": "Overview", | ||
"Payouts": "Payouts", | ||
"Pools": "Pools", | ||
"Relay chain": "Relay chain", | ||
"Slashes": "Slashes", | ||
"Targets": "Targets", | ||
"There is a validator set queued in ah-client.": "There is a validator set queued in ah-client.", | ||
"Validator stats": "Validator stats", | ||
"active era": "active era", | ||
"current era": "current era", | ||
"era session index": "era session index", | ||
"events": "events", | ||
"historical range": "historical range", | ||
"id": "id", | ||
"multiblock phase": "multiblock phase", | ||
"multiblock queued score": "multiblock queued score", | ||
"number of validators": "number of validators", | ||
"session": "session", | ||
"signed submissions": "signed submissions", | ||
"snapshot range": "snapshot range" | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -34,6 +34,7 @@ | |
"nav.signing": "Sign and verify", | ||
"nav.society": "Society", | ||
"nav.staking": "Staking", | ||
"nav.staking-next": "Staking Next", | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Naming the Section Staking Next might be confusing for anyone outside of the context of this task, can be rename it to something more descriptive? There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Not sure what to do here 🤔, this is basically route name & "Staking Next" is the term we are using now. |
||
"nav.storage": "Chain state", | ||
"nav.sudo": "Sudo", | ||
"nav.tech-comm": "Tech. comm.", | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
# @polkadot/app-staking-next | ||
ap211unitech marked this conversation as resolved.
Show resolved
Hide resolved
|
||
|
||
More Info can be found here - https://hackmd.io/7PiBrGxxRG2ib-WRZYJZhQ |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
{ | ||
"bugs": "https://github.com/polkadot-js/apps/issues", | ||
"engines": { | ||
"node": ">=18" | ||
}, | ||
"homepage": "https://github.com/polkadot-js/apps/tree/master/packages/page-staking-next#readme", | ||
"license": "Apache-2.0", | ||
"name": "@polkadot/app-staking-next", | ||
"private": true, | ||
"repository": { | ||
"directory": "packages/page-staking-next", | ||
"type": "git", | ||
"url": "https://github.com/polkadot-js/apps.git" | ||
}, | ||
"sideEffects": false, | ||
"type": "module", | ||
"version": "0.152.2-11-x", | ||
"peerDependencies": { | ||
"react": "*", | ||
"react-dom": "*", | ||
"react-is": "*" | ||
} | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,159 @@ | ||
// Copyright 2017-2025 @polkadot/app-staking-next authors & contributors | ||
// SPDX-License-Identifier: Apache-2.0 | ||
|
||
import type { IAhOutput } from './index.js'; | ||
|
||
import React from 'react'; | ||
import { Link } from 'react-router-dom'; | ||
|
||
import { CardSummary, Expander, MarkWarning, styled } from '@polkadot/react-components'; | ||
import { Event as EventDisplay } from '@polkadot/react-params'; | ||
import { formatNumber } from '@polkadot/util'; | ||
|
||
import { useTranslation } from '../translate.js'; | ||
|
||
function AssetHubSection ({ ahOutput }: {ahOutput: IAhOutput[]}) { | ||
const { t } = useTranslation(); | ||
|
||
return ( | ||
<div> | ||
<h1 style={{ textTransform: 'capitalize' }}> | ||
{t('Asset Hub chain')} | ||
</h1> | ||
<StyledSection> | ||
{ahOutput.map((ah) => { | ||
return ( | ||
<div | ||
className='relay__chain' | ||
key={ah.finalizedBlock} | ||
> | ||
<div className='details'> | ||
<div className='session__summary'> | ||
<h4 className='--digits'> | ||
<Link to={`/explorer/query/${ah.finalizedBlock}`}>#{formatNumber(ah.finalizedBlock)}</Link> | ||
</h4> | ||
</div> | ||
<div> | ||
<div className='staking__summary'> | ||
<CardSummary label={t('current era')}> | ||
{ah.staking.currentEra} | ||
</CardSummary> | ||
<CardSummary label={t('era session index')}> | ||
{ah.staking.erasStartSessionIndex} | ||
</CardSummary> | ||
<CardSummary label={t('active era')}> | ||
{ah.staking.activeEra.index} | ||
</CardSummary> | ||
</div> | ||
<div className='multiblock__summary'> | ||
<CardSummary label={t('multiblock phase')}> | ||
{ah.multiblock.phase} | ||
</CardSummary> | ||
{ah.multiblock.queuedScore && | ||
<CardSummary label={t('multiblock queued score')}> | ||
{ah.multiblock.queuedScore} | ||
</CardSummary>} | ||
<CardSummary label={t('signed submissions')}> | ||
{ah.multiblock.signedSubmissions} | ||
</CardSummary> | ||
{!!ah.multiblock.snapshotRange.length && | ||
<CardSummary label={t('snapshot range')}> | ||
{ah.multiblock.snapshotRange} | ||
</CardSummary>} | ||
</div> | ||
</div> | ||
</div> | ||
<div className='events__summary'> | ||
<h3>{t('events')}</h3> | ||
{ah.events.map((event) => { | ||
const eventName = `${event.section}.${event.method}`; | ||
|
||
return ( | ||
<Expander | ||
isLeft | ||
key={event.index.toString()} | ||
summary={eventName} | ||
summaryMeta={event.meta} | ||
> | ||
<EventDisplay | ||
className='details' | ||
eventName={eventName} | ||
value={event} | ||
withExpander | ||
/> | ||
</Expander> | ||
|
||
); | ||
})} | ||
{ah.events.length === 0 && <MarkWarning content={t('No events available')} />} | ||
</div> | ||
</div> | ||
); | ||
})} | ||
</StyledSection> | ||
</div>); | ||
} | ||
|
||
const StyledSection = styled.section` | ||
margin-block: 1rem; | ||
overflow: auto; | ||
|
||
.warning { | ||
max-width: fit-content; | ||
margin-left: 0; | ||
} | ||
|
||
.ui--Labelled-content { | ||
font-size: var(--font-size-h3); | ||
font-weight: var(--font-weight-normal); | ||
} | ||
|
||
.relay__chain { | ||
display: grid; | ||
grid-template-columns: repeat(2, 1fr); | ||
place-items: start; | ||
background: var(--bg-table); | ||
margin-bottom: 0.35rem; | ||
padding: 0.8rem 1rem; | ||
border-radius: 0.5rem; | ||
|
||
.details { | ||
display: flex; | ||
align-items: center; | ||
gap: 0.8rem; | ||
|
||
.session__summary { | ||
display: flex; | ||
align-items: center; | ||
|
||
h4 { | ||
font-weight: 400; | ||
font-size: medium; | ||
} | ||
} | ||
|
||
.staking__summary { | ||
display: flex; | ||
justify-content: end; | ||
} | ||
|
||
.multiblock__summary { | ||
display: flex; | ||
justify-content: end; | ||
margin-top: 1.5rem; | ||
} | ||
} | ||
|
||
.events__summary { | ||
display: grid; | ||
gap: 1rem; | ||
justify-self: center; | ||
h3 { | ||
font-weight: 500; | ||
font-size: var(--font-size-h2); | ||
} | ||
} | ||
} | ||
`; | ||
|
||
export default React.memo(AssetHubSection); |
Uh oh!
There was an error while loading. Please reload this page.