/**
 * @flow
 */
import React from 'react'
import { AsyncStorage } from 'react-native'
import { connect } from 'react-redux'
import { RNDevToolbox } from 'rn-dev-toolbox'
import { isAuthenticated, getCurrentUser } from 'cugn-vost-shared/dist/flux/selectors'
import faker from 'faker'
import { store } from '../../redux/store'
import { change } from 'redux-form'
import { navigate } from '../navigation/navigation-action-creators'
import { Routes } from '../navigation/constants'
import { storageService } from '../../services/storage-service'
import { signOut } from 'cugn-vost-shared/dist/flux/auth/actions-creators'
import { formName as signInFormName } from 'cugn-vost-shared/dist/flux/auth/sign-in-form'
import { formName as signUpFormName } from 'cugn-vost-shared/dist/flux/auth/sign-up-form'
import { formName as newPostFormName } from 'cugn-vost-shared/dist/flux/articles/new-post-form'

const preFillValues = {
  email: 'test3@gmail.com',
  username: 'test3',
  password: 'testPassword',
  confirmation: 'testPassword',
  lastName: 'MyName',
  firstName: 'MyFirstName',
  address: 'Nowhere street',
  city: 'Nowhere',
  zipCode: '54000',
  birthDate: '08/03/1990',
  newsletterSubscribed: false,
  conditions: true
}

const newPostPreFillValues = {
  title: faker.lorem.words,
  description: faker.lorem.text,
  file: {
    uri: 'content://com.google.android.apps.photos.contentprovider/-1/2/content%3A%2F%2Fmedia%2Fexternal%2Fvideo%2Fmedia%2F54/ORIGINAL/NONE/274416518',
    name: 'VID_20180529_095505.mp4',
    type: 'video/foo'
  }
}

const processPreFillData = (preFillValues, formName) => {
  setTimeout(() => {
    Object.keys(preFillValues).forEach(key => {
      let value = preFillValues[key]
      if (typeof value === 'function') {
        value = value()
      }
      store.dispatch(change(formName, key, value))
    })
  }, 1)
}

type Props = {
  dispatch: Function,
  user: any,
  authenticated: boolean,
  children: any
}

type State = {}

class AppDebugContainer extends React.Component<Props, State> {
  constructor (props) {
    super(props)
    this.state = {}
  }

  componentDidMount () {}

  componentWillUnmount () {}

  componentDidUpdate (prevProps) { }

  home = () => {
    store.dispatch(navigate(Routes.HOME_VIEW))
  }

  home = () => {
    store.dispatch(navigate(Routes.HOME_VIEW))
  }

  signIn = () => {
    store.dispatch(navigate(Routes.SIGN_IN_VIEW))
    setTimeout(() => {
      Object.keys(preFillValues).forEach(key => store.dispatch(change(signInFormName, key, preFillValues[key])))
    }, 1)
  }

  signUp = () => {
    store.dispatch(navigate(Routes.SIGN_UP_VIEW))
    setTimeout(() => {
      Object.keys(preFillValues).forEach(key => store.dispatch(change(signUpFormName, key, preFillValues[key])))
    }, 1)
  }

  signOut = () => {
    store.dispatch(signOut())
  }

  profile = () => {
    store.dispatch(navigate(Routes.PROFILE_VIEW))
  }

  editProfile = () => {
    store.dispatch(navigate(Routes.EDIT_PROFILE_VIEW))
  }

  vost = () => {
    store.dispatch(navigate(Routes.NEW_POST))
    processPreFillData(newPostPreFillValues, newPostFormName)
  }

  resetStorage = () => {
    return storageService.clear()
  }

  render () {
    return (
      <RNDevToolbox
        persistenceProvider={AsyncStorage}
        actions={[
          {
            name: 'Home',
            task: this.home
          },
          {
            name: 'signIn',
            task: this.signIn
          },
          {
            name: 'signUp',
            task: this.signUp
          },
          {
            name: 'signOut',
            task: this.signOut
          },
          {
            name: 'profile',
            task: this.profile
          },
          {
            name: 'editProfile',
            task: this.editProfile
          },
          {
            name: 'vost',
            task: this.vost
          },
          {
            name: 'resetStorage',
            task: this.resetStorage
          }
        ]}
        indicators={{
          'Auth': [this.props.user.get('username') || 'no', this.props.user.get('username') ? RNDevToolbox.VALID : RNDevToolbox.DANGER]
        }}
      >
        {this.props.children}
      </RNDevToolbox>
    )
  }
}

const mapStateToProps = (state) => ({
  authenticated: isAuthenticated(state),
  user: getCurrentUser(state)
})

const enhanced = connect(mapStateToProps)(AppDebugContainer)

export {
  enhanced as AppDebugContainer
}