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

feat(1913): validator table column heading mouseovers (#2335)

Browse Source
This commit is contained in:
Sam Keen 2022-12-07 21:55:32 +00:00 committed by GitHub
parent e37185223f
commit ce04dd9ff2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 30 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
apps/token/src/i18n/translations/dev.json
View File

@ -718,5 +718,12 @@
"ListAssetAction": "List asset",
"Proposals": "Proposals",
"Validators": "Validators",
"Redeem": "Redeem"
"Redeem": "Redeem",
"StakeDescription": "The total amount $VEGA staked to this validator including self-stake and all delegation.",
"NormalisedVotingPowerDescription": "Voting power is the relative weighting given to the validator in tendermint consensus. It is calculated based on the stake share of the validator minus any penalties due to overstaking or performance.",
"StakeShareDescription": "The stake a validator represents as a share of total stake across the network.",
"TotalPenaltiesDescription": "Total of penalties taking into account performance (considering proportion of blocks proposed against the number of blocks the validator was expected to propose) and any overstaking.",
"PendingStakeDescription": "The amount of stake that will be added or removed from the validator from the next epoch.",
"StakeNeededForPromotionStandbyDescription": "The amount of stake needed for promotion to consensus, assuming constant performance in line with previous epoch.",
"StakeNeededForPromotionCandidateDescription": "The amount of stake needed for promotion to standby, assuming constant performance in line with previous epoch."
}

5
apps/token/src/routes/staking/home/validator-tables/consensus-validators-table.tsx
View File

@ -151,27 +151,32 @@ export const ConsensusValidatorsTable = ({
{
field: ValidatorFields.STAKE,
headerName: t(ValidatorFields.STAKE).toString(),
headerTooltip: t('StakeDescription').toString(),
width: 120,
},
{
field: ValidatorFields.NORMALISED_VOTING_POWER,
headerName: t(ValidatorFields.NORMALISED_VOTING_POWER).toString(),
headerTooltip: t('NormalisedVotingPowerDescription').toString(),
width: 200,
sort: 'desc',
},
{
field: ValidatorFields.STAKE_SHARE,
headerName: t(ValidatorFields.STAKE_SHARE).toString(),
headerTooltip: t('StakeShareDescription').toString(),
width: 100,
},
{
field: ValidatorFields.TOTAL_PENALTIES,
headerName: t(ValidatorFields.TOTAL_PENALTIES).toString(),
headerTooltip: t('TotalPenaltiesDescription').toString(),
width: 120,
},
{
field: ValidatorFields.PENDING_STAKE,
headerName: t(ValidatorFields.PENDING_STAKE).toString(),
headerTooltip: t('PendingStakeDescription').toString(),
width: 110,
},
],

4
apps/token/src/routes/staking/home/validator-tables/shared.tsx
View File

@ -1,7 +1,7 @@
import { Link } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { toBigNum } from '@vegaprotocol/react-helpers';
import { Button } from '@vegaprotocol/ui-toolkit';
import { Button, TooltipCellComponent } from '@vegaprotocol/ui-toolkit';
import type { NodesFragmentFragment } from '../__generated___/Nodes';
import type { PreviousEpochQuery } from '../../__generated___/PreviousEpoch';
@ -62,6 +62,8 @@ export const defaultColDef = {
autoHeight: true,
comparator: (a: string, b: string) => parseFloat(a) - parseFloat(b),
cellStyle: { margin: '10px 0' },
tooltipComponent: TooltipCellComponent,
tooltipShowDelay: 0,
};
interface ValidatorRendererProps {

7
apps/token/src/routes/staking/home/validator-tables/standby-pending-validators-table.tsx
View File

@ -20,6 +20,7 @@ import { formatNumber, toBigNum } from '@vegaprotocol/react-helpers';
interface StandbyPendingValidatorsTableProps extends ValidatorsTableProps {
stakeNeededForPromotion: string | undefined;
stakeNeededForPromotionDescription: string;
}
export const StandbyPendingValidatorsTable = ({
@ -27,6 +28,7 @@ export const StandbyPendingValidatorsTable = ({
previousEpochData,
totalStake,
stakeNeededForPromotion,
stakeNeededForPromotionDescription,
}: StandbyPendingValidatorsTableProps) => {
const { t } = useTranslation();
const {
@ -113,27 +115,32 @@ export const StandbyPendingValidatorsTable = ({
{
field: ValidatorFields.STAKE,
headerName: t(ValidatorFields.STAKE).toString(),
headerTooltip: t('StakeDescription').toString(),
width: 120,
},
{
field: ValidatorFields.STAKE_NEEDED_FOR_PROMOTION,
headerName: t(ValidatorFields.STAKE_NEEDED_FOR_PROMOTION).toString(),
headerTooltip: stakeNeededForPromotionDescription,
width: 210,
sort: 'asc',
},
{
field: ValidatorFields.STAKE_SHARE,
headerName: t(ValidatorFields.STAKE_SHARE).toString(),
headerTooltip: t('StakeShareDescription').toString(),
width: 100,
},
{
field: ValidatorFields.TOTAL_PENALTIES,
headerName: t(ValidatorFields.TOTAL_PENALTIES).toString(),
headerTooltip: t('TotalPenaltiesDescription').toString(),
width: 120,
},
{
field: ValidatorFields.PENDING_STAKE,
headerName: t(ValidatorFields.PENDING_STAKE).toString(),
headerTooltip: t('PendingStakeDescription').toString(),
width: 110,
},
],

6
apps/token/src/routes/staking/home/validator-tables/validator-tables.tsx
View File

@ -123,6 +123,9 @@ export const ValidatorTables = ({
previousEpochData={previousEpochData}
totalStake={totalStake}
stakeNeededForPromotion={stakeNeededForPromotion}
stakeNeededForPromotionDescription={t(
'StakeNeededForPromotionStandbyDescription'
)}
/>
</>
)}
@ -151,6 +154,9 @@ export const ValidatorTables = ({
previousEpochData={previousEpochData}
totalStake={totalStake}
stakeNeededForPromotion={stakeNeededForPromotion}
stakeNeededForPromotionDescription={t(
'StakeNeededForPromotionCandidateDescription'
)}
/>
</>
)}

2
libs/ui-toolkit/src/components/tooltip/tooltip.tsx
View File

@ -60,7 +60,7 @@ export const Tooltip = ({
export const TooltipCellComponent = (props: ITooltipParams) => {
return (
<p className="max-w-sm bg-neutral-200 px-4 py-2 z-20 rounded text-sm break-word text-black">
<p className="max-w-sm border border-neutral-600 bg-neutral-200 dark:bg-neutral-800 px-4 py-2 z-20 rounded text-sm break-word text-black dark:text-white">
{props.value}
</p>
);