import app from '../app'
import React from 'react'
import debug from 'debug'
import fetch from 'node-fetch'
import Html from '../components/Html'
import { Router } from 'react-router'
import routes from '../components/routes'
// import { ClientError } from '../lib/errors'
import serialize from 'serialize-javascript'
import Location from 'react-router/lib/Location'
import navigateAction from '../actions/navigateAction'
import { createElementWithContext } from 'fluxible-addons-react'

const log = debug('bshed:client:renderer')
export default function renderer ({ scripts=[], styles=[] }={}) {
  return function * rendererMiddleware () {
    const rootUrl = `${this.protocol}://${this.host}`
    const cookie = this.get('cookie')

    log('creating context')
    const context = app.createContext({ fetch, rootUrl, cookie })

    log('running router')
    const location = new Location(this.url, this.query)
    const { state, transition } = yield runRouter({ location })
    console.log('transition', transition, state)

    log('running navigateAction')
    yield context.executeAction(navigateAction, { location, ...state })

    log('generating state')
    const appState = `window.BSHED=${serialize(app.dehydrate(context))}`

    log('generating markup')
    const markup = React.renderToString(createElementWithContext(context, state))

    log('generating html')
    const html = React.renderToStaticMarkup(
      <Html
        state={appState}
        markup={markup}
        styles={styles}
        scripts={scripts}
      />
    )

    log('sending response')
    this.status = 200
    this.type = 'html'
    this.body = `<!DOCTYPE html>${html}`
  }
}

function runRouter ({ location }) {
  return new Promise((resolve, reject) => {
    Router.run(routes, location, (error, state, transition) => {
      error ? reject(error) : resolve({state, transition})
    })
  })
}


@@ -1,12 +1,15 @@
+// 
 import app f
@@ -47,16 +47,19 @@
 'react'%0A
+// 
 import d
@@ -76,16 +76,19 @@
 'debug'%0A
+// 
 import f
@@ -148,16 +148,19 @@
 s/Html'%0A
+// 
 import %7B
@@ -189,16 +189,19 @@
 router'%0A
+// 
 import r
@@ -281,16 +281,19 @@
 errors'%0A
+// 
 import s
@@ -329,16 +329,19 @@
 script'%0A
+// 
 import L
@@ -377,24 +377,27 @@
 b/Location'%0A
+// 
 import navig
@@ -439,16 +439,19 @@
 Action'%0A
+// 
 import %7B
@@ -508,16 +508,19 @@
 react'%0A%0A
+// 
 const lo
@@ -668,739 +668,8 @@
 ) %7B%0A
-    const rootUrl = %60$%7Bthis.protocol%7D://$%7Bthis.host%7D%60%0A    const cookie = this.get('cookie')%0A%0A    log('creating context')%0A    const context = app.createContext(%7B fetch, rootUrl, cookie %7D)%0A%0A    log('running router')%0A    const location = new Location(this.url, this.query)%0A    const %7B state, transition %7D = yield runRouter(%7B location %7D)%0A    console.log('transition', transition, state)%0A%0A    log('running navigateAction')%0A    yield context.executeAction(navigateAction, %7B location, ...state %7D)%0A%0A    log('generating state')%0A    const appState = %60window.BSHED=$%7Bserialize(app.dehydrate(context))%7D%60%0A%0A    log('generating markup')%0A    const markup = React.renderToString(createElementWithContext(context, state))%0A%0A    log('generating html')
 %0A   
@@ -726,57 +726,8 @@
 tml%0A
-        state=%7BappState%7D%0A        markup=%7Bmarkup%7D%0A
     
@@ -792,36 +792,8 @@
  )%0A%0A
-    log('sending response')%0A
     
@@ -878,15 +878,1118 @@
 l%7D%60%0A
+%0A
   
-%7D%0A%7D%0A%0A
+  // const rootUrl = %60$%7Bthis.protocol%7D://$%7Bthis.host%7D%60%0A    // const cookie = this.get('cookie')%0A%0A    // log('creating context')%0A    // const context = app.createContext(%7B fetch, rootUrl, cookie %7D)%0A%0A    // log('running router')%0A    // const location = new Location(this.url, this.query)%0A    // const %7B state, transition %7D = yield runRouter(%7B location %7D)%0A    // console.log('transition', transition, state)%0A%0A    // log('running navigateAction')%0A    // yield context.executeAction(navigateAction, %7B location, ...state %7D)%0A%0A    // log('generating state')%0A    // const appState = %60window.BSHED=$%7Bserialize(app.dehydrate(context))%7D%60%0A%0A    // log('generating markup')%0A    // const markup = React.renderToString(createElementWithContext(context, state))%0A%0A    // log('generating html')%0A    // const html = React.renderToStaticMarkup(%0A    //   %3CHtml%0A    //     state=%7BappState%7D%0A    //     markup=%7Bmarkup%7D%0A    //     styles=%7Bstyles%7D%0A    //     scripts=%7Bscripts%7D%0A    //   /%3E%0A    // )%0A%0A    // log('sending response')%0A    // this.status = 200%0A    // this.type = 'html'%0A    // this.body = %60%3C!DOCTYPE html%3E$%7Bhtml%7D%60%0A  %7D%0A%7D%0A%0A// 
 func
@@ -2016,24 +2016,27 @@
 cation %7D) %7B%0A
+// 
   return new
@@ -2063,24 +2063,27 @@
 eject) =%3E %7B%0A
+// 
     Router.r
@@ -2135,16 +2135,19 @@
 n) =%3E %7B%0A
+// 
       er
@@ -2201,19 +2201,28 @@
 n%7D)%0A
+// 
     %7D)%0A
+//
   
+ 
 %7D)%0A
+// 
 %7D%0A%0A

Update renderer to work with redux