90 lines
2.7 KiB
TypeScript
90 lines
2.7 KiB
TypeScript
import { t } from '@vegaprotocol/i18n';
|
|
import {
|
|
Button,
|
|
Link,
|
|
VegaIcon,
|
|
VegaIconNames,
|
|
} from '@vegaprotocol/ui-toolkit';
|
|
import { RISK_ACCEPTED_KEY } from '../constants';
|
|
import { TelemetryApproval } from './telemetry-approval';
|
|
import type { Networks } from '@vegaprotocol/environment';
|
|
import {
|
|
useEnvironment,
|
|
DocsLinks,
|
|
ExternalLinks,
|
|
} from '@vegaprotocol/environment';
|
|
import { useLocalStorage } from '@vegaprotocol/react-helpers';
|
|
|
|
interface Props {
|
|
onClose: () => void;
|
|
network: Networks;
|
|
}
|
|
export const RiskNoticeDialog = ({ onClose, network }: Props) => {
|
|
const [, setValue] = useLocalStorage(RISK_ACCEPTED_KEY);
|
|
|
|
const handleAcceptRisk = () => {
|
|
onClose();
|
|
setValue('true');
|
|
};
|
|
|
|
return (
|
|
<TestnetContent network={network} handleAcceptRisk={handleAcceptRisk} />
|
|
);
|
|
};
|
|
|
|
const TestnetContent = ({
|
|
network,
|
|
handleAcceptRisk,
|
|
}: {
|
|
network: Networks;
|
|
handleAcceptRisk: () => void;
|
|
}) => {
|
|
const { GITHUB_FEEDBACK_URL } = useEnvironment();
|
|
return (
|
|
<>
|
|
<p className="mb-4">
|
|
{t(
|
|
'This application for trading on Vega is connected to %s, meaning you are free to try out trading with virtual assets and no risk.',
|
|
[network]
|
|
)}
|
|
</p>
|
|
<p className="mb-4">
|
|
{t(
|
|
'Your Vega wallet must also be connected to %s, and your Ethereum wallet must be connected to Sepolia.',
|
|
[network]
|
|
)}
|
|
</p>
|
|
{GITHUB_FEEDBACK_URL && DocsLinks && (
|
|
<ul className="list-disc pl-4">
|
|
<li className="mb-1">
|
|
<Link href={ExternalLinks.VEGA_WALLET_URL} target="_blank">
|
|
<span className="underline">{t('Get a Vega Wallet')}</span>{' '}
|
|
<VegaIcon name={VegaIconNames.OPEN_EXTERNAL} />
|
|
</Link>
|
|
</li>
|
|
<li className="mb-1">
|
|
<Link href={DocsLinks.VEGA_WALLET_TOOLS_URL} target="_blank">
|
|
<span className="underline">{t('Learn about Vega Wallet')}</span>{' '}
|
|
<VegaIcon name={VegaIconNames.OPEN_EXTERNAL} />
|
|
</Link>
|
|
</li>
|
|
<li className="mb-1">
|
|
<Link href={GITHUB_FEEDBACK_URL} target="_blank">
|
|
<span className="underline">{t('Provide feedback')}</span>{' '}
|
|
<VegaIcon name={VegaIconNames.OPEN_EXTERNAL} />
|
|
</Link>
|
|
</li>
|
|
</ul>
|
|
)}
|
|
<div className="my-4">
|
|
<TelemetryApproval
|
|
helpText={t(
|
|
'Help identify bugs and improve the service by sharing anonymous usage data. You can change this in your settings at any time.'
|
|
)}
|
|
/>
|
|
</div>
|
|
<Button onClick={handleAcceptRisk}>{t('Continue')}</Button>
|
|
</>
|
|
);
|
|
};
|