import {
  DASHBOARD_WIDGET_CATALOG,
  type DashboardWidgetCatalogEntry,
  type DashboardWidgetType,
} from "@capakraken/shared/types";
import { lazy, type ComponentType, type LazyExoticComponent } from "react";

type WidgetUpdate = Record<string, unknown>;

export interface WidgetProps {
  config: Record<string, unknown>;
  onConfigChange?: (update: WidgetUpdate) => void;
}

export type WidgetComponent = LazyExoticComponent<ComponentType<WidgetProps>>;

export interface WidgetDefinition extends DashboardWidgetCatalogEntry {
  component: WidgetComponent;
}

export const WIDGET_CATALOG = DASHBOARD_WIDGET_CATALOG;

export const WIDGET_REGISTRY: Record<DashboardWidgetType, WidgetDefinition> = {
  "stat-cards": {
    ...DASHBOARD_WIDGET_CATALOG.find((widget) => widget.type === "stat-cards")!,
    component: lazy(() => import("./widgets/StatCardsWidget.js").then((m) => ({ default: m.StatCardsWidget }))),
  },
  "resource-table": {
    ...DASHBOARD_WIDGET_CATALOG.find((widget) => widget.type === "resource-table")!,
    component: lazy(() => import("./widgets/ResourceTableWidget.js").then((m) => ({ default: m.ResourceTableWidget }))),
  },
  "project-table": {
    ...DASHBOARD_WIDGET_CATALOG.find((widget) => widget.type === "project-table")!,
    component: lazy(() => import("./widgets/ProjectTableWidget.js").then((m) => ({ default: m.ProjectTableWidget }))),
  },
  "peak-times-chart": {
    ...DASHBOARD_WIDGET_CATALOG.find((widget) => widget.type === "peak-times-chart")!,
    component: lazy(() => import("./widgets/PeakTimesWidget.js").then((m) => ({ default: m.PeakTimesWidget }))),
  },
  "demand-view": {
    ...DASHBOARD_WIDGET_CATALOG.find((widget) => widget.type === "demand-view")!,
    component: lazy(() => import("./widgets/DemandWidget.js").then((m) => ({ default: m.DemandWidget }))),
  },
  "top-value-resources": {
    ...DASHBOARD_WIDGET_CATALOG.find((widget) => widget.type === "top-value-resources")!,
    component: lazy(() => import("./widgets/TopValueWidget.js").then((m) => ({ default: m.TopValueWidget }))),
  },
  "chargeability-overview": {
    ...DASHBOARD_WIDGET_CATALOG.find((widget) => widget.type === "chargeability-overview")!,
    component: lazy(() => import("./widgets/ChargeabilityWidget.js").then((m) => ({ default: m.ChargeabilityWidget }))),
  },
  "my-projects": {
    ...DASHBOARD_WIDGET_CATALOG.find((widget) => widget.type === "my-projects")!,
    component: lazy(() => import("./widgets/MyProjectsWidget.js").then((m) => ({ default: m.MyProjectsWidget }))),
  },
  "budget-forecast": {
    ...DASHBOARD_WIDGET_CATALOG.find((widget) => widget.type === "budget-forecast")!,
    component: lazy(() => import("./widgets/BudgetForecastWidget.js").then((m) => ({ default: m.BudgetForecastWidget }))),
  },
  "skill-gap": {
    ...DASHBOARD_WIDGET_CATALOG.find((widget) => widget.type === "skill-gap")!,
    component: lazy(() => import("./widgets/SkillGapWidget.js").then((m) => ({ default: m.SkillGapWidget }))),
  },
  "project-health": {
    ...DASHBOARD_WIDGET_CATALOG.find((widget) => widget.type === "project-health")!,
    component: lazy(() => import("./widgets/ProjectHealthWidget.js").then((m) => ({ default: m.ProjectHealthWidget }))),
  },
};

export function getWidget(type: DashboardWidgetType): WidgetDefinition {
  return WIDGET_REGISTRY[type];
}

export function getAllWidgets(): WidgetDefinition[] {
  return Object.values(WIDGET_REGISTRY);
}
