Элемент списка в Reactjs

Я создаю элемент списка в React, но не понимаю, почему он не отображается. Должен ли я делать компонент класса?

List.js

import React, { Component } from 'react';
import { withStyles } from 'material-ui/styles';


const styles = {
  root: {
      display: 'flex',
      backgroundColor: "whitesmoke",
      width: '100%',
  },
}

function ListSeances(props) {

    const { classes } = props;

    const list = [1,2,3,4,5,6];

    const listItems = list.map((item) =>{
        <li>{ item }</li>
    });


      return (
         <div className = {classes.root}>
           <ul>{ listItems }</ul>
         </div>
      )
  }

export default withStyles (styles)(ListSeances);

MapAppBar

class MapAppBar extends React.Component {

  render() {

    const { classes, animation } = this.props

    return(
  <div className = {classes.root}>
    <App_Bar className = {classes.appBar} position = "fixed">
      <Toolbar>
        <Typography variant = "title" color = "inherit">
        </Typography>
      </Toolbar>
      <TextFields/>
        <DatePicker/>
        <DatePicker2/>
      <ListSeances/>
    </App_Bar>
  </div>
  )
  }
}

Мой список должен появиться в MapAppBar.js. Я вставил import ListSeances from './List';.