import React, { useMemo } from "react";
import { buildLocationWiseSeries } from "../../../utils/userSwiDashboard.js";
import UserVerticalBarChart from "./UserVerticalBarChart.jsx";

/**
 * @param {{
 *   documents?: object[],
 *   locationName?: string | null,
 *   loading?: boolean,
 *   onClick?: () => void,
 *   onBarClick?: (item: { label: string, value: number, tone?: string }, index: number) => void,
 * }} props
 */
export default function LocationSwisChart({
  documents = [],
  locationName = null,
  loading = false,
  onClick,
  onBarClick,
}) {
  const data = useMemo(() => buildLocationWiseSeries(documents), [documents]);

  if (loading) {
    return (
      <section className="swi-user-chart swi-panel">
        <p className="swi-muted">Loading location chart…</p>
      </section>
    );
  }

  return (
    // <UserVerticalBarChart
    //   data={data}
    //   title="Location-wise SWIs"
    //   description={
    //     locationName
    //       ? `SWI count by plant. Your location: ${locationName}.`
    //       : "SWI documents grouped by plant location."
    //   }
    //   emptyMessage="No SWI documents found for any location."
    //   personalizedWidgetId="swiLocationChart"
    //   onClick={onClick}
    //   onBarClick={onBarClick}
    // />
    <></>
  );
}
