fix: live validation in deal ticket (#2315)

* fix: live validation in deal ticket

* fix: live validation in deal ticket

* fix: live validation in deal ticket

* fix: live validation in deal ticket - fix test mock generate

apps/console-lite/src/app/components/deal-ticket/use-order-validation.spec.tsx

@@ -198,7 +198,11 @@ describe('useOrderValidation', () => {
   `(
     'Returns an error message for market state when not accepting orders',
     ({ state }) => {
-      const { result } = setup({ market: { ...defaultOrder.market, state } });
+      const market = {
+        ...defaultOrder.market,
+        data: { ...defaultOrder.market.data, marketState: state },
+      };
+      const { result } = setup({ market });
       expect(result.current).toStrictEqual({
         isDisabled: true,
         message: `This market is ${marketTranslations(
@@ -220,14 +224,19 @@ describe('useOrderValidation', () => {
         balance: '0',
         margin: '100',
         balanceError: false,
-        // asset,
       });
-      const { result } = setup({
+
-        market: {
+      const market = {
-          ...defaultOrder.market,
+        ...defaultOrder.market,
-          state,
+        data: {
-          tradingMode: Schema.MarketTradingMode.TRADING_MODE_BATCH_AUCTION,
+          ...defaultOrder.market.data,
+          marketState: state,
+          marketTradingMode:
+            Schema.MarketTradingMode.TRADING_MODE_BATCH_AUCTION,
         },
+      };
+      const { result } = setup({
+        market,
         order: {
           ...order,
           type: Schema.OrderType.TYPE_LIMIT,
@@ -252,8 +261,12 @@ describe('useOrderValidation', () => {
   `(
     `Returns an error message when trying to submit a non-limit order for a "$tradingMode" market`,
     ({ tradingMode, errorMessage }) => {
+      const market = {
+        ...defaultOrder.market,
+        data: { ...defaultOrder.market.data, marketTradingMode: tradingMode },
+      };
       const { result } = setup({
-        market: { ...defaultOrder.market, tradingMode },
+        market,
         order: {
           ...order,
           type: Schema.OrderType.TYPE_MARKET,
@@ -278,8 +291,12 @@ describe('useOrderValidation', () => {
   `(
     `Returns an error message when submitting a limit order with a "$orderTimeInForce" value to a "$tradingMode" market`,
     ({ tradingMode, orderTimeInForce, errorMessage }) => {
+      const market = {
+        ...defaultOrder.market,
+        data: { ...defaultOrder.market.data, marketTradingMode: tradingMode },
+      };
       const { result } = setup({
-        market: { ...defaultOrder.market, tradingMode },
+        market,
         order: {
           ...order,
           type: Schema.OrderType.TYPE_LIMIT,
@@ -382,14 +399,15 @@ describe('useOrderValidation', () => {
   `(
     'Returns error when market state is pending and size is wrong',
     ({ state }) => {
+      const market = {
+        ...defaultOrder.market,
+        data: { ...defaultOrder.market.data, marketState: state },
+      };
       const { result } = setup({
         fieldErrors: {
           size: { type: `validate`, message: DealTicket.ERROR_SIZE_DECIMAL },
         },
-        market: {
+        market,
-          ...market,
-          state,
-        },
       });
       expect(result.current).toStrictEqual({
         isDisabled: true,

apps/console-lite/src/app/components/deal-ticket/use-order-validation.tsx

@@ -169,13 +169,13 @@ export const useOrderValidation = ({
         Schema.MarketState.STATE_TRADING_TERMINATED,
         Schema.MarketState.STATE_CANCELLED,
         Schema.MarketState.STATE_CLOSED,
-      ].includes(market.state)
+      ].includes(market.data.marketState)
     ) {
       return {
         isDisabled: true,
         message: t(
           `This market is ${marketTranslations(
-            market.state
+            market.data.marketState
           )} and not accepting orders`
         ),
         section: DEAL_TICKET_SECTION.SUMMARY,
@@ -186,7 +186,7 @@ export const useOrderValidation = ({
       [
         Schema.MarketState.STATE_PROPOSED,
         Schema.MarketState.STATE_PENDING,
-      ].includes(market.state)
+      ].includes(market.data.marketState)
     ) {
       if (fieldErrorChecking) {
         return fieldErrorChecking;
@@ -195,7 +195,7 @@ export const useOrderValidation = ({
         isDisabled: false,
         message: t(
           `This market is ${marketTranslations(
-            market.state
+            market.data.marketState
           )} and only accepting liquidity commitment orders`
         ),
         section: DEAL_TICKET_SECTION.SUMMARY,
@@ -205,9 +205,9 @@ export const useOrderValidation = ({
     if (isMarketInAuction(market)) {
       if (order.type === Schema.OrderType.TYPE_MARKET) {
         if (
-          market.tradingMode ===
+          market.data.marketTradingMode ===
             Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION &&
-          market.data?.trigger ===
+          market.data.trigger ===
             Schema.AuctionTrigger.AUCTION_TRIGGER_LIQUIDITY
         ) {
           return {
@@ -230,9 +230,9 @@ export const useOrderValidation = ({
           };
         }
         if (
-          market.tradingMode ===
+          market.data.marketTradingMode ===
             Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION &&
-          market.data?.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_PRICE
+          market.data.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_PRICE
         ) {
           return {
             isDisabled: true,
@@ -270,9 +270,9 @@ export const useOrderValidation = ({
         ].includes(order.timeInForce)
       ) {
         if (
-          market.tradingMode ===
+          market.data.marketTradingMode ===
             Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION &&
-          market.data?.trigger ===
+          market.data.trigger ===
             Schema.AuctionTrigger.AUCTION_TRIGGER_LIQUIDITY
         ) {
           return {
@@ -297,9 +297,9 @@ export const useOrderValidation = ({
           };
         }
         if (
-          market.tradingMode ===
+          market.data.marketTradingMode ===
             Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION &&
-          market.data?.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_PRICE
+          market.data.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_PRICE
         ) {
           return {
             isDisabled: true,
@@ -355,7 +355,7 @@ export const useOrderValidation = ({
         Schema.MarketTradingMode.TRADING_MODE_BATCH_AUCTION,
         Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION,
         Schema.MarketTradingMode.TRADING_MODE_OPENING_AUCTION,
-      ].includes(market.tradingMode)
+      ].includes(market.data.marketTradingMode)
     ) {
       return {
         isDisabled: false,

apps/trading-e2e/src/support/trading.ts

@@ -59,6 +59,7 @@ const mockTradingPage = (
     generateMarketData({
       trigger: trigger,
       marketTradingMode: tradingMode,
+      marketState: state,
     })
   );
   aliasQuery(req, 'MarketsData', generateMarketsData());

libs/deal-ticket/src/components/deal-ticket/deal-ticket.tsx

@@ -75,7 +75,7 @@ export const DealTicket = ({
         return;
       }
 
-      const marketStateError = validateMarketState(market.state);
+      const marketStateError = validateMarketState(market.data.marketState);
       if (marketStateError !== true) {
         setError('summary', { message: marketStateError });
         return;
@@ -87,7 +87,7 @@ export const DealTicket = ({
       }
 
       const marketTradingModeError = validateMarketTradingMode(
-        market.tradingMode
+        market.data.marketTradingMode
       );
       if (marketTradingModeError !== true) {
         setError('summary', { message: marketTradingModeError });
@@ -110,8 +110,8 @@ export const DealTicket = ({
       hasNoBalance,
       market.positionDecimalPlaces,
       market.decimalPlaces,
-      market.state,
+      market.data.marketState,
-      market.tradingMode,
+      market.data.marketTradingMode,
       setError,
     ]
   );
@@ -242,7 +242,7 @@ const SummaryMessage = memo(
         Schema.MarketTradingMode.TRADING_MODE_BATCH_AUCTION,
         Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION,
         Schema.MarketTradingMode.TRADING_MODE_OPENING_AUCTION,
-      ].includes(market.tradingMode)
+      ].includes(market.data.marketTradingMode)
     ) {
       return (
         <div

libs/deal-ticket/src/components/trading-mode-tooltip/compile-grid-data.tsx

@@ -16,9 +16,9 @@ export const compileGridData = (
 ): { label: ReactNode; value?: ReactNode }[] => {
   const grid: MarketDataGridProps['grid'] = [];
   const isLiquidityMonitoringAuction =
-    market.tradingMode ===
+    market.data.marketTradingMode ===
       Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION &&
-    market.data?.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_LIQUIDITY;
+    market.data.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_LIQUIDITY;
 
   const formatStake = (value: string) => {
     const formattedValue = addDecimalsFormatNumber(
@@ -32,14 +32,14 @@ export const compileGridData = (
 
   if (!market.data) return grid;
 
-  if (market.data?.auctionStart) {
+  if (market.data.auctionStart) {
     grid.push({
       label: t('Auction start'),
       value: getDateTimeFormat().format(new Date(market.data.auctionStart)),
     });
   }
 
-  if (market.data?.auctionEnd) {
+  if (market.data.auctionEnd) {
     const endDate = getDateTimeFormat().format(
       new Date(market.data.auctionEnd)
     );
@@ -51,14 +51,14 @@ export const compileGridData = (
     });
   }
 
-  if (isLiquidityMonitoringAuction && market.data?.targetStake) {
+  if (isLiquidityMonitoringAuction && market.data.targetStake) {
     grid.push({
       label: t('Target liquidity'),
       value: formatStake(market.data.targetStake),
     });
   }
 
-  if (isLiquidityMonitoringAuction && market.data?.suppliedStake) {
+  if (isLiquidityMonitoringAuction && market.data.suppliedStake) {
     grid.push({
       label: (
         <Link
@@ -71,7 +71,7 @@ export const compileGridData = (
       value: formatStake(market.data.suppliedStake),
     });
   }
-  if (market.data?.indicativePrice) {
+  if (market.data.indicativePrice) {
     grid.push({
       label: t('Est. uncrossing price'),
       value:
@@ -85,7 +85,7 @@ export const compileGridData = (
     });
   }
 
-  if (market.data?.indicativeVolume) {
+  if (market.data.indicativeVolume) {
     grid.push({
       label: t('Est. uncrossing vol'),
       value:

libs/deal-ticket/src/utils/get-price.ts

@@ -11,9 +11,9 @@ export const getMarketPrice = (market: MarketDealTicket) => {
     // 0 can never be a valid uncrossing price
     // as it would require there being orders on the book at that price.
     if (
-      market.data?.indicativePrice &&
+      market.data.indicativePrice &&
       market.data.indicativePrice !== '0' &&
-      BigInt(market.data?.indicativePrice) !== BigInt(0)
+      BigInt(market.data.indicativePrice) !== BigInt(0)
     ) {
       return market.data.indicativePrice;
     }

libs/deal-ticket/src/utils/is-market-in-auction.ts

@@ -1,11 +1,13 @@
 import { Schema } from '@vegaprotocol/types';
 
 export const isMarketInAuction = (market: {
-  tradingMode: Schema.MarketTradingMode;
+  data: {
+    marketTradingMode: Schema.MarketTradingMode;
+  };
 }) => {
   return [
     Schema.MarketTradingMode.TRADING_MODE_BATCH_AUCTION,
     Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION,
     Schema.MarketTradingMode.TRADING_MODE_OPENING_AUCTION,
-  ].includes(market.tradingMode);
+  ].includes(market.data.marketTradingMode);
 };

libs/deal-ticket/src/utils/validate-time-in-force.ts

@@ -6,12 +6,12 @@ import type { MarketDealTicket } from '@vegaprotocol/market-list';
 export const validateTimeInForce = (market: MarketDealTicket) => {
   return (value: Schema.OrderTimeInForce) => {
     const isMonitoringAuction =
-      market.tradingMode ===
+      market.data.marketTradingMode ===
       Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION;
     const isPriceTrigger =
-      market.data?.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_PRICE;
+      market.data.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_PRICE;
     const isLiquidityTrigger =
-      market.data?.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_LIQUIDITY;
+      market.data.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_LIQUIDITY;
 
     if (isMarketInAuction(market)) {
       if (

libs/deal-ticket/src/utils/validate-type.ts

@@ -7,13 +7,12 @@ export const validateType = (market: MarketDealTicket) => {
   return (value: Schema.OrderType) => {
     if (isMarketInAuction(market) && value === Schema.OrderType.TYPE_MARKET) {
       const isMonitoringAuction =
-        market.tradingMode ===
+        market.data.marketTradingMode ===
         Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION;
       const isPriceTrigger =
-        market.data?.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_PRICE;
+        market.data.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_PRICE;
       const isLiquidityTrigger =
-        market.data?.trigger ===
+        market.data.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_LIQUIDITY;
-        Schema.AuctionTrigger.AUCTION_TRIGGER_LIQUIDITY;
 
       if (isMonitoringAuction && isPriceTrigger) {
         return MarketModeValidationType.PriceMonitoringAuction;

libs/react-helpers/src/lib/generic-data-provider.ts

@@ -4,6 +4,7 @@ import type {
   FetchPolicy,
   OperationVariables,
   TypedDocumentNode,
+  FetchResult,
 } from '@apollo/client';
 import type { Subscription } from 'zen-observable-ts';
 import isEqual from 'lodash/isEqual';
@@ -362,6 +363,25 @@ function makeDataProviderInternal<
     }
   };
 
+  const onNext = ({
+    data: subscriptionData,
+  }: FetchResult<SubscriptionData>) => {
+    if (!subscriptionData || !getDelta || !update) {
+      return;
+    }
+    const delta = getDelta(subscriptionData, variables);
+    if (loading || !data) {
+      updateQueue.push(delta);
+    } else {
+      const updatedData = update(data, delta, reload, variables);
+      if (updatedData === data) {
+        return;
+      }
+      data = updatedData;
+      notifyAll({ delta, isUpdate: true });
+    }
+  };
+
   const initialize = async () => {
     if (subscription) {
       if (resetTimer) {
@@ -375,6 +395,7 @@ function makeDataProviderInternal<
     if (!client) {
       return;
     }
+
     if (subscriptionQuery && getDelta && update) {
       subscription = client
         .subscribe<SubscriptionData>({
@@ -382,32 +403,14 @@ function makeDataProviderInternal<
           variables,
           fetchPolicy,
         })
-        .subscribe(
+        .subscribe(onNext, (e) => {
-          ({ data: subscriptionData }) => {
+          error = e as Error;
-            if (!subscriptionData) {
+          if (subscription) {
-              return;
+            subscription.unsubscribe();
-            }
+            subscription = undefined;
-            const delta = getDelta(subscriptionData, variables);
-            if (loading || !data) {
-              updateQueue.push(delta);
-            } else {
-              const updatedData = update(data, delta, reload, variables);
-              if (updatedData === data) {
-                return;
-              }
-              data = updatedData;
-              notifyAll({ delta, isUpdate: true });
-            }
-          },
-          (e) => {
-            error = e as Error;
-            if (subscription) {
-              subscription.unsubscribe();
-              subscription = undefined;
-            }
-            notifyAll();
           }
-        );
+          notifyAll();
+        });
     }
     await initialFetch();
   };