import type { DataGridProps } from '@vegaprotocol/react-helpers';
import {
  t,
  getDateTimeFormat,
  addDecimalsFormatNumber,
} from '@vegaprotocol/react-helpers';
import * as Schema from '@vegaprotocol/types';
import { Link as UILink } from '@vegaprotocol/ui-toolkit';
import type { ReactNode } from 'react';
import { Link } from 'react-router-dom';
import type { Market, MarketData } from '@vegaprotocol/market-list';

export const compileGridData = (
  market: Pick<
    Market,
    'tradableInstrument' | 'id' | 'decimalPlaces' | 'positionDecimalPlaces'
  >,
  marketData: Pick<
    MarketData,
    | 'marketTradingMode'
    | 'auctionStart'
    | 'auctionEnd'
    | 'indicativePrice'
    | 'indicativeVolume'
    | 'suppliedStake'
    | 'targetStake'
    | 'trigger'
  >,
  onSelect?: (id: string) => void
): { label: ReactNode; value?: ReactNode }[] => {
  const grid: DataGridProps['grid'] = [];
  const isLiquidityMonitoringAuction =
    marketData.marketTradingMode ===
      Schema.MarketTradingMode.TRADING_MODE_MONITORING_AUCTION &&
    marketData.trigger === Schema.AuctionTrigger.AUCTION_TRIGGER_LIQUIDITY;

  const formatStake = (value: string) => {
    const formattedValue = addDecimalsFormatNumber(
      value,
      market.tradableInstrument.instrument.product.settlementAsset.decimals
    );
    const asset =
      market.tradableInstrument.instrument.product.settlementAsset.symbol;
    return `${formattedValue} ${asset}`;
  };

  if (!marketData) return grid;

  if (marketData.auctionStart) {
    grid.push({
      label: t('Auction start'),
      value: getDateTimeFormat().format(new Date(marketData.auctionStart)),
    });
  }

  if (marketData.auctionEnd) {
    const endDate = getDateTimeFormat().format(new Date(marketData.auctionEnd));
    grid.push({
      label: isLiquidityMonitoringAuction
        ? t('Est. auction end')
        : t('Auction end'),
      value: isLiquidityMonitoringAuction ? `~${endDate}` : endDate,
    });
  }

  if (isLiquidityMonitoringAuction && marketData.targetStake) {
    grid.push({
      label: t('Target liquidity'),
      value: formatStake(marketData.targetStake),
    });
  }

  if (isLiquidityMonitoringAuction && marketData.suppliedStake) {
    grid.push({
      label: (
        <Link
          to={`/liquidity/${market.id}`}
          onClick={() => onSelect && onSelect(market.id)}
        >
          <UILink>{t('Current liquidity')}</UILink>
        </Link>
      ),
      value: formatStake(marketData.suppliedStake),
    });
  }
  if (marketData.indicativePrice) {
    grid.push({
      label: t('Est. uncrossing price'),
      value:
        marketData.indicativePrice && marketData.indicativePrice !== '0'
          ? `~
            ${addDecimalsFormatNumber(
              marketData.indicativePrice,
              market.decimalPlaces
            )}`
          : '-',
    });
  }

  if (marketData.indicativeVolume) {
    grid.push({
      label: t('Est. uncrossing vol'),
      value:
        marketData.indicativeVolume && marketData.indicativeVolume !== '0'
          ? '~' +
            addDecimalsFormatNumber(
              marketData.indicativeVolume,
              market.positionDecimalPlaces
            )
          : '-',
    });
  }

  return grid;
};