import '../styles/styles.scss'
import { compose, withState } from 'recompose'
import { connect } from 'react-redux'
import { readAsync as readWallsAsync } from '../redux/actions/walls'
import { readAsync as readFloorAsync } from '../redux/actions/floor'
import { readAsync as readPartyAgentAsync } from '../redux/actions/partyAgent'
import { readAsync as readTeleporterAsync } from '../redux/actions/teleporter'
import { readAsync as readEncountersAsync } from '../redux/actions/encounters'

import { readAsync as readDungeonsAsync } from '../redux/actions/dungeons'
import { readAsync as readCombatAsync } from '../redux/actions/combat'
import { readAsync as readMonstersAsync } from '../redux/actions/monsters'
import firebase from '../firebase/firebase'
import Dungeon from '../components/Dungeon'
import DMInterface from '../components/DMInterface'
import DMView from '../components/DMView'
import Main from '../components/Main'
import { readCurrentUserAsync } from '../redux/actions/auth'

// const asyncRequest = async () => { 	const response = await
// fetch(`http://localhost:2500/graphql`, { 		method: `POST`, 		headers: {
// 			'content-type': `application/json`, 		}, 		body: JSON.stringify({ query:
// `{greeting}` }), 	}) 	const responseBody = await response.json()
// 	console.log(responseBody) }
//
//asyncRequest()

const party = {
	slot1: {
		name: `alpha`,
		health: 100,
		damage: 10,
	},
	slot2: {
		name: `beta`,
		health: 50,
		damage: 20,
	},
}

const enemies = {
	foo: {
		health: 10,
		damage: 2,
	},
	bar: {
		health: 5,
		damage: 1,
	},
}

const encounters = {
	easy: {
		bar: 2,
	},
	normal: {
		foo: 1,
		bar: 3,
	},
}

class index extends React.Component {
	componentDidMount() {
		const { readCurrentUserAsync } = this.props
		firebase.auth().onAuthStateChanged(async (user) => {
			if (user) {
				const currentUser = await firebase.auth().currentUser
				await readCurrentUserAsync(currentUser)
			} else {
				readCurrentUserAsync({ uid: null })
			}
		})
	}
	render() {
		return <Main />
	}
}

index.getInitialProps = async ({ store }) => {
	console.log(`getInitialProps`)
	await store.dispatch(readWallsAsync())
	await store.dispatch(readPartyAgentAsync())
	await store.dispatch(readEncountersAsync())
	await store.dispatch(readFloorAsync())
	await store.dispatch(readDungeonsAsync())

	await store.dispatch(readCombatAsync())
	await store.dispatch(readTeleporterAsync())
}

const enhance = compose(connect(null, { readCurrentUserAsync }))

export default enhance(index)
