Compare commits
3 Commits
main
...
url_config
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
8c3f867f06 | ||
|
|
1a95814925 | ||
|
|
a6d7a5cb4e |
@ -71,7 +71,19 @@
|
||||
"tos": "https://dydx.exchange/v4-terms",
|
||||
"privacy": "https://dydx.exchange/privacy",
|
||||
"mintscan": "https://testnet.mintscan.io/dydx-testnet/txs/{tx_hash}",
|
||||
"blogs": "https://www.dydx.foundation/blog"
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"help": "https://help.dydx.exchange/",
|
||||
"initialMarginFractionLearnMore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"documentation": "https://docs.dydx.exchange/",
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"governanceLearnMore": "https://help.dydx.exchange",
|
||||
"stakingLearnMore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnMore": "https://help.dydx.exchange",
|
||||
"walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -130,7 +142,19 @@
|
||||
"tos": "https://dydx.exchange/v4-terms",
|
||||
"privacy": "https://dydx.exchange/privacy",
|
||||
"mintscan": "https://testnet.mintscan.io/dydx-testnet/txs/{tx_hash}",
|
||||
"blogs": "https://www.dydx.foundation/blog"
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"help": "https://help.dydx.exchange/",
|
||||
"initialMarginFractionLearnMore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"documentation": "https://docs.dydx.exchange/",
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"governanceLearnMore": "https://help.dydx.exchange",
|
||||
"stakingLearnMore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnMore": "https://help.dydx.exchange",
|
||||
"walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -189,7 +213,19 @@
|
||||
"tos": "https://dydx.exchange/v4-terms",
|
||||
"privacy": "https://dydx.exchange/privacy",
|
||||
"mintscan": "https://testnet.mintscan.io/dydx-testnet/txs/{tx_hash}",
|
||||
"blogs": "https://www.dydx.foundation/blog"
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"help": "https://help.dydx.exchange/",
|
||||
"initialMarginFractionLearnMore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"documentation": "https://docs.dydx.exchange/",
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"governanceLearnMore": "https://help.dydx.exchange",
|
||||
"stakingLearnMore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnMore": "https://help.dydx.exchange",
|
||||
"walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -248,7 +284,19 @@
|
||||
"tos": "https://dydx.exchange/v4-terms",
|
||||
"privacy": "https://dydx.exchange/privacy",
|
||||
"mintscan": "https://testnet.mintscan.io/dydx-testnet/txs/{tx_hash}",
|
||||
"blogs": "https://www.dydx.foundation/blog"
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"help": "https://help.dydx.exchange/",
|
||||
"initialMarginFractionLearnMore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"documentation": "https://docs.dydx.exchange/",
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"governanceLearnMore": "https://help.dydx.exchange",
|
||||
"stakingLearnMore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnMore": "https://help.dydx.exchange",
|
||||
"walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -312,7 +360,16 @@
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"feedback": "https://docs.google.com/forms/d/e/1FAIpQLSezLsWCKvAYDEb7L-2O4wOON1T56xxro9A2Azvl6IxXHP_15Q/viewform",
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"help": "https://help.dydx.exchange"
|
||||
"help": "https://help.dydx.exchange",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"initialMarginFractionLearnMore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"governanceLearnMore": "https://help.dydx.exchange",
|
||||
"stakingLearnMore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnMore": "https://help.dydx.exchange",
|
||||
"walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -376,7 +433,16 @@
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"feedback": "https://docs.google.com/forms/d/e/1FAIpQLSezLsWCKvAYDEb7L-2O4wOON1T56xxro9A2Azvl6IxXHP_15Q/viewform",
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"help": "https://help.dydx.exchange"
|
||||
"help": "https://help.dydx.exchange",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"initialMarginFractionLearnMore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"governanceLearnMore": "https://help.dydx.exchange",
|
||||
"stakingLearnMore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnMore": "https://help.dydx.exchange",
|
||||
"walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -443,7 +509,17 @@
|
||||
"documentation": "https://docs.dydx.exchange/",
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"feedback": "https://docs.google.com/forms/d/e/1FAIpQLSezLsWCKvAYDEb7L-2O4wOON1T56xxro9A2Azvl6IxXHP_15Q/viewform",
|
||||
"blogs": "https://www.dydx.foundation/blog"
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"help": "https://help.dydx.exchange/",
|
||||
"initialMarginFractionLearnMore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"governanceLearnMore": "https://help.dydx.exchange",
|
||||
"stakingLearnMore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnMore": "https://help.dydx.exchange",
|
||||
"walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -507,7 +583,17 @@
|
||||
"documentation": "https://docs.dydx.exchange/",
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"feedback": "https://docs.google.com/forms/d/e/1FAIpQLSezLsWCKvAYDEb7L-2O4wOON1T56xxro9A2Azvl6IxXHP_15Q/viewform",
|
||||
"blogs": "https://www.dydx.foundation/blog"
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"help": "https://help.dydx.exchange/",
|
||||
"initialMarginFractionLearnMore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"governanceLearnMore": "https://help.dydx.exchange",
|
||||
"stakingLearnMore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnMore": "https://help.dydx.exchange",
|
||||
"walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -571,7 +657,17 @@
|
||||
"documentation": "https://docs.dydx.exchange/",
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"feedback": "https://docs.google.com/forms/d/e/1FAIpQLSezLsWCKvAYDEb7L-2O4wOON1T56xxro9A2Azvl6IxXHP_15Q/viewform",
|
||||
"blogs": "https://www.dydx.foundation/blog"
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"help": "https://help.dydx.exchange/",
|
||||
"initialMarginFractionLearnMore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"governanceLearnMore": "https://help.dydx.exchange",
|
||||
"stakingLearnMore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnMore": "https://help.dydx.exchange",
|
||||
"walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -635,7 +731,17 @@
|
||||
"documentation": "https://docs.dydx.exchange/",
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"feedback": "https://docs.google.com/forms/d/e/1FAIpQLSezLsWCKvAYDEb7L-2O4wOON1T56xxro9A2Azvl6IxXHP_15Q/viewform",
|
||||
"blogs": "https://www.dydx.foundation/blog"
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"help": "https://help.dydx.exchange/",
|
||||
"initialMarginFractionLearnMore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"governanceLearnMore": "https://help.dydx.exchange",
|
||||
"stakingLearnMore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnMore": "https://help.dydx.exchange",
|
||||
"walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -699,7 +805,17 @@
|
||||
"documentation": "https://docs.dydx.exchange/",
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"feedback": "https://docs.google.com/forms/d/e/1FAIpQLSezLsWCKvAYDEb7L-2O4wOON1T56xxro9A2Azvl6IxXHP_15Q/viewform",
|
||||
"blogs": "https://www.dydx.foundation/blog"
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"help": "https://help.dydx.exchange/",
|
||||
"initialMarginFractionLearnMore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"governanceLearnMore": "https://help.dydx.exchange",
|
||||
"stakingLearnMore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnMore": "https://help.dydx.exchange",
|
||||
"walletLearnMore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -824,10 +940,20 @@
|
||||
"privacy": "https://dydx.exchange/privacy",
|
||||
"statusPage": "https://status.v4testnet.dydx.exchange/",
|
||||
"mintscan": "https://testnet.mintscan.io/dydx-testnet/txs/{tx_hash}",
|
||||
"documentation": "https://v4-teacher.vercel.app/",
|
||||
"documentation": "https://docs.dydx.exchange/",
|
||||
"community": "https://discord.com/invite/dydx",
|
||||
"feedback": "https://docs.google.com/forms/d/e/1FAIpQLSezLsWCKvAYDEb7L-2O4wOON1T56xxro9A2Azvl6IxXHP_15Q/viewform",
|
||||
"blogs": "https://www.dydx.foundation/blog"
|
||||
"blogs": "https://www.dydx.foundation/blog",
|
||||
"foundation": "https://www.dydx.foundation",
|
||||
"help": "https://help.dydx.exchange/",
|
||||
"initialMarginFractionLearnmore": "https://help.dydx.exchange/articles/5232637-maximum-position-sizes",
|
||||
"reduceOnlyLearnmore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"mintscanBase": "https://testnet.mintscan.io/dydx-testnet",
|
||||
"governanceLearnmore": "https://help.dydx.exchange",
|
||||
"stakingLearnmore": "https://help.dydx.exchange",
|
||||
"keplrDashboard": "https://testnet.keplr.app/",
|
||||
"accountExportLearnmore": "https://help.dydx.exchange",
|
||||
"walletLearnmore": "https://www.dydx.academy/video/defi-wallet"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
@ -888,11 +1014,20 @@
|
||||
"tos": "[HTTP link to TOS]",
|
||||
"privacy": "[HTTP link to Privacy Policy]",
|
||||
"mintscan": "[HTTP link to Mintscan, with {tx_hash} placeholder]",
|
||||
"documentation": "[HTTP link to documentation, can be null]",
|
||||
"community": "[HTTP link to community, can be null]",
|
||||
"mintscanBase": "[HTTP link to TOS mintsacn base url]",
|
||||
"feedback": "[HTTP link to feedback form, can be null]",
|
||||
"blogs": "[HTTP link to blogs, can be null]",
|
||||
"help": "[HTTP link to help page, can be null]"
|
||||
"foundation": "[HTTP link to foundation, can be null]",
|
||||
"initialMarginFractionLearnMore": "[HTTP link to initial margin fraction learn more, can be null]",
|
||||
"reduceOnlyLearnMore": "https://help.dydx.exchange/articles/6345793-reduce-only-orders",
|
||||
"documentation": "[HTTP link to documentation, can be null]",
|
||||
"community": "[HTTP link to community, can be null]",
|
||||
"help": "[HTTP link to help page, can be null]",
|
||||
"governanceLearnMore": "[HTTP link to governance learn more, can be null]",
|
||||
"stakingLearnMore": "[HTTP link to staking learn more, can be null]",
|
||||
"keplrDashboard": "[HTTP link to keplr dashboard, can be null]",
|
||||
"accountExportLearnMore": "[HTTP link to account export learn more, can be null]",
|
||||
"walletLearnMore": "[HTTP link to wallet learn more, can be null]"
|
||||
},
|
||||
"wallets": {
|
||||
"walletconnect": {
|
||||
|
||||
@ -2,11 +2,13 @@ import type { ReactNode } from 'react';
|
||||
import styled, { AnyStyledComponent } from 'styled-components';
|
||||
import { Content, Portal, Provider, Root, Trigger, Arrow } from '@radix-ui/react-tooltip';
|
||||
|
||||
import { STRING_KEYS } from '@/constants/localization';
|
||||
import { tooltipStrings } from '@/constants/tooltips';
|
||||
|
||||
import { useStringGetter } from '@/hooks';
|
||||
import { useStringGetter, useURLConfigs } from '@/hooks';
|
||||
|
||||
import { Icon, IconName } from '@/components/Icon';
|
||||
import { Link } from '@/components/Link';
|
||||
|
||||
import { layoutMixins } from '@/styles/layoutMixins';
|
||||
import { popoverMixins } from '@/styles/popoverMixins';
|
||||
@ -38,20 +40,24 @@ export const WithTooltip = ({
|
||||
slotTooltip,
|
||||
}: ElementProps & StyleProps) => {
|
||||
const stringGetter = useStringGetter();
|
||||
const urlConfigs = useURLConfigs();
|
||||
|
||||
const getTooltipStrings = tooltip && tooltipStrings[tooltip];
|
||||
if (!getTooltipStrings && !tooltipString && !slotTooltip) return <>{children}</>;
|
||||
|
||||
let tooltipTitle;
|
||||
let tooltipBody;
|
||||
let tooltipLearnMore;
|
||||
|
||||
if (getTooltipStrings) {
|
||||
const { title, body } = getTooltipStrings({
|
||||
const { title, body, learnMoreLink } = getTooltipStrings({
|
||||
stringGetter,
|
||||
stringParams,
|
||||
urlConfigs,
|
||||
});
|
||||
tooltipTitle = title;
|
||||
tooltipBody = body;
|
||||
tooltipLearnMore = learnMoreLink;
|
||||
} else {
|
||||
tooltipBody = tooltipString;
|
||||
}
|
||||
@ -72,6 +78,13 @@ export const WithTooltip = ({
|
||||
<dl>
|
||||
{tooltipTitle && <dt>{tooltipTitle}</dt>}
|
||||
{tooltipBody && <dd>{tooltipBody}</dd>}
|
||||
{tooltipLearnMore && (
|
||||
<dd>
|
||||
<Styled.LearnMore href={tooltipLearnMore}>
|
||||
{stringGetter({ key: STRING_KEYS.LEARN_MORE })} →
|
||||
</Styled.LearnMore>
|
||||
</dd>
|
||||
)}
|
||||
<Styled.Arrow />
|
||||
</dl>
|
||||
)}
|
||||
@ -142,3 +155,7 @@ Styled.Arrow = styled(Arrow)`
|
||||
Styled.Icon = styled(Icon)`
|
||||
color: var(--color-text-0);
|
||||
`;
|
||||
|
||||
Styled.LearnMore = styled(Link)`
|
||||
--link-color: var(--color-accent);
|
||||
`;
|
||||
|
||||
@ -8,6 +8,8 @@ import {
|
||||
WARNINGS_STRING_KEYS,
|
||||
} from '@dydxprotocol/v4-localization';
|
||||
|
||||
import { type LinksConfigs } from '@/hooks/useURLConfigs';
|
||||
|
||||
export { TOOLTIP_STRING_KEYS } from '@dydxprotocol/v4-localization';
|
||||
|
||||
export enum SupportedLocales {
|
||||
@ -79,9 +81,11 @@ export type TooltipStrings = {
|
||||
[key: string]: ({
|
||||
stringGetter,
|
||||
stringParams,
|
||||
urlConfigs,
|
||||
}: {
|
||||
stringGetter: StringGetterFunction;
|
||||
stringParams?: any;
|
||||
urlConfigs?: LinksConfigs;
|
||||
}) => {
|
||||
title: string;
|
||||
body: string;
|
||||
|
||||
@ -37,7 +37,3 @@ export const HISTORY_ROUTE = `${AppRoute.Portfolio}/${PortfolioRoute.History}/:s
|
||||
export const DEFAULT_TRADE_ROUTE = `${AppRoute.Trade}/${DEFAULT_MARKETID}`;
|
||||
export const SETTINGS_ROUTE = `${AppRoute.Settings}/*`;
|
||||
export const DEFAULT_DOCUMENT_TITLE = 'dYdX';
|
||||
|
||||
export enum ExternalLink {
|
||||
Foundation = 'https://dydx.foundation',
|
||||
}
|
||||
|
||||
@ -57,10 +57,10 @@ export const tradeTooltips: TooltipStrings = {
|
||||
title: stringGetter({ key: TOOLTIP_STRING_KEYS.INDEX_PRICE_TITLE }),
|
||||
body: stringGetter({ key: TOOLTIP_STRING_KEYS.INDEX_PRICE_BODY }),
|
||||
}),
|
||||
'initial-margin-fraction': ({ stringGetter }) => ({
|
||||
'initial-margin-fraction': ({ stringGetter, urlConfigs }) => ({
|
||||
title: stringGetter({ key: TOOLTIP_STRING_KEYS.INITIAL_MARGIN_FRACTION_TITLE }),
|
||||
body: stringGetter({ key: TOOLTIP_STRING_KEYS.INITIAL_MARGIN_FRACTION_BODY }),
|
||||
learnMoreLink: 'https://help.dydx.exchange/articles/5232637-maximum-position-sizes',
|
||||
learnMoreLink: urlConfigs?.initialMarginFractionLearnMore,
|
||||
}),
|
||||
'initial-stop': ({ stringGetter }) => ({
|
||||
title: stringGetter({ key: TOOLTIP_STRING_KEYS.INITIAL_STOP_TITLE }),
|
||||
@ -146,10 +146,10 @@ export const tradeTooltips: TooltipStrings = {
|
||||
title: stringGetter({ key: TOOLTIP_STRING_KEYS.REALIZED_PNL_TITLE }),
|
||||
body: stringGetter({ key: TOOLTIP_STRING_KEYS.REALIZED_PNL_BODY }),
|
||||
}),
|
||||
'reduce-only': ({ stringGetter }) => ({
|
||||
'reduce-only': ({ stringGetter, urlConfigs }) => ({
|
||||
title: stringGetter({ key: TOOLTIP_STRING_KEYS.REDUCE_ONLY_TITLE }),
|
||||
body: stringGetter({ key: TOOLTIP_STRING_KEYS.REDUCE_ONLY_BODY }),
|
||||
learnMoreLink: 'https://help.dydx.exchange/articles/6345793-reduce-only-orders',
|
||||
learnMoreLink: urlConfigs?.reduceOnlyLearnMore,
|
||||
}),
|
||||
spread: () => ({
|
||||
title: 'Spread',
|
||||
|
||||
@ -22,6 +22,7 @@ import { useShouldShowFooter } from './useShouldShowFooter';
|
||||
import { useSelectedNetwork } from './useSelectedNetwork';
|
||||
import { useStringGetter } from './useStringGetter';
|
||||
import { useSubaccount } from './useSubaccount';
|
||||
import { useURLConfigs } from './useURLConfigs';
|
||||
|
||||
export {
|
||||
useApiState,
|
||||
@ -48,4 +49,5 @@ export {
|
||||
useSelectedNetwork,
|
||||
useStringGetter,
|
||||
useSubaccount,
|
||||
useURLConfigs,
|
||||
};
|
||||
|
||||
50
src/hooks/useURLConfigs.ts
Normal file
50
src/hooks/useURLConfigs.ts
Normal file
@ -0,0 +1,50 @@
|
||||
import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks';
|
||||
|
||||
import { useSelectedNetwork } from '@/hooks';
|
||||
|
||||
const FALLBACK_URL = 'https://help.dydx.exchange/';
|
||||
|
||||
export interface LinksConfigs {
|
||||
tos: string,
|
||||
privacy: string,
|
||||
mintscan: string,
|
||||
mintscanBase: string,
|
||||
feedback?: string,
|
||||
help?: string,
|
||||
blogs?: string,
|
||||
foundation?: string,
|
||||
initialMarginFractionLearnMore?: string,
|
||||
reduceOnlyLearnMore?: string,
|
||||
documentation?: string,
|
||||
community?: string,
|
||||
governanceLearnMore?: string,
|
||||
stakingLearnMore?: string,
|
||||
keplrDashboard?: string,
|
||||
accountExportLearnMore?: string,
|
||||
walletLearnMore?: string
|
||||
}
|
||||
|
||||
export const useURLConfigs = (): LinksConfigs => {
|
||||
const { selectedNetwork } = useSelectedNetwork();
|
||||
const linksConfigs = ENVIRONMENT_CONFIG_MAP[selectedNetwork].links as LinksConfigs;
|
||||
|
||||
return {
|
||||
tos: linksConfigs.tos,
|
||||
privacy: linksConfigs.privacy,
|
||||
mintscan: linksConfigs.mintscan,
|
||||
mintscanBase: linksConfigs.mintscanBase,
|
||||
feedback: linksConfigs.feedback || FALLBACK_URL,
|
||||
help: linksConfigs.help || FALLBACK_URL,
|
||||
blogs: linksConfigs.blogs || FALLBACK_URL,
|
||||
foundation: linksConfigs.foundation || FALLBACK_URL,
|
||||
initialMarginFractionLearnMore: linksConfigs.initialMarginFractionLearnMore || FALLBACK_URL,
|
||||
reduceOnlyLearnMore: linksConfigs.reduceOnlyLearnMore || FALLBACK_URL,
|
||||
documentation: linksConfigs.documentation || FALLBACK_URL,
|
||||
community: linksConfigs.community || FALLBACK_URL,
|
||||
governanceLearnMore: linksConfigs.governanceLearnMore || FALLBACK_URL,
|
||||
stakingLearnMore: linksConfigs.stakingLearnMore || FALLBACK_URL,
|
||||
keplrDashboard: linksConfigs.keplrDashboard || FALLBACK_URL,
|
||||
accountExportLearnMore: linksConfigs.accountExportLearnMore || FALLBACK_URL,
|
||||
walletLearnMore: linksConfigs.walletLearnMore || FALLBACK_URL,
|
||||
};
|
||||
};
|
||||
@ -8,7 +8,7 @@ import { STRING_KEYS } from '@/constants/localization';
|
||||
import { AppRoute } from '@/constants/routes';
|
||||
import { LogoShortIcon, BellStrokeIcon } from '@/icons';
|
||||
|
||||
import { useTokenConfigs, useStringGetter } from '@/hooks';
|
||||
import { useTokenConfigs, useStringGetter, useURLConfigs } from '@/hooks';
|
||||
|
||||
import { Icon, IconName } from '@/components/Icon';
|
||||
import { IconButton } from '@/components/IconButton';
|
||||
@ -28,6 +28,7 @@ import breakpoints from '@/styles/breakpoints';
|
||||
|
||||
export const HeaderDesktop = () => {
|
||||
const stringGetter = useStringGetter();
|
||||
const { documentation, community, mintscanBase } = useURLConfigs();
|
||||
const dispatch = useDispatch();
|
||||
const { chainTokenLabel } = useTokenConfigs();
|
||||
|
||||
@ -63,19 +64,19 @@ export const HeaderDesktop = () => {
|
||||
value: 'DOCUMENTATION',
|
||||
slotBefore: <Icon iconName={IconName.Terminal} />,
|
||||
label: stringGetter({ key: STRING_KEYS.DOCUMENTATION }),
|
||||
href: 'https://docs.dydx.exchange/',
|
||||
href: documentation,
|
||||
},
|
||||
{
|
||||
value: 'MINTSCAN',
|
||||
slotBefore: <Icon iconName={IconName.Mintscan} />,
|
||||
label: stringGetter({ key: STRING_KEYS.MINTSCAN }),
|
||||
href: 'https://testnet.mintscan.io/dydx-testnet',
|
||||
href: mintscanBase,
|
||||
},
|
||||
{
|
||||
value: 'COMMUNITY',
|
||||
slotBefore: <Icon iconName={IconName.Discord} />,
|
||||
label: stringGetter({ key: STRING_KEYS.COMMUNITY }),
|
||||
href: 'https://discord.gg/dydx',
|
||||
href: community,
|
||||
},
|
||||
{
|
||||
value: 'TERMS_OF_USE',
|
||||
|
||||
@ -5,7 +5,7 @@ import { STRING_KEYS } from '@/constants/localization';
|
||||
import { ButtonAction, ButtonSize } from '@/constants/buttons';
|
||||
import { DialogTypes } from '@/constants/dialogs';
|
||||
|
||||
import { useBreakpoints, useStringGetter } from '@/hooks';
|
||||
import { useBreakpoints, useStringGetter, useURLConfigs } from '@/hooks';
|
||||
|
||||
import { breakpoints } from '@/styles';
|
||||
import { layoutMixins } from '@/styles/layoutMixins';
|
||||
@ -20,15 +20,10 @@ import { openDialog } from '@/state/dialogs';
|
||||
import { DYDXBalancePanel } from './DYDXBalancePanel';
|
||||
import { MigratePanel } from './MigratePanel';
|
||||
|
||||
// TODO: consolidate help link urls to env variables
|
||||
const GOVERNANCE_HELP_URL = 'https://help.dydx.exchange/';
|
||||
const STAKING_HELP_URL =
|
||||
'https://docs.dydx.community/dydx-chain-documentation/staking/how-to-stake';
|
||||
|
||||
export const RewardsPage = () => {
|
||||
const dispatch = useDispatch();
|
||||
const stringGetter = useStringGetter();
|
||||
|
||||
const { governanceLearnMore, stakingLearnMore } = useURLConfigs();
|
||||
const { isTablet, isNotTablet } = useBreakpoints();
|
||||
|
||||
const panelArrow = (
|
||||
@ -58,7 +53,7 @@ export const RewardsPage = () => {
|
||||
>
|
||||
<Styled.Description>
|
||||
{stringGetter({ key: STRING_KEYS.GOVERNANCE_DESCRIPTION })}
|
||||
<Link href={GOVERNANCE_HELP_URL} onClick={(e) => e.stopPropagation()}>
|
||||
<Link href={governanceLearnMore} onClick={(e) => e.stopPropagation()}>
|
||||
{stringGetter({ key: STRING_KEYS.LEARN_MORE })} →
|
||||
</Link>
|
||||
</Styled.Description>
|
||||
@ -71,7 +66,7 @@ export const RewardsPage = () => {
|
||||
>
|
||||
<Styled.Description>
|
||||
{stringGetter({ key: STRING_KEYS.STAKING_DESCRIPTION })}
|
||||
<Link href={STAKING_HELP_URL} onClick={(e) => e.stopPropagation()}>
|
||||
<Link href={stakingLearnMore} onClick={(e) => e.stopPropagation()}>
|
||||
{stringGetter({ key: STRING_KEYS.LEARN_MORE })} →
|
||||
</Link>
|
||||
</Styled.Description>
|
||||
|
||||
@ -2,7 +2,7 @@ import styled, { type AnyStyledComponent } from 'styled-components';
|
||||
|
||||
import { ButtonAction, ButtonSize, ButtonType } from '@/constants/buttons';
|
||||
import { STRING_KEYS } from '@/constants/localization';
|
||||
import { useBreakpoints, useStringGetter } from '@/hooks';
|
||||
import { useBreakpoints, useStringGetter, useURLConfigs } from '@/hooks';
|
||||
|
||||
import { Button } from '@/components/Button';
|
||||
import { Dialog, DialogPlacement } from '@/components/Dialog';
|
||||
@ -15,12 +15,10 @@ type ElementProps = {
|
||||
setIsOpen: (open: boolean) => void;
|
||||
};
|
||||
|
||||
// TODO: replace placeholder URL with real URLs when avaialble
|
||||
const KEPLR_DASHBOARD_URL = 'https://testnet.keplr.app/';
|
||||
const HELP_URL = 'https://help.dydx.exchange/en/articles/2921366-how-do-i-create-an-account-or-sign-up';
|
||||
|
||||
export const ExternalNavKeplrDialog = ({ setIsOpen }: ElementProps) => {
|
||||
const stringGetter = useStringGetter();
|
||||
const { keplrDashboard, accountExportLearnMore } = useURLConfigs();
|
||||
|
||||
const { isTablet } = useBreakpoints();
|
||||
|
||||
return (
|
||||
@ -31,7 +29,7 @@ export const ExternalNavKeplrDialog = ({ setIsOpen }: ElementProps) => {
|
||||
placement={isTablet ? DialogPlacement.FullScreen : DialogPlacement.Default}
|
||||
>
|
||||
<Styled.Content>
|
||||
<Styled.Button type={ButtonType.Link} size={ButtonSize.XLarge} href={KEPLR_DASHBOARD_URL}>
|
||||
<Styled.Button type={ButtonType.Link} size={ButtonSize.XLarge} href={keplrDashboard}>
|
||||
<span>
|
||||
{stringGetter({
|
||||
key: STRING_KEYS.NAVIGATE_TO_KEPLR,
|
||||
@ -48,7 +46,7 @@ export const ExternalNavKeplrDialog = ({ setIsOpen }: ElementProps) => {
|
||||
/>
|
||||
</Styled.Button>
|
||||
|
||||
<Styled.Button type={ButtonType.Link} size={ButtonSize.XLarge} href={HELP_URL}>
|
||||
<Styled.Button type={ButtonType.Link} size={ButtonSize.XLarge} href={accountExportLearnMore}>
|
||||
<span>
|
||||
{stringGetter({
|
||||
key: STRING_KEYS.LEARN_TO_EXPORT,
|
||||
|
||||
@ -2,10 +2,10 @@ import { useMemo } from 'react';
|
||||
import styled, { AnyStyledComponent } from 'styled-components';
|
||||
|
||||
import { STRING_KEYS } from '@/constants/localization';
|
||||
import { useStringGetter } from '@/hooks';
|
||||
import { ChatIcon, FeedbackIcon, FileIcon, TerminalIcon } from '@/icons';
|
||||
import { useStringGetter, useURLConfigs } from '@/hooks';
|
||||
|
||||
import { ComboboxDialogMenu } from '@/components/ComboboxDialogMenu';
|
||||
import { Icon, IconName } from '@/components/Icon';
|
||||
|
||||
import { isTruthy } from '@/lib/isTruthy';
|
||||
|
||||
@ -13,39 +13,24 @@ type ElementProps = {
|
||||
setIsOpen: (open: boolean) => void;
|
||||
};
|
||||
|
||||
const HELP_LINKS = {
|
||||
apiDocumentation: 'https://v4-teacher.vercel.app/',
|
||||
helpCenter: null,
|
||||
feedback: null,
|
||||
};
|
||||
|
||||
export const HelpDialog = ({ setIsOpen }: ElementProps) => {
|
||||
const stringGetter = useStringGetter();
|
||||
const { help: helpCenter, community } = useURLConfigs();
|
||||
|
||||
const HELP_ITEMS = useMemo(
|
||||
() => [
|
||||
{
|
||||
group: 'help-items',
|
||||
items: [
|
||||
HELP_LINKS.helpCenter && {
|
||||
helpCenter && {
|
||||
value: 'help-center',
|
||||
label: stringGetter({ key: STRING_KEYS.HELP_CENTER }),
|
||||
description: stringGetter({ key: STRING_KEYS.HELP_CENTER_DESCRIPTION }),
|
||||
onSelect: () => {
|
||||
HELP_LINKS.helpCenter && globalThis.open(HELP_LINKS.helpCenter, '_blank');
|
||||
helpCenter && globalThis.open(helpCenter, '_blank');
|
||||
setIsOpen(false);
|
||||
},
|
||||
slotBefore: <FileIcon />,
|
||||
},
|
||||
HELP_LINKS.apiDocumentation && {
|
||||
value: 'api-documentation',
|
||||
label: stringGetter({ key: STRING_KEYS.API_DOCUMENTATION }),
|
||||
description: stringGetter({ key: STRING_KEYS.API_DOCUMENTATION_DESCRIPTION }),
|
||||
onSelect: () => {
|
||||
HELP_LINKS.apiDocumentation && globalThis.open(HELP_LINKS.apiDocumentation, '_blank');
|
||||
setIsOpen(false);
|
||||
},
|
||||
slotBefore: <TerminalIcon />,
|
||||
slotBefore: <Icon iconName={IconName.File} />,
|
||||
},
|
||||
globalThis?.Intercom && {
|
||||
value: 'live-chat',
|
||||
@ -55,22 +40,22 @@ export const HelpDialog = ({ setIsOpen }: ElementProps) => {
|
||||
globalThis.Intercom('show');
|
||||
setIsOpen(false);
|
||||
},
|
||||
slotBefore: <ChatIcon />,
|
||||
slotBefore: <Icon iconName={IconName.Chat} />,
|
||||
},
|
||||
HELP_LINKS.feedback && {
|
||||
value: 'feedback',
|
||||
label: stringGetter({ key: STRING_KEYS.PROVIDE_FEEDBACK }),
|
||||
description: stringGetter({ key: STRING_KEYS.PROVIDE_FEEDBACK_DESCRIPTION }),
|
||||
community && {
|
||||
value: 'community',
|
||||
label: stringGetter({ key: STRING_KEYS.COMMUNITY }),
|
||||
description: stringGetter({ key: STRING_KEYS.COMMUNITY_DESCRIPTION }),
|
||||
onSelect: () => {
|
||||
HELP_LINKS.feedback && globalThis.open(HELP_LINKS.feedback, '_blank');
|
||||
community && globalThis.open(community, '_blank');
|
||||
setIsOpen(false);
|
||||
},
|
||||
slotBefore: <FeedbackIcon />,
|
||||
slotBefore: <Icon iconName={IconName.Discord} />,
|
||||
},
|
||||
].filter(isTruthy),
|
||||
},
|
||||
],
|
||||
[stringGetter]
|
||||
[stringGetter, helpCenter, community]
|
||||
);
|
||||
|
||||
return (
|
||||
|
||||
@ -13,16 +13,15 @@ import { Button } from '@/components/Button';
|
||||
import { Icon } from '@/components/Icon';
|
||||
import { Link } from '@/components/Link';
|
||||
|
||||
import { useAccounts, useStringGetter } from '@/hooks';
|
||||
import { useAccounts, useStringGetter, useURLConfigs } from '@/hooks';
|
||||
import { useDisplayedWallets } from '@/hooks/useDisplayedWallets';
|
||||
|
||||
import { breakpoints } from '@/styles';
|
||||
import { layoutMixins } from '@/styles/layoutMixins';
|
||||
|
||||
const aboutWalletsLink = `https://www.dydx.academy/video/defi-wallet`;
|
||||
|
||||
export const ChooseWallet = () => {
|
||||
const stringGetter = useStringGetter();
|
||||
const { walletLearnMore } = useURLConfigs();
|
||||
|
||||
const displayedWallets = useDisplayedWallets();
|
||||
|
||||
@ -63,7 +62,7 @@ export const ChooseWallet = () => {
|
||||
</Styled.Wallets>
|
||||
|
||||
<Styled.Footer>
|
||||
<Link href={aboutWalletsLink} withIcon>
|
||||
<Link href={walletLearnMore} withIcon>
|
||||
{stringGetter({ key: STRING_KEYS.ABOUT_WALLETS })}
|
||||
</Link>
|
||||
</Styled.Footer>
|
||||
|
||||
@ -15,6 +15,7 @@ import {
|
||||
useTokenConfigs,
|
||||
useStringGetter,
|
||||
useAccountBalance,
|
||||
useURLConfigs,
|
||||
} from '@/hooks';
|
||||
|
||||
import { OnboardingTriggerButton } from '@/views/dialogs/OnboardingTriggerButton';
|
||||
@ -36,10 +37,9 @@ import { truncateAddress } from '@/lib/wallet';
|
||||
import { layoutMixins } from '@/styles/layoutMixins';
|
||||
import { headerMixins } from '@/styles/headerMixins';
|
||||
|
||||
const explorerBaseUri = 'https://testnet.mintscan.io/dydx-testnet';
|
||||
|
||||
export const AccountMenu = () => {
|
||||
const stringGetter = useStringGetter();
|
||||
const { mintscanBase } = useURLConfigs();
|
||||
const { isTablet } = useBreakpoints();
|
||||
const dispatch = useDispatch();
|
||||
const onboardingState = useSelector(getOnboardingState);
|
||||
@ -92,7 +92,7 @@ export const AccountMenu = () => {
|
||||
/>
|
||||
<IconButton
|
||||
action={ButtonAction.Base}
|
||||
href={`${explorerBaseUri}/account/${dydxAddress}`}
|
||||
href={`${mintscanBase}/account/${dydxAddress}`}
|
||||
iconName={IconName.LinkOut}
|
||||
shape={ButtonShape.Square}
|
||||
type={ButtonType.Link}
|
||||
@ -167,7 +167,7 @@ export const AccountMenu = () => {
|
||||
// value: 'ViewInExplorer',
|
||||
// icon: <Icon iconName={IconName.Etherscan} />,
|
||||
// label: stringGetter({ key: STRING_KEYS.OPEN_IN_ETHERSCAN }),
|
||||
// onSelect: () => globalThis.open(`${explorerBaseUri}/address/${address}`),
|
||||
// onSelect: () => globalThis.open(`${mintscanBase}/address/${address}`),
|
||||
// separator: true,
|
||||
// },
|
||||
...(onboardingState === OnboardingState.AccountConnected && hdKey
|
||||
|
||||
Loading…
Reference in New Issue
Block a user