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

fix: view liquidity provision anchor (#1443)

Browse Source 
* fix: view liquidity provision anchor

* fix: remove router push and use external links in tooltips

* fix:  remove unused push router

* fix:  remove unused push router
This commit is contained in:
m.ray 2022-09-23 09:18:59 +01:00 committed by GitHub
parent 7effa0791c
commit e3254564ae
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
apps/trading/components/trading-mode-tooltip/trading-mode-tooltip.tsx
View File

@ -4,7 +4,8 @@ import {
getDateTimeFormat,
addDecimalsFormatNumber,
} from '@vegaprotocol/react-helpers';
import { Link } from '@vegaprotocol/ui-toolkit';
import { ExternalLink, Link as UiToolkitLink } from '@vegaprotocol/ui-toolkit';
import Link from 'next/link';
import { MarketTradingMode, AuctionTrigger } from '@vegaprotocol/types';
import type { Market_market } from '../../pages/markets/__generated__/Market';
@ -83,8 +84,10 @@ const compileGridData = (
if (isLiquidityMonitoringAuction && market.data?.suppliedStake) {
grid.push({
label: (
<Link onClick={() => onSelect && onSelect(market.id)}>
<Link href={`/liquidity/${market.id}`} passHref={true}>
<UiToolkitLink onClick={() => onSelect && onSelect(market.id)}>
{t('Current liquidity')}
</UiToolkitLink>
</Link>
),
value: formatStake(market.data.suppliedStake, market),
@ -146,12 +149,9 @@ export const TradingModeTooltip = ({
'This new market is in an opening auction to determine a fair mid-price before starting continuous trading.'
)}
</span>{' '}
<Link
href="https://docs.fairground.vega.xyz/docs/trading-questions/#auctions-what-happens-in-an-opening-auction"
target="_blank"
>
<ExternalLink href="https://docs.fairground.vega.xyz/docs/trading-questions/#auctions-what-happens-in-an-opening-auction">
{t('Find out more')}
</Link>
</ExternalLink>
</p>
<MarketDataGrid grid={compileGridData(market)} />
</>
@ -168,12 +168,9 @@ export const TradingModeTooltip = ({
'This market is in auction until it reaches sufficient liquidity.'
)}
</span>{' '}
<Link
href="https://docs.fairground.vega.xyz/docs/trading-questions/#auctions-what-is-a-liquidity-monitoring-auction"
target="_blank"
>
<ExternalLink href="https://docs.fairground.vega.xyz/docs/trading-questions/#auctions-what-is-a-liquidity-monitoring-auction">
{t('Find out more')}
</Link>
</ExternalLink>
</p>
<MarketDataGrid grid={compileGridData(market, onSelect)} />
</>
@ -186,12 +183,9 @@ export const TradingModeTooltip = ({
<span>
{t('This market is in auction due to high price volatility.')}
</span>{' '}
<Link
href="https://docs.fairground.vega.xyz/docs/trading-questions/#auctions-what-is-a-price-monitoring-auction"
target="_blank"
>
<ExternalLink href="https://docs.fairground.vega.xyz/docs/trading-questions/#auctions-what-is-a-price-monitoring-auction">
{t('Find out more')}
</Link>
</ExternalLink>
</p>
<MarketDataGrid grid={compileGridData(market)} />
</>

7
apps/trading/pages/markets/trade-grid.tsx
View File

@ -39,7 +39,6 @@ import {
MarketTradingModeMapping,
} from '@vegaprotocol/types';
import { TradingModeTooltip } from '../../components/trading-mode-tooltip';
import { useRouter } from 'next/router';
import { Header, HeaderStat } from '../../components/header';
const TradingViews = {
@ -116,7 +115,6 @@ export const TradeMarketHeader = ({
market,
onSelect,
}: TradeMarketHeaderProps) => {
const { push } = useRouter();
const { VEGA_EXPLORER_URL } = useEnvironment();
const { setAssetDetailsDialogOpen, setAssetDetailsDialogSymbol } =
useAssetDetailsDialogStore();
@ -170,7 +168,6 @@ export const TradeMarketHeader = ({
market={market}
onSelect={(marketId: string) => {
onSelect(marketId);
push(`/liquidity/${marketId}`);
}}
/>
}
@ -219,7 +216,6 @@ interface TradeGridProps {
}
export const TradeGrid = ({ market, onSelect }: TradeGridProps) => {
const { push } = useRouter();
return (
<div className="h-full grid grid-rows-[min-content_1fr]">
<TradeMarketHeader market={market} onSelect={onSelect} />
@ -257,7 +253,6 @@ export const TradeGrid = ({ market, onSelect }: TradeGridProps) => {
marketId={market.id}
onSelect={(id: string) => {
onSelect(id);
push(`/liquidity/${id}`);
}}
/>
</Tab>
@ -329,7 +324,6 @@ interface TradePanelsProps {
}
export const TradePanels = ({ market, onSelect }: TradePanelsProps) => {
const { push } = useRouter();
const [view, setView] = useState<TradingView>('Candles');
const renderView = () => {
@ -344,7 +338,6 @@ export const TradePanels = ({ market, onSelect }: TradePanelsProps) => {
marketId={market.id}
onSelect={(id: string) => {
onSelect(id);
push(`/liquidity/${id}`);
}}
/>
);

14
libs/market-info/src/components/market-info/info-market.tsx
View File

@ -1,11 +1,6 @@
import { useMemo } from 'react';
import { formatNumber, t } from '@vegaprotocol/react-helpers';
import {
AsyncRenderer,
Splash,
Accordion,
Link,
} from '@vegaprotocol/ui-toolkit';
import { AsyncRenderer, Splash, Accordion } from '@vegaprotocol/ui-toolkit';
import pick from 'lodash/pick';
import BigNumber from 'bignumber.js';
import { useQuery } from '@apollo/client';
@ -26,6 +21,8 @@ import { MarketInfoTable } from './info-key-value-table';
import { ExternalLink } from '@vegaprotocol/ui-toolkit';
import { generatePath } from 'react-router-dom';
import { useEnvironment } from '@vegaprotocol/environment';
import { Link as UiToolkitLink } from '@vegaprotocol/ui-toolkit';
import Link from 'next/link';
const Links = {
PROPOSAL_PAGE: ':tokenUrl/governance/:proposalId',
@ -72,6 +69,7 @@ export const MarketInfoContainer = ({
MARKET_INFO_QUERY,
{
variables,
errorPolicy: 'ignore',
}
);
@ -291,8 +289,10 @@ export const Info = ({ market, onSelect }: InfoProps) => {
}
assetSymbol={assetSymbol}
>
<Link onClick={() => onSelect(market.id)}>
<Link passHref={true} href={`/liquidity/${market.id}`}>
<UiToolkitLink onClick={() => onSelect(market.id)}>
{t('View liquidity provision table')}
</UiToolkitLink>
</Link>
</MarketInfoTable>
),