import { action, observable } from 'xmobx/mobx'
import { EMPTY_ARRAY, isFunction } from 'exotic'
import { UserInviteState, FormSubmitData } from './typings'

const inviteUserState = observable({
  shouldValidateForm: false,
  isAllFormsValid: true,
  savedList: EMPTY_ARRAY,
})

class UserInviteStorage implements UserInviteState {
  @observable
  userInviteList = []

  @action.bound
  handleAddUser(SERIALIZED_DATA_ON_FORM_SUBMIT: FormSubmitData) {
    this.userInviteList.push(SERIALIZED_DATA_ON_FORM_SUBMIT)
  }

  @action.bound
  handleRemoveUser(index: number) {
    // console.log('handleRemoveUser list Before', this.userInviteList)
    this.userInviteList.splice(index, 1)
    // console.log('handleRemoveUser list After', this.userInviteList)
  }

  @action.bound
  handleSendInvite(onSendInviteClick: Function) {
    inviteUserState.shouldValidateForm = true
    if (inviteUserState.isAllFormsValid === true) {
      if (
        inviteUserState.savedList.length > 0 &&
        isFunction(onSendInviteClick)
      ) {
        onSendInviteClick(inviteUserState.savedList)
      }
      this.userInviteList = []
    } else if (inviteUserState.isAllFormsValid === false) {
      inviteUserState.isAllFormsValid = true
    }
    inviteUserState.shouldValidateForm = false
  }
}

export { UserInviteStorage, inviteUserState }
export default UserInviteStorage