import React from 'react'
import styled from 'styleh-components'
import { Ratings as BaseRatings, RatingProps } from 'presets/Ratings'

const StyledRatings = styled.withComponent(BaseRatings)`
  font-size: 14px;
`

const Rating = (props: RatingProps) => {
  const { value, count, shouldShowCount, renderEmpty } = props
  const converted = {
    width: 14,
    starRating: value !== undefined ? value : 0,
    userRating: count,
    shouldShowCount:
      shouldShowCount !== undefined ? shouldShowCount : count && count > 0,
  }
  return renderEmpty ? (
    renderEmpty(props)
  ) : (
    <StyledRatings {...props} {...converted} />
  )
}

export { Rating }
export default Rating