"use client"

import { Plus } from "lucide-react"
import { useTranslations } from "next-intl"

import { Badge } from "@/shared/components/ui/badge"
import { Button } from "@/shared/components/ui/button"

export function ClassListToolbar({
  count,
  onNew,
  isWorking,
  disabled = false,
}: {
  count: number
  onNew: () => void
  isWorking: boolean
  disabled?: boolean
}) {
  const t = useTranslations("classes")
  return (
    <div className="flex items-center justify-between">
      <Badge variant="secondary" className="tabular-nums">
        {count}
      </Badge>
      <Button onClick={onNew} disabled={isWorking || disabled}>
        <Plus className="mr-2 h-4 w-4" />
        {t("list.new")}
      </Button>
    </div>
  )
}
