import React from 'react';

class Messenger extends React.Component {
  render() {
    return (
      <article className="c-messenger">
        <button className="c-messenger__attachment" onClick={this._toggleAttachment.bind(this)}>
          <i className="icon-add-circle-outline"></i>
        </button>

        <textarea placeholder="Share knowledge"></textarea>

        <button className="c-messenger__submit">
          <i className="icon-send"></i>
        </button>
      </article>
    );
  }

  _toggleAttachment() {
    console.log('set class to: state-active');
  }
}

export default Messenger;

@@ -69,18 +69,251 @@
 %7B%0A  
-render() %7B
+constructor(props, context) %7B%0A    super(props, context);%0A%0A    this.state = %7B%0A      showAttachment: false%0A    %7D;%0A  %7D%0A%0A  render() %7B%0A    let messengerAttachmentClass = %60c-messenger__attachment $%7Bthis.state.showAttachment ? 'state-active' : ''%7D%60;%0A
 %0A   
@@ -380,35 +380,33 @@
 utton className=
-%22c-
+%7B
 messenger__attac
@@ -390,35 +390,33 @@
 sName=%7Bmessenger
-__a
+A
 ttachment%22 onCli
@@ -408,17 +408,22 @@
 tachment
-%22
+Class%7D
  onClick
@@ -762,48 +762,78 @@
     
-console.log('set class to: state-active'
+this.setState(%7B%0A      showAttachment: !this.state.showAttachment%0A    %7D
 );%0A 

add attachment state to messenger component