import React from 'react';
import {List, Button, Icon} from 'semantic-ui-react';

const DeviceListItem = ({i18n, idx, data, delModbus, editModbus, showDev, selectDevToShow}) =>{

	return (
		<List.Item active={data.uid == showDev}>
			<Icon style={{cursor: 'pointer'}} name="trash" title="Delete" onClick={()=>{delModbus(data.uid || '')}}/>
			<Icon style={{cursor: 'pointer'}} name="write" title="Edit" onClick={()=>{editModbus(1, data)}}/>
			<List.Content style={{cursor: 'pointer'}} onClick={() => {
						selectDevToShow(data.uid);
					}}>
				<List.Header>
					{data.name}
				</List.Header>
				Node: {data.node} / Type: {data.type}
			</List.Content>
		</List.Item>
	)
}

export default DeviceListItem;