sort components into widgets and views

src/widgets/side-navbar.jsx

@@ -0,0 +1,29 @@
+import React from 'react';
+
+import LetterTile from './letter-tile.jsx';
+import MenuCancel from './menu-cancel.jsx';
+import MenuContacts from './menu-contacts.jsx';
+import MenuStart from './menu-start.jsx';
+
+export default class SideNavbar extends React.PureComponent {
+  render() {
+    return (
+        <div id="side-caption-panel" className="caption-panel">
+          <div id="self-avatar" className="avatar-box">
+            <LetterTile
+              avatar={this.props.avatar}
+              topic={this.props.myUserId}
+              title={this.props.title} />
+          </div>
+          <div id="sidepanel-title" className="panel-title">{this.props.title}</div>
+          {this.props.state === 'login' ?
+              <MenuStart onSignUp={this.props.onSignUp} onSettings={this.props.onSettings} /> :
+            this.props.state === 'contacts' ?
+              <MenuContacts onNewTopic={this.props.onNewTopic} onSettings={this.props.onSettings} /> :
+            null}
+          {this.props.onCancel ?
+             <MenuCancel onCancel={this.props.onCancel} /> : null}
+        </div>
+    );
+  }
+};