diff --git a/apps/console-lite/src/app/components/deal-ticket/review-trade.tsx b/apps/console-lite/src/app/components/deal-ticket/review-trade.tsx
index f983523eb..109bb807e 100644
--- a/apps/console-lite/src/app/components/deal-ticket/review-trade.tsx
+++ b/apps/console-lite/src/app/components/deal-ticket/review-trade.tsx
@@ -9,7 +9,6 @@ import classNames from 'classnames';
import type { DealTicketMarketFragment } from '@vegaprotocol/deal-ticket';
import type { OrderSubmissionBody } from '@vegaprotocol/wallet';
import { SIDE_NAMES } from './side-selector';
-import SimpleMarketExpires from '../simple-market-list/simple-market-expires';
import { gql, useQuery } from '@apollo/client';
import type {
MarketTags,
@@ -17,6 +16,7 @@ import type {
} from './__generated__/MarketTags';
import { DealTicketEstimates } from './deal-ticket-estimates';
import { Side } from '@vegaprotocol/types';
+import { MarketExpires } from '@vegaprotocol/market-info';
export const MARKET_TAGS_QUERY = gql`
query MarketTags($marketId: ID!) {
@@ -86,7 +86,7 @@ export default ({
{tagsData?.market?.tradableInstrument.instrument.metadata
.tags && (
-
| null;
-}) => {
- if (tags) {
- const dateFound = tags.reduce((agg, tag) => {
- const parsed = parseISO(
- (tag.match(/^settlement.*:/) &&
- tag
- .split(':')
- .filter((item, i) => i)
- .join(':')) as string
- );
- if (isValid(parsed)) {
- agg = parsed;
- }
- return agg;
- }, null);
- return dateFound ? (
- {`${format(
- dateFound as Date,
- EXPIRE_DATE_FORMAT
- )}`}
- ) : null;
- }
- return null;
-};
-
-export default SimpleMarketExpires;
diff --git a/apps/console-lite/src/app/components/simple-market-list/simple-market-renderer.tsx b/apps/console-lite/src/app/components/simple-market-list/simple-market-renderer.tsx
index db4925805..21ffd4b5b 100644
--- a/apps/console-lite/src/app/components/simple-market-list/simple-market-renderer.tsx
+++ b/apps/console-lite/src/app/components/simple-market-list/simple-market-renderer.tsx
@@ -1,6 +1,6 @@
import classNames from 'classnames';
-import SimpleMarketExpires from './simple-market-expires';
import type { Market } from '@vegaprotocol/market-list';
+import { MarketExpires } from '@vegaprotocol/market-info';
interface Props {
market: Market;
@@ -19,7 +19,7 @@ const MarketNameRenderer = ({ market, isMobile }: Props) => {
{isMobile
? market.tradableInstrument.instrument.code
: market.tradableInstrument.instrument.name}{' '}
-
diff --git a/apps/console-lite/src/app/constants/index.ts b/apps/console-lite/src/app/constants/index.ts
index 72264a456..8c8a1cd1b 100644
--- a/apps/console-lite/src/app/constants/index.ts
+++ b/apps/console-lite/src/app/constants/index.ts
@@ -3,7 +3,6 @@ import { t } from '@vegaprotocol/react-helpers';
import type { Market } from '@vegaprotocol/market-list';
export const DATE_FORMAT = 'dd MMMM yyyy HH:mm';
-export const EXPIRE_DATE_FORMAT = 'MMM dd';
export const TRADABLE_STATES = {
[MarketState.STATE_ACTIVE]: true,
diff --git a/apps/trading/pages/markets/trade-grid.tsx b/apps/trading/pages/markets/trade-grid.tsx
index 15ce435e5..049502102 100644
--- a/apps/trading/pages/markets/trade-grid.tsx
+++ b/apps/trading/pages/markets/trade-grid.tsx
@@ -1,5 +1,5 @@
import { DealTicketContainer } from '@vegaprotocol/deal-ticket';
-import { MarketInfoContainer } from '@vegaprotocol/market-info';
+import { MarketInfoContainer, getExpiryDate } from '@vegaprotocol/market-info';
import { OrderbookContainer } from '@vegaprotocol/market-depth';
import { OrderListContainer } from '@vegaprotocol/orders';
import { FillsContainer } from '@vegaprotocol/fills';
@@ -20,7 +20,7 @@ import {
ButtonLink,
Link,
} from '@vegaprotocol/ui-toolkit';
-import { getDateFormat, t } from '@vegaprotocol/react-helpers';
+import { t } from '@vegaprotocol/react-helpers';
import { useAssetDetailsDialogStore } from '@vegaprotocol/assets';
import { useEnvironment } from '@vegaprotocol/environment';
import { Header, HeaderStat } from '../../components/header';
@@ -56,15 +56,7 @@ type ExpiryLabelProps = {
};
const ExpiryLabel = ({ market }: ExpiryLabelProps) => {
- let content = null;
- if (market.marketTimestamps.close === null) {
- content = t('Not time-based');
- } else {
- const closeDate = new Date(market.marketTimestamps.close as string);
- const isExpired = Date.now() - closeDate.valueOf() > 0;
- const expiryDate = getDateFormat().format(closeDate);
- content = `${isExpired ? `${t('Expired')} ` : ''} ${expiryDate}`;
- }
+ const content = getExpiryDate(market);
return {content}
;
};
diff --git a/libs/market-info/src/components/index.ts b/libs/market-info/src/components/index.ts
index 7c7c1e233..4a298165f 100644
--- a/libs/market-info/src/components/index.ts
+++ b/libs/market-info/src/components/index.ts
@@ -1 +1,2 @@
+export * from './market-expires';
export * from './market-info';
diff --git a/libs/market-info/src/components/market-expires/index.ts b/libs/market-info/src/components/market-expires/index.ts
new file mode 100644
index 000000000..eead6883d
--- /dev/null
+++ b/libs/market-info/src/components/market-expires/index.ts
@@ -0,0 +1 @@
+export * from './market-expires';
diff --git a/apps/console-lite/src/app/components/simple-market-list/simple-market-expires.spec.tsx b/libs/market-info/src/components/market-expires/market-expires.spec.tsx
similarity index 78%
rename from apps/console-lite/src/app/components/simple-market-list/simple-market-expires.spec.tsx
rename to libs/market-info/src/components/market-expires/market-expires.spec.tsx
index ed08fcbda..48071033f 100644
--- a/apps/console-lite/src/app/components/simple-market-list/simple-market-expires.spec.tsx
+++ b/libs/market-info/src/components/market-expires/market-expires.spec.tsx
@@ -1,8 +1,8 @@
import React from 'react';
import { render, screen } from '@testing-library/react';
-import SimpleMarketExpires from './simple-market-expires';
+import { MarketExpires } from './market-expires';
-describe('SimpleMarketExpires', () => {
+describe('MarketExpires', () => {
describe('should properly parse different tags', () => {
it('settlement:date', () => {
const tags = [
@@ -12,7 +12,7 @@ describe('SimpleMarketExpires', () => {
'settlement:notadate',
'settlement:20220525T1200',
];
- render();
+ render();
expect(screen.getByText('May 25')).toBeInTheDocument();
});
@@ -22,7 +22,7 @@ describe('SimpleMarketExpires', () => {
'settlement:20220525T1200',
'settlement-date:2022-04-25T1200',
];
- render();
+ render();
expect(screen.getByText('Apr 25')).toBeInTheDocument();
});
@@ -32,7 +32,7 @@ describe('SimpleMarketExpires', () => {
'settlement-date:20220525T1200',
'settlement-expiry-date:2022-03-25T12:00:00',
];
- render();
+ render();
expect(screen.getByText('Mar 25')).toBeInTheDocument();
});
@@ -42,7 +42,7 @@ describe('SimpleMarketExpires', () => {
'settlemenz:20220525T1200',
'settlemenx-date:20220425T1200',
];
- const { container } = render();
+ const { container } = render();
expect(container.firstChild).toBeNull();
});
});
diff --git a/libs/market-info/src/components/market-expires/market-expires.tsx b/libs/market-info/src/components/market-expires/market-expires.tsx
new file mode 100644
index 000000000..1989b0217
--- /dev/null
+++ b/libs/market-info/src/components/market-expires/market-expires.tsx
@@ -0,0 +1,73 @@
+import type { SingleMarketFieldsFragment } from '@vegaprotocol/market-list';
+import { getDateFormat, t } from '@vegaprotocol/react-helpers';
+import { format, isValid, parseISO } from 'date-fns';
+
+export const EXPIRE_DATE_FORMAT = 'MMM dd';
+
+export const getMarketExpiryDate = (
+ tags?: ReadonlyArray | null
+): Date | null => {
+ if (tags) {
+ const dateFound = tags.reduce((agg, tag) => {
+ const parsed = parseISO(
+ (tag.match(/^settlement.*:/) &&
+ tag
+ .split(':')
+ .filter((item, i) => i)
+ .join(':')) as string
+ );
+ if (isValid(parsed)) {
+ agg = parsed;
+ }
+ return agg;
+ }, null);
+ return dateFound;
+ }
+ return null;
+};
+
+export const getMarketExpiryDateFormatted = (
+ tags?: ReadonlyArray | null
+): string | null => {
+ if (tags) {
+ const dateFound = getMarketExpiryDate(tags);
+ return dateFound ? format(dateFound, EXPIRE_DATE_FORMAT) : null;
+ }
+ return null;
+};
+
+export const getExpiryDate = (market: SingleMarketFieldsFragment): string => {
+ const closeDate = getMarketExpiryDate(
+ market.tradableInstrument.instrument.metadata.tags
+ );
+ const closedMarketDate =
+ market.marketTimestamps.close && new Date(market.marketTimestamps.close);
+ let content = null;
+ if (!closeDate) {
+ content = closedMarketDate
+ ? `Expired on ${getDateFormat().format(closedMarketDate)}`
+ : t('Not time-based');
+ } else {
+ const isExpired = Date.now() - closeDate.valueOf() > 0;
+ const expiryDate = getDateFormat().format(closeDate);
+ if (isExpired) {
+ content = closedMarketDate
+ ? `Expired on ${getDateFormat().format(closedMarketDate)}`
+ : t('Expired');
+ } else {
+ content = expiryDate;
+ }
+ }
+ return content;
+};
+
+export const MarketExpires = ({
+ tags,
+}: {
+ tags?: ReadonlyArray | null;
+}) => {
+ const date = getMarketExpiryDateFormatted(tags);
+ return date ? (
+ {`${date}`}
+ ) : null;
+};
diff --git a/libs/market-info/src/components/market-info/info-market.tsx b/libs/market-info/src/components/market-info/info-market.tsx
index ce399f323..daf1212dd 100644
--- a/libs/market-info/src/components/market-info/info-market.tsx
+++ b/libs/market-info/src/components/market-info/info-market.tsx
@@ -24,6 +24,7 @@ import { useEnvironment } from '@vegaprotocol/environment';
import { Link as UiToolkitLink } from '@vegaprotocol/ui-toolkit';
import Link from 'next/link';
import { AssetDetailsTable, useAssetDataProvider } from '@vegaprotocol/assets';
+import { getMarketExpiryDateFormatted } from '../market-expires';
const Links = {
PROPOSAL_PAGE: ':tokenUrl/governance/:proposalId',
@@ -224,6 +225,9 @@ export const Info = ({ market, onSelect }: InfoProps) => {
content: (
{
const [key, value] = tag.split(':');