'use strict';

var React = require('react');
var ReactDOM = require('react-dom');

class Chat extends React.Component {
    constructor() {
        super();
    }

    render() {
        return <div>
                 <div className='top_menu'>
                   <div className='buttons'>
                     <div className='button close'></div>
                     <div className='button minimize'></div>
                     <div className='button maximize'></div>
                   </div>
                   <div className='title'>Chat</div>
                 </div>
                 <MessagesList />
                 <BottomWrapper />
              </div>
    }
}

class MessagesList extends React.Component {
    constructor() {
        super();
    }

    render() {
        return <ul className='messages'></ul>
    }
}

class BottomWrapper extends React.Component {
    constructor() {
        super();
    }

    render() {
        return <div className='bottom_wrapper clearfix'>
                 <div className='message_input_wrapper'>
                   <input type='text' className='message_input' placeholder='Type your message here...' />
                 </div>
                 <div className='send_message'>
                   <div className='icon'></div>
                   <div className='text'>Send</div>
                 </div>
               </div>
    }
}
@@ -105,34 +105,32 @@
 act.Component %7B%0A
-  
   constructor() 
@@ -123,36 +123,32 @@
 constructor() %7B%0A
-    
     super();%0A   
@@ -138,39 +138,35 @@
 %0A    super();%0A  
- 
- 
 %7D%0A%0A
-  
   render() %7B%0A   
@@ -154,36 +154,32 @@
 %7D%0A%0A  render() %7B%0A
-    
     return %3Cdiv%3E
@@ -184,36 +184,32 @@
 v%3E%0A             
-    
 %3Cdiv className='
@@ -238,44 +238,23 @@
     
-    %3Cdiv className='buttons'%3E%0A      
+%3CTopButtons /%3E%0A
     
@@ -284,22 +284,19 @@
 me='
-button close'%3E
+title'%3EChat
 %3C/di
@@ -315,149 +315,230 @@
     
-        %3Cdiv className='button minimize'%3E%3C/div%3E%0A                     %3Cdiv className='button maximize'%3E%3C/div%3E%0A                  
+%3C/div%3E%0A             %3CMessagesList /%3E%0A             %3CBottomWrapper /%3E%0A           %3C/div%3E%0A  %7D%0A%7D%0A%0Aclass TopButtons extends React.Component %7B%0A  constructor() %7B%0A    super();%0A  %7D%0A%0A  render() %7B%0A    return
  %3C
-/
 div
-%3E%0A      
+ className='buttons'%3E%0A
     
@@ -558,35 +558,38 @@
  className='
-title'%3EChat
+button close'%3E
 %3C/div%3E%0A     
@@ -600,86 +600,99 @@
     
-   
- %3C/div%3E%0A                 %3CMessagesList /%3E%0A                 %3CBottomWrapper /
+%3Cdiv className='button minimize'%3E%3C/div%3E%0A             %3Cdiv className='button maximize'%3E%3C/div
 %3E%0A  
@@ -696,36 +696,31 @@
 %0A           
- 
-  
 %3C/div%3E%0A
-  
   %7D%0A%7D%0A%0Aclass
@@ -751,34 +751,32 @@
 act.Component %7B%0A
-  
   constructor() 
@@ -773,36 +773,32 @@
 tructor() %7B%0A    
-   
- 
 super();%0A    %7D%0A%0A
@@ -786,35 +786,31 @@
    super();%0A
-  
   %7D%0A%0A  
- 
- 
 render() %7B%0A 
@@ -800,36 +800,32 @@
 %7D%0A%0A  render() %7B%0A
-    
     return %3Cul c
@@ -850,18 +850,16 @@
 '%3E%3C/ul%3E%0A
-  
   %7D%0A%7D%0A%0Ac
@@ -903,18 +903,16 @@
 onent %7B%0A
-  
   constr
@@ -917,28 +917,24 @@
 tructor() %7B%0A
-    
     super();
@@ -936,23 +936,19 @@
 er();%0A  
- 
- 
 %7D%0A%0A
-  
   render
@@ -952,20 +952,16 @@
 der() %7B%0A
-    
     retu
@@ -1010,36 +1010,32 @@
 '%3E%0A             
-    
 %3Cdiv className='
@@ -1073,20 +1073,16 @@
         
-   
- 
 %3Cinput t
@@ -1166,36 +1166,32 @@
 /%3E%0A             
-    
 %3C/div%3E%0A         
@@ -1186,36 +1186,32 @@
 v%3E%0A             
-  
-  
 %3Cdiv className='
@@ -1232,36 +1232,32 @@
 %0A               
-    
 %3Cdiv className='
@@ -1276,36 +1276,32 @@
 %0A               
- 
-   
 %3Cdiv className='
@@ -1326,39 +1326,31 @@
             
-    
 %3C/div%3E%0A
-    
            %3C
@@ -1355,15 +1355,13 @@
  %3C/div%3E%0A
-  
   %7D%0A%7D

Fix indents