LaconicNetwork/vega-frontend-monorepo
3
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

feat(explorer): add epoch to block explorer homepage (#3536)

Browse Source
This commit is contained in:
Edd 2023-04-28 14:08:42 +01:00 committed by GitHub
parent 66d2b83513
commit a10f67d7ab
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 41 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
apps/explorer-e2e/src/integration/home.cy.js
View File

@ -9,21 +9,22 @@ context('Home Page', function () {
it('should show connected environment stats', function () {
const statTitles = {
0: 'Status',
1: 'Block height',
2: 'Uptime',
3: 'Total nodes',
4: 'Total staked',
5: 'Backlog',
6: 'Trades / second',
7: 'Orders / block',
8: 'Orders / second',
9: 'Transactions / block',
10: 'Block time',
11: 'Time',
12: 'App',
13: 'Tendermint',
14: 'Up since',
15: 'Chain ID',
1: 'Epoch',
2: 'Block height',
3: 'Uptime',
4: 'Total nodes',
5: 'Total staked',
6: 'Backlog',
7: 'Trades / second',
8: 'Orders / block',
9: 'Orders / second',
10: 'Transactions / block',
11: 'Block time',
12: 'Time',
13: 'App',
14: 'Tendermint',
15: 'Up since',
16: 'Chain ID',
};
cy.get('[data-testid="stats-title"]')
@ -31,42 +32,13 @@ context('Home Page', function () {
cy.wrap($list).should('contain.text', statTitles[index]);
})
.then(($list) => {
cy.wrap($list).should('have.length', 16);
cy.wrap($list).should('have.length', 17);
});
cy.get(statsValue).eq(0).should('contain.text', 'CONNECTED');
cy.get(statsValue).eq(1).should('not.be.empty');
cy.get(statsValue)
.eq(2)
.invoke('text')
.should('match', /\d+d \d+h \d+m \d+s/i);
cy.get(statsValue).eq(3).should('contain.text', '2');
cy.get(statsValue)
.eq(4)
.invoke('text')
.should('match', /\d+\.\d\d(?!\d)/i);
cy.get(statsValue).eq(5).should('contain.text', '0');
cy.get(statsValue).eq(6).should('contain.text', '0');
cy.get(statsValue).eq(7).should('contain.text', '0');
cy.get(statsValue).eq(8).should('contain.text', '0');
cy.get(statsValue).eq(9).should('not.be.empty');
cy.get(statsValue).eq(10).should('not.be.empty');
cy.get(statsValue).eq(11).should('not.be.empty');
cy.get(statsValue)
.eq(12)
.invoke('text')
.should('match', /v\d+\.\d+\.\d+/i);
cy.get(statsValue)
.eq(13)
.invoke('text')
.should('match', /\d+\.\d+\.\d+/i);
cy.get(statsValue).eq(14).should('not.be.empty');
cy.get(statsValue).eq(15).should('not.be.empty');
});
it('Block height should be updating', function () {
cy.get(statsValue)
.eq(1)
.eq(2)
.invoke('text')
.then((blockHeightTxt) => {
cy.get(statsValue)

3
libs/network-stats/src/components/stats-manager/Stats.graphql
View File

@ -1,4 +1,7 @@
query Stats {
epoch {
id
}
nodeData {
stakedTotal
totalNodes

5
libs/network-stats/src/components/stats-manager/__generated__/Stats.ts generated
View File

@ -6,11 +6,14 @@ const defaultOptions = {} as const;
export type StatsQueryVariables = Types.Exact<{ [key: string]: never; }>;
export type StatsQuery = { __typename?: 'Query', nodeData?: { __typename?: 'NodeData', stakedTotal: string, totalNodes: number, inactiveNodes: number } | null, statistics: { __typename?: 'Statistics', status: string, blockHeight: string, blockDuration: string, backlogLength: string, txPerBlock: string, tradesPerSecond: string, ordersPerSecond: string, averageOrdersPerBlock: string, vegaTime: any, appVersion: string, chainVersion: string, chainId: string, genesisTime: any } };
export type StatsQuery = { __typename?: 'Query', epoch: { __typename?: 'Epoch', id: string }, nodeData?: { __typename?: 'NodeData', stakedTotal: string, totalNodes: number, inactiveNodes: number } | null, statistics: { __typename?: 'Statistics', status: string, blockHeight: string, blockDuration: string, backlogLength: string, txPerBlock: string, tradesPerSecond: string, ordersPerSecond: string, averageOrdersPerBlock: string, vegaTime: any, appVersion: string, chainVersion: string, chainId: string, genesisTime: any } };
export const StatsDocument = gql`
query Stats {
epoch {
id
}
nodeData {
stakedTotal
totalNodes

14
libs/network-stats/src/components/stats-manager/stats-manager.tsx
View File

@ -19,10 +19,14 @@ export const StatsManager = ({ className }: StatsManagerProps) => {
return () => stopPolling();
}, [startPolling, stopPolling]);
const getValue = (field: keyof NodeData | keyof Statistics) =>
['stakedTotal', 'totalNodes', 'inactiveNodes'].includes(field)
? data?.nodeData?.[field as keyof NodeData]
: data?.statistics?.[field as keyof Statistics];
const getValue = (field: keyof NodeData | keyof Statistics | 'epoch') => {
if (['stakedTotal', 'totalNodes', 'inactiveNodes'].includes(field)) {
return data?.nodeData?.[field as keyof NodeData];
} else if (field === 'epoch') {
return data?.epoch.id;
}
return data?.statistics?.[field as keyof Statistics];
};
const panels = fieldsDefinition.map(
({ field, title, description, formatter, goodThreshold }) => ({
@ -50,7 +54,7 @@ export const StatsManager = ({ className }: StatsManagerProps) => {
className={classNames(
'border rounded p-2 relative border-vega-light-200 dark:border-vega-dark-200',
{
'col-span-2': field === 'chainId' || field === 'status',
'col-span-2': field === 'chainId',
},
{
'bg-transparent border-vega-light-200 dark:border-vega-dark-200':

8
libs/network-stats/src/config/stats-fields.ts
View File

@ -20,7 +20,7 @@ export type FieldValue = any;
export type GoodThreshold = (...args: FieldValue[]) => boolean;
export interface Stats {
field: keyof NodeData | keyof Statistics;
field: keyof NodeData | keyof Statistics | 'epoch';
title: string;
goodThreshold?: GoodThreshold;
// eslint-disable-next-line
@ -161,6 +161,11 @@ const VEGA_TIME: Stats = {
description: t('The time on the blockchain'),
};
const EPOCH: Stats = {
field: 'epoch',
title: 'Epoch',
};
const APP_VERSION: Stats = {
field: 'appVersion',
title: t('App'),
@ -217,6 +222,7 @@ const CHAIN_ID: Stats = {
export const fieldsDefinition: Stats[] = [
STATUS,
EPOCH,
BLOCK_HEIGHT,
UPTIME,
TOTAL_NODES,