import React from 'react'
import { storiesOf } from '@storybook/react'
import { Rating, Star } from 'molecules/Ratings'

storiesOf('molecules/Rating', module)
  .add('default', () => <Rating />)
  .add('value & count', () => <Rating value={4} count={24} />)
  .add('0 ratings', () => <Rating value={undefined} count={0} />)
  .add('!shouldShowCount', () => (
    <Rating value={undefined} shouldShowCount={false} count={10} />
  ))
  .add('empty', () => {
    const renderEmpty = props => 'empty '
    return <Rating value={0} count={0} renderEmpty={renderEmpty} />
  })
  .add('renderProps', () => {
    const renderTotal = (props, formattedTotal) =>
      ' total: ( ' + formattedTotal + ' )'

    const renderCount = props => ' count: {' + props.count + '} '

    const renderStarList = props => ' list[] '

    return (
      <Rating
        renderStarList={renderStarList}
        renderTotal={renderTotal}
        renderCount={renderCount}
        value={Infinity}
        shouldShowCount={true}
        count={10}
      />
    )
  })
  .add('Star', () => <Star />)