<commit_before>import React, { Component } from 'react'
import ReactDOM from 'react-dom'
import PropTypes from '../lib/PropTypes'
import Button from './Button'
import Input from './Input'
import MessageList from './MessageList'

export default class WebchatConversation extends Component {
  static propTypes = {
    adviser: PropTypes.shape({
      name: PropTypes.string.isRequired,
      image: PropTypes.string.isRequired
    }).isRequired,
    currentMessage: PropTypes.string.isRequired,
    handleEndChat: PropTypes.func.isRequired,
    handleMessageChange: PropTypes.func.isRequired,
    handleMessageSubmit: PropTypes.func.isRequired,
    isAgent: PropTypes.bool.isRequired,
    messages: PropTypes.messages.isRequired,
    name: PropTypes.string.isRequired,
    userIsTyping: PropTypes.string.isRequired
  }

  componentDidMount () {
    const isDesktop = window.innerWidth > 700
    if (isDesktop) {
      ReactDOM.findDOMNode(this.refs.messageInput).focus()
    }
  }

  render () {
    const height = (this.props.isAgent) ? 'calc(100% - 5rem - 0.5rem)' : 'calc(100% - 3rem - 0.5rem)'
    const buttons = (this.props.isAgent)
      ? <div className="mt3 fl">
        <Button onClick={this.props.handleEndChat}>End chat</Button>
      </div>
      : null
    return <div className="h-100">
      <div style={{ height }}>
        <MessageList
          adviser={this.props.adviser}
          isAgent={this.props.isAgent}
          messages={this.props.messages}
          name={this.props.name}
          userIsTyping={this.props.userIsTyping}
        />
      </div>

      <div className="flex mt2">
        <div className="w-75 pr1">
          <Input
            handleChange={this.props.handleMessageChange}
            handleSubmit={this.props.handleMessageSubmit}
            ref="messageInput"
            type="text"
            value={this.props.currentMessage}
          /><commit_msg>Add label for message input field in chat<commit_after>import React, { Component } from 'react'
import ReactDOM from 'react-dom'
import PropTypes from '../lib/PropTypes'
import Button from './Button'
import Input from './Input'
import Label from './Label'
import MessageList from './MessageList'

export default class WebchatConversation extends Component {
  static propTypes = {
    adviser: PropTypes.shape({
      name: PropTypes.string.isRequired,
      image: PropTypes.string.isRequired
    }).isRequired,
    currentMessage: PropTypes.string.isRequired,
    handleEndChat: PropTypes.func.isRequired,
    handleMessageChange: PropTypes.func.isRequired,
    handleMessageSubmit: PropTypes.func.isRequired,
    isAgent: PropTypes.bool.isRequired,
    messages: PropTypes.messages.isRequired,
    name: PropTypes.string.isRequired,
    userIsTyping: PropTypes.string.isRequired
  }

  componentDidMount () {
    const isDesktop = window.innerWidth > 700
    if (isDesktop) {
      ReactDOM.findDOMNode(this.refs.messageInput).focus()
    }
  }

  render () {
    const height = (this.props.isAgent) ? 'calc(100% - 5rem - 0.5rem)' : 'calc(100% - 3rem - 0.5rem)'
    const buttons = (this.props.isAgent)
      ? <div className="mt3 fl">
        <Button onClick={this.props.handleEndChat}>End chat</Button>
      </div>
      : null
    return <div className="h-100">
      <div style={{ height }}>
        <MessageList
          adviser={this.props.adviser}
          isAgent={this.props.isAgent}
          messages={this.props.messages}
          name={this.props.name}
          userIsTyping={this.props.userIsTyping}
        />
      </div>

      <div className="flex mt2">
        <div className="w-75 pr1">
          <div className="clip">
            <Label htmlFor="webchat-input-message">Message</Label>
          </div>
          <Input
            handleChange={this.props.handleMessageChange}
            handleSubmit={this.props.handleMessageSubmit}
            id="webchat-input-message"
            ref="messageInput"
            type="text"
            value={this.props.currentMessage}
          />
{'fraction_non_alphanumeric': 0.12008950770760815, 'fraction_numerical': 0.011437095972153158, 'mean_word_length': 2.7319109461966606, 'pattern_counts': {'":': 0, '<': 29, '<?xml version=': 0, '>': 31, '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': '395480', 'n_tokens_mistral': 1179, 'n_tokens_neox': 1170, 'n_words': 237}