import React from 'react'
import { DashboardCardProps } from './typings'
import { CardBox } from './styled'
import {
  defaultRenderHeading,
  defaultRenderDescription,
  defaultRenderButton,
  defaultRenderWrapper,
} from './renderProps'

class DashboardCard extends React.PureComponent<DashboardCardProps> {
  static defaultProps = {
    className: '',
    // renderProps
    renderHeading: defaultRenderHeading,
    renderDescription: defaultRenderDescription,
    renderButton: defaultRenderButton,
    renderWrapper: defaultRenderWrapper,
  }
  render() {
    const {
      renderWrapper,
      renderHeading,
      renderDescription,
      renderButton,
      ...remainingProps
    } = this.props
    const children = (
      <CardBox>
        {renderHeading(remainingProps)}
        {renderDescription(remainingProps)}
        {renderButton(remainingProps)}
      </CardBox>
    )
    return renderWrapper({ children, ...remainingProps })
  }
}

export { DashboardCard }
export default DashboardCard