<commit_before>import React, { Component, PropTypes } from 'react'
import { bindActionCreators } from 'redux'
import { connect } from 'react-redux'
import RadioGroup from 'react-radio-group'

import InputGroup from '../components/InputGroup'
import SaveButton from '../components/SaveButton'
import { SettingsActions } from './store/settings'
import log4js from 'log4js'

const logger = log4js.getLogger('account/ApiSettingsPage.js')

function mapStateToProps(state) {
  return {
    api: state.settings.api
  }
}

function mapDispatchToProps(dispatch) {
  return bindActionCreators(SettingsActions, dispatch)
}

class ApiSettingsPage extends Component {
  static propTypes = {
    api: PropTypes.object.isRequired,
    updateApi: PropTypes.func.isRequired,
    resetApi: PropTypes.func.isRequired
  }

  constructor(props) {
    super(props)

    this.state = {
      api: this.props.api
    }

    this.onValueChange = this.onValueChange.bind(this)
    this.updateApi = this.updateApi.bind(this)
    this.resetApi = this.resetApi.bind(this)
    this.registerProtocolHandler = this.registerProtocolHandler.bind(this)
  }

  componentWillReceiveProps(nextProps) {
    logger.trace('componentWillReceiveProps')
    this.setState({
      api: nextProps.api
    })
  }

  onValueChange(event) {
    logger.trace('onValueChange')
    const api = this.state.api
    const newValue = event.target.value
    const key = event.target.name
    logger.debug(`onValueChange: key: ${key} newValue: ${newValue}`)
    api[key] = newValue
    this.setState({ api })
  }


  updateApi() {
    logger.trace('updateApi')
    const api = this.state.api
    this.props.updateApi(api)
  }

  resetApi() {
    logger.trace('resetApi')
    this.props.resetApi(this.props.api)
  }



  registerProtocolHandler() {
    window.navigator.registerProtocolHandler(
      'web+blockstack',
      `${location.origin}/auth?authRequest=%s`,
      'Blockstack handler'
    )
  }

  render() {
    return (
      <div className="col-md-9">
        <div>
          <h4>Authentication</h4>

          <p>
            <button
              onClick={this.registerProtocolHandler}
              className="btn btn-sm btn-outline-primary"
            >
              Allow App Logins
            </button>
          </p>

          <hr />

          <RadioGroup
            name="hostedDataLocation"
            selectedValue={this.state.api.hostedDataLocation}
            onChange={this.onHostedDataValueChange}>
            {Radio => (
              <div><commit_msg>remove potentially confusing enable app login button<commit_after>import React, { Component, PropTypes } from 'react'
import { bindActionCreators } from 'redux'
import { connect } from 'react-redux'
import RadioGroup from 'react-radio-group'

import InputGroup from '../components/InputGroup'
import SaveButton from '../components/SaveButton'
import { SettingsActions } from './store/settings'
import log4js from 'log4js'

const logger = log4js.getLogger('account/ApiSettingsPage.js')

function mapStateToProps(state) {
  return {
    api: state.settings.api
  }
}

function mapDispatchToProps(dispatch) {
  return bindActionCreators(SettingsActions, dispatch)
}

class ApiSettingsPage extends Component {
  static propTypes = {
    api: PropTypes.object.isRequired,
    updateApi: PropTypes.func.isRequired,
    resetApi: PropTypes.func.isRequired
  }

  constructor(props) {
    super(props)

    this.state = {
      api: this.props.api
    }

    this.onValueChange = this.onValueChange.bind(this)
    this.updateApi = this.updateApi.bind(this)
    this.resetApi = this.resetApi.bind(this)
    this.registerProtocolHandler = this.registerProtocolHandler.bind(this)
  }

  componentWillReceiveProps(nextProps) {
    logger.trace('componentWillReceiveProps')
    this.setState({
      api: nextProps.api
    })
  }

  onValueChange(event) {
    logger.trace('onValueChange')
    const api = this.state.api
    const newValue = event.target.value
    const key = event.target.name
    logger.debug(`onValueChange: key: ${key} newValue: ${newValue}`)
    api[key] = newValue
    this.setState({ api })
  }


  updateApi() {
    logger.trace('updateApi')
    const api = this.state.api
    this.props.updateApi(api)
  }

  resetApi() {
    logger.trace('resetApi')
    this.props.resetApi(this.props.api)
  }



  registerProtocolHandler() {
    window.navigator.registerProtocolHandler(
      'web+blockstack',
      `${location.origin}/auth?authRequest=%s`,
      'Blockstack handler'
    )
  }

  render() {
    return (
      <div className="col-md-9">
        <div>
          <RadioGroup
            name="hostedDataLocation"
            selectedValue={this.state.api.hostedDataLocation}
            onChange={this.onHostedDataValueChange}>
            {Radio => (
              <div>
{'fraction_non_alphanumeric': 0.11583973427444468, 'fraction_numerical': 0.002075980900975711, 'mean_word_length': 2.9851116625310175, 'pattern_counts': {'":': 0, '<': 18, '<?xml version=': 0, '>': 20, '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': '3724843', 'n_tokens_mistral': 1454, 'n_tokens_neox': 1441, 'n_words': 264}