type AbbrProps = {
  children: string
  maxLen?: number
}

export function Abbr({ children, maxLen = 30, ...props }: AbbrProps) {
  if (children.length <= maxLen) {
    return <abbr {...props}>{children}</abbr>
  }

  return (
    <abbr title={children} {...props}>
      {children.substring(0, maxLen).concat('...')}
    </abbr>
  )
}