feat(trading): show funding in market info

2023-09-06 11:22:04 +02:00
parent eb4ffd05ef
commit a5fb9d2c58
6 changed files with 88 additions and 57 deletions
@@ -19,16 +19,16 @@ import {
  SettlementAssetInfoPanel,
 } from '@vegaprotocol/markets';
 import { MarketInfoTable } from '@vegaprotocol/markets';
-import type { DataSourceDefinition } from '@vegaprotocol/types';
+import type { DataSourceFragment } from '@vegaprotocol/markets';
 import isEqual from 'lodash/isEqual';

 export const MarketDetails = ({ market }: { market: MarketInfoWithData }) => {
  if (!market) return null;
  const { product } = market.tradableInstrument.instrument;
-  const settlementData = getDataSourceSpecForSettlementData(product)?.data;
-  const terminationData = getDataSourceSpecForTradingTermination(product)?.data;
+  const settlementDataSource = getDataSourceSpecForSettlementData(product);
+  const terminationDataSource = getDataSourceSpecForTradingTermination(product);

-  const getSigners = (data: DataSourceDefinition) => {
+  const getSigners = ({ data }: DataSourceFragment) => {
    if (data.sourceType.__typename === 'DataSourceDefinitionExternal') {
      const signers =
        ('signers' in data.sourceType.sourceType &&
@@ -46,9 +46,12 @@ export const MarketDetails = ({ market }: { market: MarketInfoWithData }) => {
  };

  const showTwoOracles =
-    settlementData &&
-    terminationData &&
-    isEqual(getSigners(settlementData), getSigners(terminationData));
+    settlementDataSource &&
+    terminationDataSource &&
+    isEqual(
+      getSigners(settlementDataSource),
+      getSigners(terminationDataSource)
+    );

  const headerClassName = 'font-alpha calt text-xl mt-4 border-b-2 pb-2';

@@ -15,6 +15,7 @@ import {
  getDataSourceSpecForSettlementSchedule,
  getDataSourceSpecForSettlementData,
  getDataSourceSpecForTradingTermination,
+  getSigners,
 } from '@vegaprotocol/markets';
 import {
  Button,
@@ -26,7 +27,6 @@ import {
 import { SubHeading } from '../../../../components/heading';
 import { CollapsibleToggle } from '../../../../components/collapsible-toggle';
 import type { MarketInfo } from '@vegaprotocol/markets';
-import type { DataSourceDefinition } from '@vegaprotocol/types';
 import { create } from 'zustand';

 type MarketDataDialogState = {
@@ -98,23 +98,6 @@ export const ProposalMarketData = ({
      parentMarketData?.priceMonitoringSettings?.parameters?.triggers
    );

-  const getSigners = (data: DataSourceDefinition) => {
-    if (data.sourceType.__typename === 'DataSourceDefinitionExternal') {
-      const signers =
-        ('signers' in data.sourceType.sourceType &&
-          data.sourceType.sourceType.signers) ||
-        [];
-
-      return signers.map(({ signer }) => {
-        return (
-          (signer.__typename === 'ETHAddress' && signer.address) ||
-          (signer.__typename === 'PubKey' && signer.key)
-        );
-      });
-    }
-    return [];
-  };
-
  return (
    <section className="relative" data-testid="proposal-market-data">
      <CollapsibleToggle
@@ -23,6 +23,7 @@ import type { MarketInfo } from './market-info-data-provider';
 import { MarketProposalNotification } from '@vegaprotocol/proposals';
 import {
  CurrentFeesInfoPanel,
+  FundingInfoPanel,
  InstrumentInfoPanel,
  InsurancePoolInfoPanel,
  KeyDetailsInfoPanel,
@@ -46,8 +47,8 @@ import {
  getDataSourceSpecForTradingTermination,
  isPerpetual,
  isFuture,
+  getSigners,
 } from '../../product';
-import type { DataSourceFragment } from './__generated__/MarketInfo';

 export interface MarketInfoAccordionProps {
  market: MarketInfo;
@@ -95,37 +96,26 @@ export const MarketInfoAccordion = ({
  );

  const { product } = market.tradableInstrument.instrument;
-  const settlementData = getDataSourceSpecForSettlementData(product)?.data;
-  const terminationData = getDataSourceSpecForTradingTermination(product)?.data;
-  const settlementScheduleData =
-    getDataSourceSpecForSettlementSchedule(product)?.data;
-
-  const getSigners = (data: DataSourceFragment['data']) => {
-    if (data.sourceType.__typename === 'DataSourceDefinitionExternal') {
-      const signers =
-        ('signers' in data.sourceType.sourceType &&
-          data.sourceType.sourceType.signers) ||
-        [];
-
-      return signers.map(({ signer }, i) => {
-        return (
-          (signer.__typename === 'ETHAddress' && signer.address) ||
-          (signer.__typename === 'PubKey' && signer.key)
-        );
-      });
-    }
-    return [];
-  };
+  const settlementDataSource = getDataSourceSpecForSettlementData(product);
+  const terminationDataSource = getDataSourceSpecForTradingTermination(product);
+  const settlementScheduleDataSource =
+    getDataSourceSpecForSettlementSchedule(product);

  const showOneOracleSection =
    (isFuture(product) &&
-      settlementData &&
-      terminationData &&
-      isEqual(getSigners(settlementData), getSigners(terminationData))) ||
+      settlementDataSource &&
+      terminationDataSource &&
+      isEqual(
+        getSigners(settlementDataSource),
+        getSigners(terminationDataSource)
+      )) ||
    (isPerpetual(product) &&
-      settlementData &&
-      settlementScheduleData &&
-      isEqual(getSigners(settlementData), getSigners(settlementScheduleData)));
+      settlementDataSource &&
+      settlementScheduleDataSource &&
+      isEqual(
+        getSigners(settlementDataSource),
+        getSigners(settlementScheduleDataSource)
+      ));

  return (
    <div>
@@ -178,6 +168,15 @@ export const MarketInfoAccordion = ({
            title={t('Instrument')}
            content={<InstrumentInfoPanel market={market} />}
          />
+          {settlementScheduleDataSource && (
+            <AccordionItem
+              itemId="funding"
+              title={t('Funding')}
+              content={
+                <FundingInfoPanel dataSource={settlementScheduleDataSource} />
+              }
+            />
+          )}
          {showOneOracleSection ? (
            <AccordionItem
              itemId="oracles"
@@ -195,8 +194,7 @@ export const MarketInfoAccordion = ({
                  <OracleInfoPanel market={market} type="settlementData" />
                }
              />
-              {market.tradableInstrument.instrument.product.__typename ===
-                'Perpetual' && (
+              {isPerpetual(product) && (
                <AccordionItem
                  itemId="settlement-schedule-oracle"
                  title={t('Settlement schedule oracle')}
@@ -208,8 +206,7 @@ export const MarketInfoAccordion = ({
                  }
                />
              )}
-              {market.tradableInstrument.instrument.product.__typename ===
-                'Future' && (
+              {isFuture(product) && (
                <AccordionItem
                  itemId="termination-oracle"
                  title={t('Termination oracle')}
@@ -15,8 +15,11 @@ import {
  VegaIconNames,
 } from '@vegaprotocol/ui-toolkit';
 import {
+  formatDateWithLocalTimezone,
  formatNumber,
  formatNumberPercentage,
+  fromNanoSeconds,
+  getDateTimeFormat,
  getMarketExpiryDateFormatted,
 } from '@vegaprotocol/utils';
 import type { Get } from 'type-fest';
@@ -57,6 +60,8 @@ import { useSuccessorMarketProposalDetailsQuery } from '@vegaprotocol/proposals'
 import { getQuoteName, getAsset } from '../../market-utils';
 import classNames from 'classnames';
 import compact from 'lodash/compact';
+import type { DataSourceFragment } from './__generated__/MarketInfo';
+import { formatDuration } from 'date-fns';

 type MarketInfoProps = {
  market: MarketInfo;
@@ -673,6 +678,30 @@ export const LiquidityInfoPanel = ({ market, children }: MarketInfoProps) => {
  );
 };

+export const FundingInfoPanel = ({
+  dataSource,
+}: {
+  dataSource: DataSourceFragment;
+}) => {
+  const sourceType = dataSource.data.sourceType.sourceType;
+  if (
+    sourceType.__typename !== 'DataSourceSpecConfigurationTimeTrigger' ||
+    !sourceType.triggers?.[0]?.every
+  ) {
+    return null;
+  }
+  const { every, initial } = sourceType.triggers[0];
+  const hours = Math.floor(every / (60 * 60));
+  const minutes = Math.floor(every / 60) % 60;
+  const initialLabel = initial
+    ? ` ${t('from')} ${getDateTimeFormat().format(new Date(initial * 1000))}`
+    : '';
+  return `${t('every')} ${formatDuration({
+    hours,
+    minutes,
+  })} ${initialLabel}`;
+};
+
 export const OracleInfoPanel = ({
  market,
  type,
@@ -1,4 +1,5 @@
 import type {
+  DataSourceFragment,
  FutureFragment,
  MarketInfo,
  PerpetualFragment,
@@ -29,3 +30,20 @@ export const getDataSourceSpecBinding = (product: Product) =>
  isFuture(product) || isPerpetual(product)
    ? product.dataSourceSpecBinding
    : undefined;
+
+export const getSigners = ({ data }: DataSourceFragment) => {
+  if (data.sourceType.__typename === 'DataSourceDefinitionExternal') {
+    const signers =
+      ('signers' in data.sourceType.sourceType &&
+        data.sourceType.sourceType.signers) ||
+      [];
+
+    return signers.map(({ signer }, i) => {
+      return (
+        (signer.__typename === 'ETHAddress' && signer.address) ||
+        (signer.__typename === 'PubKey' && signer.key)
+      );
+    });
+  }
+  return [];
+};
@@ -41,6 +41,7 @@ export const AccountTypeMapping: {
  ACCOUNT_TYPE_INSURANCE: 'Insurance',
  ACCOUNT_TYPE_MARGIN: 'Margin',
  ACCOUNT_TYPE_PENDING_TRANSFERS: 'Pending transfers',
+  ACCOUNT_TYPE_PENDING_FEE_REFERRAL_REWARD: 'Pending fee referral reward',
  ACCOUNT_TYPE_REWARD_LP_RECEIVED_FEES: 'Reward LP received fees',
  ACCOUNT_TYPE_REWARD_MAKER_RECEIVED_FEES: 'Reward Maker received fees',
  ACCOUNT_TYPE_REWARD_MARKET_PROPOSERS: 'Reward Market Proposers',