"use client"

import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer } from "recharts"

const data = [
  {
    name: "营销系统",
    使用标签数: 85,
  },
  {
    name: "推荐系统",
    使用标签数: 72,
  },
  {
    name: "客服系统",
    使用标签数: 45,
  },
  {
    name: "风控系统",
    使用标签数: 38,
  },
  {
    name: "内容系统",
    使用标签数: 65,
  },
]

export function TagUsageStats() {
  return (
    <ResponsiveContainer width="100%" height={300}>
      <BarChart
        data={data}
        margin={{
          top: 5,
          right: 30,
          left: 20,
          bottom: 5,
        }}
      >
        <CartesianGrid strokeDasharray="3 3" />
        <XAxis dataKey="name" />
        <YAxis />
        <Tooltip />
        <Legend />
        <Bar dataKey="使用标签数" fill="#8884d8" />
      </BarChart>
    </ResponsiveContainer>
  )
}