"use client"
import { Button } from "@/components/ui/button"
import { cn } from "@/lib/utils"

export type Language = "en" | "vn"

interface LanguageSwitcherProps {
  currentLang: Language
  onLanguageChange: (lang: Language) => void
}

export function LanguageSwitcher({ currentLang, onLanguageChange }: LanguageSwitcherProps) {
  return (
    <div className="flex items-center space-x-1 bg-muted/50 rounded-full p-1">
      <Button
        variant="ghost"
        size="sm"
        onClick={() => onLanguageChange("en")}
        className={cn(
          "h-8 px-3 text-xs font-medium rounded-full transition-all",
          currentLang === "en"
            ? "bg-background text-foreground shadow-sm"
            : "text-muted-foreground hover:text-foreground",
        )}
      >
        EN
      </Button>
      <Button
        variant="ghost"
        size="sm"
        onClick={() => onLanguageChange("vn")}
        className={cn(
          "h-8 px-3 text-xs font-medium rounded-full transition-all",
          currentLang === "vn"
            ? "bg-background text-foreground shadow-sm"
            : "text-muted-foreground hover:text-foreground",
        )}
      >
        VN
      </Button>
    </div>
  )
}