import type { LanguageSwitcherProps } from "@/types/components/current/languageSwitcher";

export default function Desktop({ currentLanguage, links }: LanguageSwitcherProps) {
  return (
    <div className="dropdown-container navbar-language-selector ">
      <button className="navbar-language-selector__toggler" data-js="dropdown-toggler" aria-pressed="false">
        <svg focusable="false" className="icon icon--xs icon--white" viewBox="0 0 32 32">
          <use xlinkHref="/Static/img/icons/sprites.svg#icon-globe"></use>
        </svg>
        {currentLanguage} <span className="hidden--accessible">Choose language</span>
        <span className="caret"></span>
      </button>
      <ul className="dropdown-menu">
        {links.map(link => (
          <li
            className={currentLanguage === link.title ? "active" : undefined}
            key={link.href}
          >
            <a href="https://www.scandichotels.com/sponsoring">{link.title}</a>
          </li>
        ))}
      </ul>
    </div>
  )
}