"use client";

import * as React from "react";

import type { DashboardSettingsWidget, DashboardWidgetIsin } from "../../_lib/dashboard-widgets-server-api";
import type { ConfigureTarget } from "./types";
import { resolveWidgetConfig } from "./widget-config-registry";
import { WidgetConfigSheet } from "./widget-config-sheet";

function isCreateTarget(
  target: ConfigureTarget | null,
): target is Extract<
  ConfigureTarget,
  { kind: "create-diy" | "create-aa" | "create-ch" | "create-cf" | "create-tgl" | "create-dep" }
> {
  return (
    target?.kind === "create-diy" ||
    target?.kind === "create-aa" ||
    target?.kind === "create-ch" ||
    target?.kind === "create-cf" ||
    target?.kind === "create-tgl" ||
    target?.kind === "create-dep"
  );
}

function WidgetConfigLoadingState() {
  return (
    <p className="text-muted-foreground text-sm" aria-busy="true" aria-live="polite">
      Loading configuration…
    </p>
  );
}

export function DashboardWidgetConfigHost({
  tenant,
  widgets,
  target,
  open,
  onOpenChange,
  widgetSelections,
  onWidgetSelectionsChange,
  onWidgetsChanged,
  settingsLoading = false,
}: {
  tenant: string;
  widgets: DashboardSettingsWidget[];
  target: ConfigureTarget | null;
  open: boolean;
  onOpenChange: (open: boolean) => void;
  widgetSelections: Record<string, DashboardWidgetIsin[]>;
  onWidgetSelectionsChange: (selections: Record<string, DashboardWidgetIsin[]>) => void;
  onWidgetsChanged?: () => void;
  /** True while dashboard settings are being fetched before configure can render. */
  settingsLoading?: boolean;
}) {
  const mode = isCreateTarget(target) ? "create" : "edit";
  const waitingForWidget = settingsLoading && target?.kind === "widget";
  const widget =
    target?.kind === "widget"
      ? (widgets.find((entry) => entry.widget_id === target.widgetId) ?? null)
      : null;

  const descriptor = resolveWidgetConfig(waitingForWidget ? null : widget, mode, target?.kind);
  const Panel = descriptor.Panel;

  const createKind =
    target?.kind === "create-aa"
      ? ("asset_allocation" as const)
      : target?.kind === "create-ch"
        ? ("consolidated_holdings" as const)
        : target?.kind === "create-diy"
          ? ("diy_consolidated_holdings" as const)
          : target?.kind === "create-cf"
            ? ("cashflow_calendar" as const)
            : target?.kind === "create-tgl"
              ? ("top_gainers_losers" as const)
            : target?.kind === "create-dep"
              ? ("deposit" as const)
              : undefined;

  return (
    <WidgetConfigSheet
      open={open && target !== null}
      onOpenChange={onOpenChange}
      title={waitingForWidget ? "Loading configuration…" : descriptor.title(widget, mode)}
      description={
        waitingForWidget
          ? "Fetching widget settings."
          : descriptor.description
      }
      size={descriptor.size}
    >
      {open && target ? (
        waitingForWidget ? (
          <WidgetConfigLoadingState />
        ) : (
          <Panel
            tenant={tenant}
            widget={widget}
            mode={mode}
            createKind={createKind}
            widgetSelections={widgetSelections}
            onWidgetSelectionsChange={onWidgetSelectionsChange}
            onClose={() => onOpenChange(false)}
            onWidgetsChanged={onWidgetsChanged}
          />
        )
      ) : null}
    </WidgetConfigSheet>
  );
}