import React from 'react'
import omniStorage from 'uxui-modules/persistance'
import { isFunction, isSafe } from 'exotic'
import { wording } from 'src/words'
import { AddUser, RemoveUser } from './Form'
import { UserInviteProps, UserInviteState } from './typings'
import { StyledButton, StyledHeading } from './styled'

function defaultRenderButton(props: UserInviteProps, state: UserInviteState) {
  const { onSendInviteClick } = props

  const handleSendInviteClick = event => {
    if (isFunction(onSendInviteClick)) {
      onSendInviteClick(state.userInviteList)
    }
  }
  const isDisabled = isSafe(state.userInviteList) && state.userInviteList.length >= 1 ? false : true
  return <StyledButton text={wording.sendInvite} onClick={handleSendInviteClick} {...state} isDisabled={isDisabled} />
}

function defaultRenderInviteCard(props: UserInviteProps, state: UserInviteState) {
  const { renderAddUserForm, renderRemoveUserForm, ...remainingProps } = props
  return (
    <React.Fragment>
      {renderRemoveUserForm(remainingProps, state)}
      {renderAddUserForm(remainingProps, state)}
    </React.Fragment>
  )
}

function defaultRenderRemoveUserForm(props: UserInviteProps, state: UserInviteState) {
  const handleRemoveUserClick = args => {
    const { index } = args
    console.log('handleRemoveUserClick', args.toSerialized(), index)
    state.handleRemoveUser(index)
  }
  return state.userInviteList.map((item, index) => (<RemoveUser index={index} onRemoveUser={handleRemoveUserClick} item={item} />))
}

function defaultRenderAddUserForm(props: UserInviteProps, state: UserInviteState) {
  const handleAddUserClick = args => {
    state.handleAddUser(args.toSerialized())
  }
  const isDisabled = isSafe(state.userInviteList) && state.userInviteList.length >= 10 ? true : false
  return <AddUser onAddUser={handleAddUserClick} isDisabled={isDisabled} />
}

function defaultRenderHeading(props: UserInviteProps, state: UserInviteState) {
  return <StyledHeading breedType="h2" content={wording.userManagement} />
}

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