import {
  Chart as ChartJS,
  CategoryScale,
  LinearScale,
  PointElement,
  LineElement,
  BarElement,
  Title,
  Tooltip,
  Legend,
  Filler,
} from "chart.js"

ChartJS.register(
  CategoryScale,
  LinearScale,
  PointElement,
  LineElement,
  BarElement,
  Title,
  Tooltip,
  Legend,
  Filler
)

export function getChartColors(theme: string | undefined) {
  const isDark = theme === "dark"

  return {
    primary: isDark ? "rgb(96, 165, 250)" : "rgb(59, 130, 246)",
    secondary: isDark ? "rgb(168, 85, 247)" : "rgb(147, 51, 234)",
    success: isDark ? "rgb(74, 222, 128)" : "rgb(34, 197, 94)",
    grid: isDark ? "rgba(255, 255, 255, 0.1)" : "rgba(0, 0, 0, 0.1)",
    text: isDark ? "rgba(255, 255, 255, 0.7)" : "rgba(0, 0, 0, 0.7)",
  }
}

export const defaultChartOptions = {
  responsive: true,
  maintainAspectRatio: false,
  plugins: {
    legend: {
      display: true,
      position: "bottom" as const,
    },
  },
}