import React from 'react'
import { Empty } from '@skava/ui/dist/components/atoms/Empty'
import { TextPlaceholder, RectanglePlaceholder } from '@skava/ui/dist/components/atoms/Placeholder'
import { UserInviteProps, UserInviteState } from './typings'
import { Wrapper } from './styled'

function defaultRenderButton(props: UserInviteProps, state: UserInviteState) {
  return <RectanglePlaceholder width={250} height={30} />
}

function defaultRenderInviteCard(props: UserInviteProps, state: UserInviteState) {
  return 'Abstraction/RenderInviteCard'
}

function defaultRenderRemoveUserForm(props: UserInviteProps, state: UserInviteState) {
  return <Empty />
}

function defaultRenderAddUserForm(props: UserInviteProps, state: UserInviteState) {
  return <Empty />
}

function defaultRenderHeading(props: UserInviteProps, state: UserInviteState) {
  return <TextPlaceholder width={200} height={30} />
}

function defaultRenderWrapper(props: UserInviteProps, state: UserInviteState) {
  const { className, children } = props
  const passThroughProps = Object.freeze({
    className,
    'data-qa': props['data-qa']
  })
  return <Wrapper {...passThroughProps}>{children}</Wrapper>
}

export { defaultRenderButton, defaultRenderInviteCard, defaultRenderRemoveUserForm, defaultRenderAddUserForm, defaultRenderHeading, defaultRenderWrapper }