Feat/1278: Link to validator profiles on the forum (#1851)

This commit is contained in:
Sam Keen 2022-10-26 12:15:53 +01:00 committed by GitHub
parent 2a936f41b5
commit d49aeac0b6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 97 additions and 36 deletions

View File

@ -12,4 +12,5 @@ export const Links = {
'https://docs.vega.xyz/docs/mainnet/concepts/vega-chain/#staking-on-vega',
GOVERNANCE_PAGE: 'https://vega.xyz/governance',
PROPOSALS_GUIDE: 'https://docs.vega.xyz/docs/mainnet/tutorials/proposals',
VALIDATOR_FORUM: 'https://community.vega.xyz/c/mainnet-validator-candidates',
};

View File

@ -533,10 +533,11 @@
"unknownEthereumConnectionError": "An unknown error occurred. Check the console in your browser's web developer tools for more details",
"stakingDescriptionTitle": "How does staking on Vega work?",
"stakingDescription1": "1. VEGA is an ERC20 token. Associate it with a Vega wallet using the",
"stakingDescription2": "2. Use this site and your Vega wallet to nominate a validator",
"stakingDescription2": "2. Use this site and your Vega wallet to nominate a validator. View the validator profile pitches and discussion",
"stakingDescription3": "3. Earn a share of trading fees and treasury rewards for each full epoch staked",
"stakingDescription4": "4. Move your stake if your validator is penalised",
"stakingBridge": "staking bridge",
"onTheForum": "on the forum",
"readMoreStaking": "Read more about staking on Vega",
"networkDown": "This site is not currently connecting to the network please try again later.",
"ethTransactionModalTitle": "Ethereum Transactions",

View File

@ -0,0 +1,36 @@
import { render, screen } from '@testing-library/react';
import { BrowserRouter as Router } from 'react-router-dom';
import { StakingIntro } from './staking-intro';
describe('Staking', () => {
it('should render the component', () => {
render(
<Router>
<StakingIntro />
</Router>
);
expect(screen.getByTestId('staking-intro')).toBeInTheDocument();
expect(screen.getByTestId('callout')).toBeInTheDocument();
expect(
screen.getByText(
'1. VEGA is an ERC20 token. Associate it with a Vega wallet using the'
)
).toBeInTheDocument();
expect(screen.getByTestId('staking-associate-link')).toBeInTheDocument();
expect(
screen.getByText(
'2. Use this site and your Vega wallet to nominate a validator. View the validator profile pitches and discussion'
)
).toBeInTheDocument();
expect(screen.getByTestId('validator-forum-link')).toBeInTheDocument();
expect(
screen.getByText(
'3. Earn a share of trading fees and treasury rewards for each full epoch staked'
)
).toBeInTheDocument();
expect(
screen.getByText('4. Move your stake if your validator is penalised')
).toBeInTheDocument();
expect(screen.getByTestId('staking-guide-link')).toBeInTheDocument();
});
});

View File

@ -0,0 +1,56 @@
import { Link } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import {
Button,
Callout,
Intent,
Link as UTLink,
} from '@vegaprotocol/ui-toolkit';
import { Links } from '../../../config';
export const StakingIntro = () => {
const { t } = useTranslation();
return (
<section className="mb-8" data-testid="staking-intro">
<Callout
intent={Intent.Primary}
iconName="help"
title={t('stakingDescriptionTitle')}
>
<ol className="mb-4">
<li>
{t('stakingDescription1')}{' '}
<Link
to="/staking/associate"
className="underline"
data-testid="staking-associate-link"
>
{t('stakingBridge')}
</Link>
</li>
<li>
{t('stakingDescription2')}{' '}
<UTLink
href={Links.VALIDATOR_FORUM}
target="_blank"
data-testid="validator-forum-link"
>
{t('onTheForum')}
</UTLink>
</li>
<li>{t('stakingDescription3')}</li>
<li>{t('stakingDescription4')}</li>
</ol>
<UTLink
href={Links.STAKING_GUIDE}
target="_blank"
data-testid="staking-guide-link"
>
<Button>{t('readMoreStaking')}</Button>
</UTLink>
</Callout>
</section>
);
};

View File

@ -1,12 +1,5 @@
import {
Button,
Callout,
Intent,
Link as UTLink,
} from '@vegaprotocol/ui-toolkit';
import { useTranslation } from 'react-i18next';
import { Link } from 'react-router-dom';
import { Links } from '../../../config';
import { StakingIntro } from './staking-intro';
import { NodeList } from './node-list';
export const Staking = () => {
@ -14,33 +7,7 @@ export const Staking = () => {
return (
<>
<section className="mb-8">
<Callout
intent={Intent.Primary}
iconName="help"
title={t('stakingDescriptionTitle')}
>
<ol className="mb-4">
<li>
{t('stakingDescription1')}{' '}
<Link to="/staking/associate" className="underline">
{t('stakingBridge')}
</Link>
</li>
<li>{t('stakingDescription2')}</li>
<li>{t('stakingDescription3')}</li>
<li>{t('stakingDescription4')}</li>
</ol>
<UTLink
href={Links.STAKING_GUIDE}
target="_blank"
data-testid="staking-guide-link"
>
<Button>{t('readMoreStaking')}</Button>
</UTLink>
</Callout>
</section>
<StakingIntro />
<section>
<h2 className="text-2xl uppercase">{t('Validator nodes')}</h2>
<NodeList data-testid="node-list" />