fix(#2216): lp-dashboard grab market close from metadata (#2564)

apps/liquidity-provision-dashboard/src/app/components/dashboard/market-list/market-list.tsx

@@ -10,7 +10,6 @@ import {
   formatNumberPercentage,
   t,
   toBigNum,
-  getDateTimeFormat,
 } from '@vegaprotocol/react-helpers';
 import type { VegaValueFormatterParams } from '@vegaprotocol/ui-toolkit';
 import type * as Schema from '@vegaprotocol/types';
@@ -31,6 +30,7 @@ import { HealthBar } from '../../health-bar';
 import { HealthDialog } from '../../health-dialog';
 import { Status } from '../../status';
 import { formatDistanceToNow } from 'date-fns';
+import { getExpiryDate } from '@vegaprotocol/react-helpers';
 
 export const MarketList = () => {
   const { data, error, loading } = useMarketsLiquidity();
@@ -299,17 +299,20 @@ export const MarketList = () => {
           />
           <AgGridColumn
             headerName={t('Closing Time')}
-            field="proposal.terms.closingDatetime"
+            field="tradableInstrument.instrument.metadata.tags"
             headerTooltip={t('Closing time of the market')}
             valueFormatter={({
-              value,
-            }: VegaValueFormatterParams<
-              Market,
-              'proposal.terms.closingDatetime'
-            >) => {
-              return value
-                ? getDateTimeFormat().format(new Date(value).getTime())
-                : '-';
+              data,
+            }: VegaValueFormatterParams<Market, ''>) => {
+              let expiry;
+              if (data?.tradableInstrument.instrument.metadata.tags) {
+                expiry = getExpiryDate(
+                  data?.tradableInstrument.instrument.metadata.tags,
+                  data?.marketTimestamps.close,
+                  data?.state
+                );
+              }
+              return expiry ? expiry : '-';
             }}
           />
         </Grid>

apps/trading/client-pages/market/trade-market-header.tsx

@@ -2,8 +2,11 @@ import { useAssetDetailsDialogStore } from '@vegaprotocol/assets';
 import { useEnvironment } from '@vegaprotocol/environment';
 import { ButtonLink, Link } from '@vegaprotocol/ui-toolkit';
 import { MarketProposalNotification } from '@vegaprotocol/governance';
-import { getExpiryDate, getMarketExpiryDate } from '@vegaprotocol/market-info';
-import { t } from '@vegaprotocol/react-helpers';
+import {
+  getExpiryDate,
+  getMarketExpiryDate,
+  t,
+} from '@vegaprotocol/react-helpers';
 import type { SingleMarketFieldsFragment } from '@vegaprotocol/market-list';
 import {
   ColumnKind,
@@ -125,7 +128,14 @@ type ExpiryLabelProps = {
 };
 
 const ExpiryLabel = ({ market }: ExpiryLabelProps) => {
-  const content = market ? getExpiryDate(market) : '-';
+  const content =
+    market && market.tradableInstrument.instrument.metadata.tags
+      ? getExpiryDate(
+          market.tradableInstrument.instrument.metadata.tags,
+          market.marketTimestamps.close,
+          market.state
+        )
+      : '-';
   return <div data-testid="trading-expiry">{content}</div>;
 };
 

libs/liquidity/src/lib/markets-liquidity-provider.ts

@@ -31,8 +31,6 @@ import {
   getTargetStake,
 } from './utils/liquidity-utils';
 import type { Provider, LiquidityProvisionMarket } from './utils';
-import { proposalsListDataProvider } from '@vegaprotocol/governance';
-import type { Proposal } from '@vegaprotocol/types';
 
 export interface FeeLevels {
   commitmentAmount: number;
@@ -46,7 +44,13 @@ export type Market = MarketWithData &
     dayVolume: string;
     liquidityCommitted: number;
     volumeChange: string;
-    proposal?: Proposal;
+    tradableInstrument?: {
+      instrument?: {
+        metadata?: {
+          tags?: string[] | null;
+        };
+      };
+    };
   };
 
 export interface Markets {
@@ -66,8 +70,7 @@ const getData = (
 export const addData = (
   markets: (MarketWithData & MarketWithCandles)[],
   marketsCandles24hAgo: MarketCandles[],
-  marketsLiquidity: LiquidityProvisionMarket[],
-  proposals: Proposal[]
+  marketsLiquidity: LiquidityProvisionMarket[]
 ) => {
   return markets.map((market) => {
     const dayVolume = calcDayVolume(market.candles);
@@ -80,9 +83,6 @@ export const addData = (
       marketsLiquidity
     ) as Provider[];
 
-    const proposalForMarket =
-      proposals && proposals.find((p) => p.id === market.id);
-
     return {
       ...market,
       dayVolume,
@@ -90,7 +90,6 @@ export const addData = (
       liquidityCommitted: sumLiquidityCommitted(liquidityProviders),
       feeLevels: getFeeLevels(liquidityProviders) || [],
       target: getTargetStake(market.id, marketsLiquidity),
-      proposal: proposalForMarket,
     };
   });
 };
@@ -114,14 +113,12 @@ const liquidityProvisionProvider = makeDerivedDataProvider<Markets, never>(
         interval: Schema.Interval.INTERVAL_I1D,
       }),
     liquidityMarketsProvider,
-    proposalsListDataProvider,
   ],
   (parts) => {
     const data = addData(
       parts[0] as (MarketWithData & MarketWithCandles)[],
       parts[1] as MarketCandles[],
-      parts[2] as LiquidityProvisionMarket[],
-      parts[3] as Proposal[]
+      parts[2] as LiquidityProvisionMarket[]
     );
     return { markets: data };
   }

libs/market-info/src/components/index.ts

@@ -1,3 +1,2 @@
-export * from './market-expires';
 export * from './market-info';
 export * from './fees-breakdown';

libs/market-info/src/components/market-expires/index.ts

@@ -1 +0,0 @@
-export * from './market-expires';

libs/market-info/src/components/market-info/info-market.tsx

@@ -23,10 +23,12 @@ import pick from 'lodash/pick';
 import { useMemo } from 'react';
 import { generatePath, Link } from 'react-router-dom';
 
-import { getMarketExpiryDateFormatted } from '../market-expires';
 import { MarketInfoTable } from './info-key-value-table';
 import { marketInfoDataProvider } from './market-info-data-provider';
-import { TokenLinks } from '@vegaprotocol/react-helpers';
+import {
+  TokenLinks,
+  getMarketExpiryDateFormatted,
+} from '@vegaprotocol/react-helpers';
 
 import type { MarketInfoQuery } from './__generated__/MarketInfo';
 import { MarketProposalNotification } from '@vegaprotocol/governance';

libs/react-helpers/src/index.ts

@@ -17,3 +17,4 @@ export * from './lib/remove-pagination-wrapper';
 export * from './lib/__generated__/ChainId';
 export * from './lib/data-grid';
 export * from './lib/local-logger';
+export * from './lib/market-expires';

libs/react-helpers/src/lib/index.ts

@@ -13,3 +13,4 @@ export * from './links';
 export * from './remove-pagination-wrapper';
 export * from './data-grid';
 export * from './local-logger';
+export * from './market-expires';

libs/react-helpers/src/lib/market-expires.spec.tsx

@@ -3,8 +3,7 @@ import React from 'react';
 
 import { MarketExpires } from './market-expires';
 
-jest.mock('@vegaprotocol/react-helpers', () => ({
-  t: jest.fn().mockImplementation((text) => text),
+jest.mock('./format', () => ({
   getDateTimeFormat: () =>
     Intl.DateTimeFormat('en-GB', {
       year: 'numeric',
@@ -16,6 +15,10 @@ jest.mock('@vegaprotocol/react-helpers', () => ({
     }),
 }));
 
+jest.mock('./i18n', () => ({
+  t: jest.fn().mockImplementation((text) => text),
+}));
+
 describe('MarketExpires', () => {
   describe('should properly parse different tags', () => {
     it('settlement:date', () => {

libs/react-helpers/src/lib/market-expires.tsx

@@ -1,7 +1,7 @@
-import { getDateTimeFormat, t } from '@vegaprotocol/react-helpers';
+import { t } from './i18n';
+import { getDateTimeFormat } from './format';
 import { isValid, parseISO } from 'date-fns';
 
-import type { SingleMarketFieldsFragment } from '@vegaprotocol/market-list';
 import { MarketState } from '@vegaprotocol/types';
 
 export const getMarketExpiryDate = (
@@ -36,12 +36,13 @@ export const getMarketExpiryDateFormatted = (
   return null;
 };
 
-export const getExpiryDate = (market: SingleMarketFieldsFragment): string => {
-  const metadataExpiryDate = getMarketExpiryDate(
-    market.tradableInstrument.instrument.metadata.tags
-  );
-  const marketTimestampCloseDate =
-    market.marketTimestamps.close && new Date(market.marketTimestamps.close);
+export const getExpiryDate = (
+  tags: ReadonlyArray<string> | null,
+  close: string | null,
+  state: MarketState
+): string => {
+  const metadataExpiryDate = getMarketExpiryDate(tags);
+  const marketTimestampCloseDate = close && new Date(close);
   let content = null;
   if (!metadataExpiryDate) {
     content = marketTimestampCloseDate
@@ -50,8 +51,8 @@ export const getExpiryDate = (market: SingleMarketFieldsFragment): string => {
   } else {
     const isExpired =
       Date.now() - metadataExpiryDate.valueOf() > 0 &&
-      (market.state === MarketState.STATE_TRADING_TERMINATED ||
-        market.state === MarketState.STATE_SETTLED);
+      (state === MarketState.STATE_TRADING_TERMINATED ||
+        state === MarketState.STATE_SETTLED);
     if (isExpired) {
       content = marketTimestampCloseDate
         ? `Expired on ${getDateTimeFormat().format(marketTimestampCloseDate)}`