import forEach from 'lodash/forEach'
import isString from 'lodash/isString'
import frLocaleData from 'react-intl/locale-data/fr'
import {
  connectStore
} from 'utils'
import React, {
  Component,
  PropTypes
} from 'react'
import {
  addLocaleData,
  FormattedMessage,
  IntlProvider as IntlProvider_
} from 'react-intl'

// ===================================================================

const messages = {
  aboutPage: {
    defaultMessage: 'About'
  },
  homePage: {
    defaultMessage: 'Home'
  },

  usernameLabel: {
    defaultMessage: 'Username:'
  },
  passwordLabel: {
    defaultMessage: 'Password:'
  },
  signInButton: {
    defaultMessage: 'Sign in'
  }
}
forEach(messages, (message, id) => {
  if (isString(message)) {
    messages[id] = {
      id,
      defaultMessage: message
    }
  } else if (!message.id) {
    message.id = id
  }
})
const localizedMessages = {}

addLocaleData(frLocaleData)
localizedMessages.fr = {
  aboutPage: 'À propos',
  homePage: 'Accueil',
  usernameLabel: 'Nom :',
  passwordLabel: 'Mot de passe :',
  signInButton: 'Connexion'
}

// ===================================================================

export default (messageId, values = {}) => <FormattedMessage
 {...messages[messageId]}
 values={values}
/>

@connectStore([ 'lang' ])
export class IntlProvider extends Component {
  static propTypes = {
    children: PropTypes.node.isRequired,
    lang: PropTypes.string.isRequired
  }

  render () {
    const { lang, children } = this.props
    return <IntlProvider_
      locale={lang}
      messages={localizedMessages[lang]}
    >
     {children}
    </IntlProvider_>
  }
}

import forEach from 'lodash/forEach'
import isString from 'lodash/isString'
import frLocaleData from 'react-intl/locale-data/fr'
import {
  connectStore
} from 'utils'
import React, {
  Component,
  PropTypes
} from 'react'
import {
  addLocaleData,
  FormattedMessage,
  IntlProvider as IntlProvider_
} from 'react-intl'

// ===================================================================

const messages = {
  aboutPage: {
    defaultMessage: 'About'
  },
  homePage: {
    defaultMessage: 'Home'
  },

  usernameLabel: {
    defaultMessage: 'Username:'
  },
  passwordLabel: {
    defaultMessage: 'Password:'
  },
  signInButton: {
    defaultMessage: 'Sign in'
  }
}
forEach(messages, (message, id) => {
  if (isString(message)) {
    messages[id] = {
      id,
      defaultMessage: message
    }
  } else if (!message.id) {
    message.id = id
  }
})
const localizedMessages = {}

addLocaleData(frLocaleData)
localizedMessages.fr = {
  aboutPage: 'À propos',
  homePage: 'Accueil',
  usernameLabel: 'Nom :',
  passwordLabel: 'Mot de passe :',
  signInButton: 'Connexion'
}

// ===================================================================

export default (messageId, values = {}) => <FormattedMessage
  {...messages[messageId]}
  values={values}
/>

@connectStore([ 'lang' ])
export class IntlProvider extends Component {
  static propTypes = {
    children: PropTypes.node.isRequired,
    lang: PropTypes.string.isRequired
  }

  render () {
    const { lang, children } = this.props
    return <IntlProvider_
      locale={lang}
      messages={localizedMessages[lang]}
    >
     {children}
    </IntlProvider_>
  }
}

Fix indent.