import * as React from 'react';
import ListItem from '@mui/material/ListItem';
import ListItemText from '@mui/material/ListItemText';
import Typography from '@mui/material/Typography';
import SportsTennisIcon from '@mui/icons-material/SportsTennis';
import { ListItemIcon } from '@mui/material';

export default function ListSuggestedMatch() {
    return (<ListItem alignItems="flex-start">
        <ListItemIcon>
            <SportsTennisIcon />
        </ListItemIcon>
        <ListItemText
            primary="Tennis - King of The Court"
            secondary={
                <React.Fragment>
                    <Typography
                        sx={{ display: 'inline' }}
                        component="span"
                        variant="body2"
                        color="text.primary"
                    >
                        12:30PM - 123 Alphabet St. Toronto ON.
                    </Typography>
                    {" — John Smith, Alfred Baker, and Samantha Wright"}
                </React.Fragment>
            }
        />
    </ListItem>);
}