"use client";

import * as React from "react";

import { PerformanceSummaryWidget } from "@/app/customer/_components/performance-summary-widget";
import { DepositWidget } from "@/app/customer/_components/deposit-widget";
import { TopGainersLosersWidget } from "@/app/customer/_components/top-gainers-losers-widget";
import { TopHoldingsWidget } from "@/app/customer/_components/top-holdings-widget";
import { CashflowCalendarWidget } from "@/app/customer/_components/cashflow-calendar-widget";
import { CashBalanceLiquidityWidget } from "@/app/customer/_components/cash-balance-liquidity-widget";

import {
  STATIC_WIDGET_DEFINITIONS,
  topGainersInstanceLayoutId,
  type StaticWidgetKind,
} from "./dashboard-widget-registry-definitions";
import type { EnabledDashboardWidgets } from "./dashboard-widget-allowlist";

const STATIC_WIDGET_COMPONENTS: Record<StaticWidgetKind, React.ComponentType> = {
  performance: PerformanceSummaryWidget,
  deposit: DepositWidget,
  top_gainers_losers: TopGainersLosersWidget,
  top_holdings: TopHoldingsWidget,
  cashflow_calendar: CashflowCalendarWidget,
  cash_balance_liquidity: CashBalanceLiquidityWidget,
};

export function renderStaticDashboardWidget(kind: StaticWidgetKind): React.ReactNode {
  const Component = STATIC_WIDGET_COMPONENTS[kind];
  return <Component />;
}

export function filterEnabledStaticWidgets(enabledWidgets: EnabledDashboardWidgets) {
  return STATIC_WIDGET_DEFINITIONS.filter((widget) => {
    if (widget.kind === "cashflow_calendar" && enabledWidgets.cashflowIds.size > 0) {
      // Rendered per-instance via cashflowIds (supports Add Widget multi-instance).
      return false;
    }
    if (widget.kind === "top_gainers_losers" && enabledWidgets.topGainersIds.size > 0) {
      // Rendered per-instance via topGainersIds (supports Add Widget multi-instance).
      return false;
    }
    if (widget.kind === "deposit" && enabledWidgets.depositIds.size > 0) {
      // Rendered per-instance via depositIds (supports Add Widget multi-instance).
      return false;
    }
    return enabledWidgets[widget.enabledKey];
  });
}

export function collectVisibleStaticWidgetIds(
  enabledWidgets: EnabledDashboardWidgets,
  visibility: Record<string, boolean>,
): string[] {
  return filterEnabledStaticWidgets(enabledWidgets)
    .filter((widget) => visibility[widget.layoutId] !== false)
    .map((widget) => widget.layoutId);
}

export function buildStaticWidgetCatalogItems(
  enabledWidgets: EnabledDashboardWidgets,
  serverCatalog?: Array<{ key: string; label: string; defaultVisible?: boolean }>,
) {
  if (!enabledWidgets.loaded) return [];

  const staticItems = filterEnabledStaticWidgets(enabledWidgets).map((widget) => {
    const fromServer = serverCatalog?.find((row) => row.key === widget.layoutId);
    return {
      key: widget.layoutId,
      label: fromServer?.label ?? widget.label,
      defaultVisible: fromServer?.defaultVisible !== false ? widget.defaultVisible : false,
      group: "widgets" as const,
    };
  });

  const topGainersItems = Array.from(enabledWidgets.topGainersIds)
    .sort((a, b) => a - b)
    .map((id) => ({
      key: topGainersInstanceLayoutId(id, enabledWidgets.topGainersIds.size),
      label: enabledWidgets.topGainersNames.get(id) || "Top Gainers and Losers",
      defaultVisible: true,
      group: "widgets" as const,
    }));

  return [...staticItems, ...topGainersItems];
}

export function renderVisibleStaticWidgets(
  enabledWidgets: EnabledDashboardWidgets,
  visibility: Record<string, boolean>,
  options?: { wrapIndividual?: boolean },
) {
  return filterEnabledStaticWidgets(enabledWidgets)
    .filter((widget) => visibility[widget.layoutId] !== false)
    .map((widget) => {
      const content = renderStaticDashboardWidget(widget.kind);
      if (!options?.wrapIndividual || widget.individualGridSpan === 1) {
        return <React.Fragment key={widget.layoutId}>{content}</React.Fragment>;
      }
      return (
        <div key={widget.layoutId} className="lg:col-span-2">
          {content}
        </div>
      );
    });
}