import LocalizedClientLink from "@modules/common/components/localized-client-link"
import { LayoutComponentDefinition, LayoutContext } from "vibentec/component-map";
import { clx } from "@medusajs/ui"
 
interface VtLinkProps {
  className?: string
  href?: string
  label?: string
}
export const VtLink = ({ nodes, context }: { nodes: LayoutComponentDefinition; context: LayoutContext }) => {
  const props = nodes.config as VtLinkProps ?? {}
  const className = clx("txt-compact-xlarge-plus hover:text-ui-fg-base", props.className)
  const href = props.href ?? "/"
  const label = props.label ?? "Medusa Store"

  return (
    <div className="flex items-center h-full">
      <LocalizedClientLink
        href={href}
        className={className}
      >
        {label}
      </LocalizedClientLink>
  </div>
  )
}

export default VtLink