"use client"

import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
import { BarChart } from "@/components/charts/bar-chart"
import type { ChartDataPoint } from "@/types/dashboard"

interface SalesChartProps {
  data: ChartDataPoint[]
}

export function SalesChart({ data }: SalesChartProps) {
  const chartData = {
    labels: data.map((d) => d.label),
    datasets: [
      {
        label: "Sales",
        data: data.map((d) => d.value),
      },
    ],
  }

  return (
    <Card>
      <CardHeader>
        <CardTitle>Sales Activity</CardTitle>
      </CardHeader>
      <CardContent>
        <BarChart data={chartData} height={350} />
      </CardContent>
    </Card>
  )
}