"use client"

import { ColumnDef } from "@tanstack/react-table"
import { parseNumber, formatNumber, stripHtmlTags } from "@/lib/common";

// This type is used to define the shape of our data.
// You can use a Zod schema here if you want.
export type Summary = {
  ref_id: string;
  stock_details: string;
  value: string;
  status: string;
  f_type: string;
  ticker: string;
  Name: string;
  Industry: string;
  Sector: string;
  t_date: string;
  MarketPriceCurrency: string;
  PurchaseQuantity: string;
  price: string;
  MarketValueFormated: string;
  GainLossFormated: string;
};

export const columns: ColumnDef<Summary>[] = [
  {
    accessorKey: "ref_id",
    header: "Ref ID",
  },
  {
    accessorKey: "ticker",
    header: "Ticker",
  },
  {
    accessorKey: "Name",
    header: "Name",
  },
  {
    accessorKey: "bank_name",
    header: "Bank",
  },
  {
    accessorKey: "asetClass",
    header: "Asset Class",
    cell: ({ getValue }) => {
      const value = getValue() as string;

      // Try to split main and sub parts
      const mainPartMatch = value.match(/^([^<]+)/);
      const smallPartMatch = value.match(/<small[^>]*>(.*?)<\/small>/);

      const mainPart = mainPartMatch?.[1]?.trim() || value;
      const smallPart = smallPartMatch?.[1]?.trim() || null;

      return (
        <div>
          <div>{mainPart}</div>
          {smallPart && (
            <div className="text-xs text-muted-foreground">{smallPart}</div>
          )}
        </div>
      );
    },
  },
  {
    accessorKey: "asset_type_title",
    header: "Asset Type",
    cell: ({ getValue }) => {
      const value = String(getValue() ?? "").trim();
      if (!value) return "—";
      return (
        <span
          className="block max-w-[180px] truncate text-slate-800"
          title={value}
        >
          {value}
        </span>
      );
    },
  },
  {
    accessorKey: "Industry",
    header: "Industry",
  },
  {
    accessorKey: "Sector",
    header: "Sector",
    cell: ({ getValue }) => {
      const value = String(getValue() ?? "").trim();
      if (!value) return "—";
      return (
        <span
          className="block max-w-[180px] truncate text-slate-800"
          title={value}
        >
          {value}
        </span>
      );
    },
  },
  {
    accessorKey: "t_date",
    header: "Purchase Date",
  },
  {
    accessorKey:"reporting_currency",
    header: "Purchase Currency",   
  },
  {
    accessorKey: "PurchaseQuantity",
    header: "Quantity",    
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
    accessorKey: "price",
    header: "Purchase Price / Security",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
    accessorKey: "purchaseValueFormated1",
    header: "Purchase Value",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
    accessorKey: "MarketPriceFormated",
    header: "Market Price / Security",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
    accessorKey: "MarketValueFormated",
    header: "Market Value",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
    accessorKey: "GainLossFormated",
    header: "Gain / Loss",
    cell: ({ getValue }) => {
      const html = String(getValue());
      const value = stripHtmlTags(html);
      const num = parseNumber(value);
      const isNegative = num < 0;
      return (
        <span className={isNegative ? "text-red-500" : "text-green-500"}>
          {value}
        </span>
      );
    },
  },
  {
      accessorKey: "PercteageGanLosFormated", 
      header: "% Gain / Loss",
      cell: ({ getValue }) => {
        const html = String(getValue());
        const value = stripHtmlTags(html);
        const num = parseNumber(value);
        const isNegative = num < 0;
        return (
          <span className={isNegative ? "text-red-500" : "text-green-500"}>
            {value}
          </span>
        );
      },
  },
  {
      accessorKey: "reporting_currency_2",
      header:"Reporting Currency",
      cell: ({ getValue }) => {
        const value = getValue() as string | number | null | undefined;
        return formatNumber(parseNumber(value));
      },
  },
  {
      accessorKey:"FXRate",
      header: "FX Rate",
      cell: ({ getValue }) => {
        const value = getValue() as string | number | null | undefined;
        return formatNumber(parseNumber(value), {
          minimumFractionDigits: 4,
          maximumFractionDigits: 4,
        });
      },
  },
  {
    accessorKey:"purchaseValuesInRcFormated",
    header: "Purchase Value in RC",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
    accessorKey:"MarketValueRCFormated",
    header: "Market Value in RC",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
    accessorKey:"DifferenceRCFormated",
    header: "Difference in RC",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
    accessorKey: "dividenFormated",
    header: "Interest/Dividend",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
      accessorKey:"DividendCoupon",
      header: "Dividend / Coupon",
  },
  {
    accessorKey: "TargetPrice",
    header: "Target Price",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
    accessorKey: "TargetPricePerentageFormat",  
    header: "Target Price %",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
      accessorKey: "Country",
      header: "Country",
  },
  {
      accessorKey: "BondRating",
      header: "Bond Rating",
  },
  {
      accessorKey: "Maturity",
      header: "Maturity",
  },
  {
    accessorKey: "PercentageProtFolio",
    header: "Percent of Portfolio",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },

  {
    accessorKey: "value",
    header: "Value",
    cell: ({ getValue }) => {
      const value = getValue() as string | number | null | undefined;
      return formatNumber(parseNumber(value));
    },
  },
  {
      accessorKey: "Remarks",
      header: "Remarks/Comments",
  },
  {
      accessorKey:"currency_name",
      header: "Currency Deployed",
  }
];