// @flow
import React from 'react'
import type { Node } from 'react'
import Lottie from 'react-lottie-player/dist/LottiePlayerLight'

type ThumbnailType = {
  url: string,
  alt: string,
  width?: number,
  height?: number,
}

const Thumbnail = ({
  url, alt, width, height, ...rest
}: ThumbnailType): Node => {
  const isLottie = url.endsWith('.json')

  if (isLottie) {
    return (
      <Lottie
        path={url}
        style={{ width, height }}
        play
      />
    )
  }

  return <img src={url} alt={alt} width={width} height={height} {...rest} />
}

export default Thumbnail