<commit_before>import React, { Component } from 'react'
import { translate } from '../lib/I18n'

import styles from '../styles/alerter.styl'
import classNames from 'classnames'

class Alerter extends Component {

  constructor () {
    super()
    this.state = {
      hidden: true,
      reloadTimer: 10
    }
  }

  show () {
    this.setState({ hidden: false })
    this.runCountdown()
  }

  // Keep the reload timer running
  runCountdown () {
    setTimeout(this.countdown.bind(this), 1000)
  }

  // Update the reload timer
  countdown () {
    let { reloadTimer } = this.state
    reloadTimer--
    if (reloadTimer) {
      this.setState({ reloadTimer: reloadTimer })
      this.runCountdown()
    }
  }

  componentDidMount () {
    // Delay to trigger CSS transition. Totally open for a better way to
    // achieve this.
    setTimeout(() => {
      this.show()
    }, 10)
  }

  componentWillReceiveProps (newProps) {
    const { error, reload } = newProps
    const { reloadTimer } = this.state
    if (error && error.critical) {
      setTimeout(() =>
        (typeof reload === 'function') && reload()
      , reloadTimer * 1000)
    }
  }

  render ({t, error, reload}) {
    const { hidden, reloadTimer } = this.state
    return <div className={classNames(styles['fil-alerter'], hidden ? styles['coz-alerter--hidden'] : '')}>
      {error && error.critical &&
        <div className={styles['coz-overlay']} />
      }
      {error && error.message &&
        <div className={styles['coz-alerter']}>
          <div className={classNames(styles['coz-alert'], styles['coz-alert--error'])}>
            <p>{t(error.message)}</p>
            {error.critical &&
              <p>{t('alert.critical_will_reload', { smart_count: reloadTimer })}</p>
            }
            <a onClick={reload} className={classNames('coz-btn', styles['coz-btn'])}>
              {t('alert.button.reload')}
            </a>
          </div>
        </div>
      }
    </div>
  }
}

export default translate()(Alerter)<commit_msg>[feat] update CSS classes for alert button, in adequation with Cozy UI<commit_after>import React, { Component } from 'react'
import { translate } from '../lib/I18n'

import styles from '../styles/alerter.styl'
import classNames from 'classnames'

class Alerter extends Component {

  constructor () {
    super()
    this.state = {
      hidden: true,
      reloadTimer: 10
    }
  }

  show () {
    this.setState({ hidden: false })
    this.runCountdown()
  }

  // Keep the reload timer running
  runCountdown () {
    setTimeout(this.countdown.bind(this), 1000)
  }

  // Update the reload timer
  countdown () {
    let { reloadTimer } = this.state
    reloadTimer--
    if (reloadTimer) {
      this.setState({ reloadTimer: reloadTimer })
      this.runCountdown()
    }
  }

  componentDidMount () {
    // Delay to trigger CSS transition. Totally open for a better way to
    // achieve this.
    setTimeout(() => {
      this.show()
    }, 10)
  }

  componentWillReceiveProps (newProps) {
    const { error, reload } = newProps
    const { reloadTimer } = this.state
    if (error && error.critical) {
      setTimeout(() =>
        (typeof reload === 'function') && reload()
      , reloadTimer * 1000)
    }
  }

  render ({t, error, reload}) {
    const { hidden, reloadTimer } = this.state
    return <div className={classNames(styles['fil-alerter'], hidden ? styles['coz-alerter--hidden'] : '')}>
      {error && error.critical &&
        <div className={styles['coz-overlay']} />
      }
      {error && error.message &&
        <div className={styles['coz-alerter']}>
          <div className={classNames(styles['coz-alert'], styles['coz-alert--error'])}>
            <p>{t(error.message)}</p>
            {error.critical &&
              <p>{t('alert.critical_will_reload', { smart_count: reloadTimer })}</p>
            }
            <a onClick={reload} className={classNames('coz-btn', 'coz-btn--alert-error')}>
              {t('alert.button.reload')}
            </a>
          </div>
        </div>
      }
    </div>
  }
}

export default translate()(Alerter)
{'fraction_non_alphanumeric': 0.155458089668616, 'fraction_numerical': 0.00682261208576998, 'mean_word_length': 2.3953680727874276, 'pattern_counts': {'":': 0, '<': 29, '<?xml version=': 0, '>': 33, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, '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': '7190628', 'n_tokens_mistral': 1316, 'n_tokens_neox': 1245, 'n_words': 280}