import * as React from 'react'
import { Store } from 'react-chrome-redux'
import { render } from 'react-dom'
import { Provider } from 'react-redux'
import { LoadStyles } from '@drifthq/tide'

import EnrollModal from './EnrollModal'

declare const window: any

const store = new Store({
  portName: 'DRIFT',
})

store.ready().then(() => {
  LoadStyles()
  chrome.tabs.query(
    { currentWindow: true, active : true },
    (tabs: any[]) => {
      const tabId = tabs[0].id
      render(
        <Provider store={store}>
          <EnrollModal tabId={tabId}/>
        </Provider>,
        window.document.getElementById('root'),
      )
    },
  )
})