vega-frontend-monorepo/apps/trading/components/market-trading-mode/market-trading-mode.tsx
botond 2211abbd72
chore: cleanup type gen (#2362)
* chore: remove apollo type gen and clean up types lib

* fix: format

* fix: tests

* fix: format

* fix: hammer token types til sh*t turns green

* fix: format

* fix: apparently format again

* fix: lint

* fix: build-specs

* fix: format

* chore: regen types

* chore: regenerate types again

* fix: format
2022-12-08 21:13:30 +00:00

111 lines
3.0 KiB
TypeScript

import { useCallback, useMemo, useState } from 'react';
import { t, useDataProvider } from '@vegaprotocol/react-helpers';
import type { MarketDealTicket } from '@vegaprotocol/market-list';
import { compileGridData, TradingModeTooltip } from '@vegaprotocol/deal-ticket';
import * as Schema from '@vegaprotocol/types';
import type {
MarketData,
MarketDataUpdateFieldsFragment,
SingleMarketFieldsFragment,
} from '@vegaprotocol/market-list';
import { marketDataProvider, marketProvider } from '@vegaprotocol/market-list';
import { HeaderStat } from '../header';
import { Tooltip } from '@vegaprotocol/ui-toolkit';
interface Props {
marketId?: string;
onSelect?: (marketId: string) => void;
isHeader?: boolean;
noUpdate?: boolean;
initialMode?: Schema.MarketTradingMode;
initialTrigger?: Schema.AuctionTrigger;
}
export const MarketTradingMode = ({
marketId,
onSelect,
isHeader = false,
noUpdate = false,
initialMode,
initialTrigger,
}: Props) => {
const [tradingMode, setTradingMode] =
useState<Schema.MarketTradingMode | null>(initialMode || null);
const [trigger, setTrigger] = useState<Schema.AuctionTrigger | null>(
initialTrigger || null
);
const [market, setMarket] = useState<MarketDealTicket | null>(null);
const variables = useMemo(
() => ({
marketId: marketId,
}),
[marketId]
);
const { data } = useDataProvider<SingleMarketFieldsFragment, never>({
dataProvider: marketProvider,
variables,
skip: !marketId,
});
const update = useCallback(
({ data: marketData }: { data: MarketData | null }) => {
if (!noUpdate && marketData) {
setTradingMode(marketData.marketTradingMode);
setTrigger(marketData.trigger);
setMarket({
...data,
data: marketData,
} as MarketDealTicket);
}
return true;
},
[noUpdate, data]
);
useDataProvider<MarketData, MarketDataUpdateFieldsFragment>({
dataProvider: marketDataProvider,
update,
variables,
skip: noUpdate || !marketId || !data,
});
const content =
(tradingMode === Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION &&
trigger &&
trigger !== Schema.AuctionTrigger.AUCTION_TRIGGER_UNSPECIFIED
? `${Schema.MarketTradingModeMapping[tradingMode]} - ${Schema.AuctionTriggerMapping[trigger]}`
: Schema.MarketTradingModeMapping[
tradingMode as Schema.MarketTradingMode
]) || '-';
return isHeader ? (
<HeaderStat
heading={t('Trading mode')}
description={
market && (
<TradingModeTooltip
tradingMode={tradingMode}
trigger={trigger}
compiledGrid={compileGridData(market, onSelect)}
/>
)
}
testId="market-trading-mode"
>
<div>{content}</div>
</HeaderStat>
) : (
<Tooltip
description={
tradingMode &&
trigger && (
<TradingModeTooltip tradingMode={tradingMode} trigger={trigger} />
)
}
>
<span>{content}</span>
</Tooltip>
);
};