<commit_before>import query from 'query-string'
import axios from 'axios'
import Container from './container'
import { getDevToolsState, setDevToolsState } from './devtools'

const { WebSocket, location, history } = window

export default Container({
  port: process.env.PORT,
  host: process.env.HOST,
  wsPort: process.env.WS_PORT,

  componentWillMount () {
    const client = new WebSocket(`ws://0.0.0.0:${this.wsPort}/`, 'echo-protocol')

    client.onopen = () => {
      const params = query.parse(location.search)

      if (params.hsr) {
        const ts = params.hsr
        delete params.hsr

        const newParams = query.stringify(params)
        const newUrl = location.href.substring(0, location.href.indexOf('?')) +
          (newParams.length ? `?${newParams}` : '')

        history.replaceState(null, null, newUrl)
        axios.get(`http://${this.host}:${this.port}/__hsr__/${ts}`).then((res) => {
          setDevToolsState(res.data)
          console.log('HSR data loaded!')
        })
      }
      console.log('HSR is ready!')
    }

    client.onerror = () => {
      console.log('HSR Connection Error!')
    }

    client.onmessage = (e) => {
      const payload = JSON.parse(e.data)

      if (payload.type === 'refresh') {
        const state = getDevToolsState()
        axios.post(`http://${this.host}:${this.port}/__hsr__`, { state }).then((res) => {
          const params = query.parse(location.search)
          params.hsr = res.data.ts
          location.search = query.stringify(params)
        }).catch((err) => console.log(err))
      }

      if (payload.type === 'cssRefresh'){
        axios.get(`/app.css`).then((res) => {
          const existingCssStyles = document.getElementById('__HMR_STYLES__')
          existingCssStyles && existingCssStyles.remove()
          const newCssStyles = document.createElement('style')
          newCssStyles.id = "__HMR_STYLES__"
          newCssStyles.innerHTML = res.data
          document.head.appendChild(newCssStyles)
        }).catch((err) => console.log(err))
      }
    }

    client.onclose = () => {
      console.log('HSR Connection Closed')
    }
  },

  render () {
    return <div />
  },
})<commit_msg>cssRefresh now replaces app.css as well<commit_after>import query from 'query-string'
import axios from 'axios'
import Container from './container'
import { getDevToolsState, setDevToolsState } from './devtools'

const { WebSocket, location, history } = window

export default Container({
  port: process.env.PORT,
  host: process.env.HOST,
  wsPort: process.env.WS_PORT,

  componentWillMount () {
    const client = new WebSocket(`ws://0.0.0.0:${this.wsPort}/`, 'echo-protocol')

    client.onopen = () => {
      const params = query.parse(location.search)

      if (params.hsr) {
        const ts = params.hsr
        delete params.hsr

        const newParams = query.stringify(params)
        const newUrl = location.href.substring(0, location.href.indexOf('?')) +
          (newParams.length ? `?${newParams}` : '')

        history.replaceState(null, null, newUrl)
        axios.get(`http://${this.host}:${this.port}/__hsr__/${ts}`).then((res) => {
          setDevToolsState(res.data)
          console.log('HSR data loaded!')
        }).catch((err) => console.error(err))
      }
      console.log('HSR is ready!')
    }

    client.onerror = () => {
      console.log('HSR Connection Error!')
    }

    client.onmessage = (e) => {
      const payload = JSON.parse(e.data)

      if (payload.type === 'refresh') {
        const state = getDevToolsState()
        axios.post(`http://${this.host}:${this.port}/__hsr__`, { state }).then((res) => {
          const params = query.parse(location.search)
          params.hsr = res.data.ts
          location.search = query.stringify(params)
        }).catch((err) => console.error(err))
      }

      if (payload.type === 'cssRefresh'){
        axios.get(`/app.css`).then((res) => {
          const existingLinkTags = [].slice.call(document.getElementsByTagName('link'))
          const foundLinkTag = existingLinkTags.filter((d) => {
            const linkSrc =  d.href.replace(location.origin, '')
            return linkSrc === '/app.css' || linkSrc === 'app.css'
          })[0]
          foundLinkTag && foundLinkTag.remove()
          const existingCssStyles = document.getElementById('__HMR_STYLES__')
          existingCssStyles && existingCssStyles.remove()
          const newCssStyles = document.createElement('style')
          newCssStyles.id = "__HMR_STYLES__"
          newCssStyles.innerHTML = res.data
          document.head.appendChild(newCssStyles)
        }).catch((err) => console.error(err))
      }
    }

    client.onclose = () => {
      console.log('HSR Connection Closed')
    }
  },

  render () {
    return <div />
  },
})
{'fraction_non_alphanumeric': 0.15797131573477446, 'fraction_numerical': 0.0022864269382664726, 'mean_word_length': 2.553914327917282, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 25, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 2, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6838094', 'n_tokens_mistral': 1497, 'n_tokens_neox': 1493, 'n_words': 266}