"use client";
import { LANGUAGES, cn, languageLabels } from "@wp2/helpers";
import { Button } from "@wp2/ui/dist/button";
import { Image } from "@wp2/ui/dist/image";
import { useSlugs } from "@wp2/helpers/dist/client";
import { getSlug } from "@wp2/helpers";
export const LangSelector = ({ className }) => {
    const { filename } = useSlugs();
    return (<div className={cn("flex items-center gap-3", className)}>
      {LANGUAGES.map((lang) => (<Button variant={null} key={lang} href={`/${getSlug(lang, filename).join("/")}`}>
          <Image width={20} height={12} className="h-[12px] w-[20px] object-cover" alt={lang} src={languageLabels[lang].image}/>
        </Button>))}
    </div>);
};