components/UserMainBar/UserMainBar.jsx

/**
 * Панель с данными пользователя
 * @module UserMainBar
 * @author Ihor Bielchenko
 * @requires react
 * @requires react#Component
 * @requires react-redux#connect
 * @requires img/location.png
 */

import React, { Component } from 'react';
import { connect } from 'react-redux';
import Location from '../../img/location.png';

/**
 * Панель с данными пользователя
 * @extends Component
 */
class UserMainBar extends Component {

	/**
	 * Render component
	 * @return {Object} jsx object
	 */
	render() {
		return <div className="main-bar teacher-bar">
					<div className="wrap">
						<div className="content">
							<div className="left">
								<div className="round">
									<img src={this.props.user.avatar_150x150} alt="user" />
								</div>
							</div>
							<div className="right">
								<b>{this.props.user.first_name} {this.props.user.last_name}</b>
								<span>{this.props.user.position}</span>
								
								<span className="under">
									{this.props.user.school.name} 
									<img src={Location} alt="location" />
									{this.props.user.city.name}
								</span>
							</div>
						</div>
					</div>
				</div>
	}
}

/**
 * Init redux states
 * @param {Object} state
 * @return {Object}
 */
function mapStateToProps(state) {
	return {
		user: state.user,
	}
}

export default connect(mapStateToProps)(UserMainBar);