import React, { Fragment } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { makeStyles } from '@material-ui/core/styles'; import Divider from '@material-ui/core/Divider'; import IconButton from '@material-ui/core/IconButton'; import List from '@material-ui/core/List'; import ListItem from '@material-ui/core/ListItem'; import ListItemSecondaryAction from '@material-ui/core/ListItemSecondaryAction'; import ListItemText from '@material-ui/core/ListItemText'; import MoreVertIcon from '@material-ui/icons/MoreVert'; import { devicesActions } from './store'; import EditCollectionView from './EditCollectionView'; const useStyles = makeStyles(() => ({ list: { maxHeight: '100%', overflow: 'auto', }, icon: { width: '25px', height: '25px', filter: 'brightness(0) invert(1)', }, })); const GeofenceView = ({ onMenuClick }) => { const classes = useStyles(); const dispatch = useDispatch(); const items = useSelector((state) => Object.values(state.geofences.items)); return ( {items.map((item, index, list) => ( dispatch(devicesActions.select(item))}> onMenuClick(event.currentTarget, item.id)}> {index < list.length - 1 ? : null} ))} ); }; const GeofencesList = () => ( ); export default GeofencesList;