"use client";

import type { HomepageSummary } from "../../lib/homepageSummary";
import type { ChartState } from "../../lib/homepageChart";
import { MomentumChart } from "./MomentumChart";
import { SmallMultiples } from "./SmallMultiples";
import { LeaderboardChart } from "./LeaderboardChart";
import { CrossSiteChart } from "./CrossSiteChart";

// Routes a ChartState to the right renderer. Keeps HomeLanding about controls
// and presets; each chart owns its own axis/scale concerns.
export function ChartPanel({
  summary,
  state,
  onSelectSeries,
}: {
  summary: HomepageSummary;
  state: ChartState;
  onSelectSeries?: (id: string) => void;
}) {
  switch (state.chartType) {
    case "line":
      return (
        <MomentumChart
          summary={summary}
          state={state}
          onSelectSeries={onSelectSeries}
        />
      );
    case "small":
      return <SmallMultiples summary={summary} state={state} />;
    case "barH":
      return <LeaderboardChart summary={summary} state={state} />;
    case "area":
    case "bar":
    default:
      return <CrossSiteChart summary={summary} state={state} />;
  }
}