import React from 'react'
import {createStore, applyMiddleware} from 'redux'
import reducers from './reducers'
import {Provider, connect} from 'react-redux'
import thunk from 'redux-thunk'
import {View, Text, Platform} from 'react-native'
import {SetDev, getStoreList} from './actions'

// import pages
import StoreList from './containers/StoreList'
import ItemsPage from './containers/ItemsPage'
import Dialog from './containers/Dialog'

const middleware = [thunk]

const store = createStore(reducers, applyMiddleware(...middleware))

store.subscribe(() => {
  console.log(JSON.stringify(store.getState()))
})

const VV = (props) => {
  console.log(props)
  return (
    <View style={{
      flex: 1,
      paddingTop: Platform.OS === 'ios' ? 20 : 0
    }}>
      {
        props.children
      }
    </View>
  )
}

const CView = connect()(VV)

class Main extends React.Component {

  componentDidMount(){
    store.dispatch(getStoreList())
  }

  render() {
    return (
      <Provider store={store}>
        <CView>
          <StoreList />
          <ItemsPage />
          <Dialog />
        </CView>
      </Provider>
    )
  }
}



export default Main