import React, { Component } from 'react';

import { Table } from 'lib/components';
import icons from 'constants/icons';


class CustomerList extends Table {
	
	renderItem(item, index) {
		return (
			<div key={ index } className="flex-list-row">
				<div className="content">
					<div className="list-row-data">
			            <div className="record-type">
			                <div className="icon">
			                    { icons.customers }
			                </div>
			            </div>
						<div className="main">
							<div className="main-value">
								{ item.name }
							</div>
							<div className="additional-info">
								{ item.address ? item.address.split("\n").join(", ") : null }
							</div>
						</div>
					</div>
				</div>
				{ this.props.onDetailClick ? (
					<div className="actions">
						<button className="icon" onClick={ ()=> this.props.onDetailClick(item.id, item) }>{icons.leftMenu}</button>
					</div>
				) : null }
			</div>
		);
	}

}


export default CustomerList;