github.com/martinohmann/rfoutlet@v1.2.1-0.20220707195255-8a66aa411105/web/src/components/List.js (about) 1 import React from 'react'; 2 import { makeStyles } from '@material-ui/core/styles'; 3 import MaterialList from '@material-ui/core/List'; 4 import MaterialListItem from '@material-ui/core/ListItem'; 5 import MaterialListItemText from '@material-ui/core/ListItemText'; 6 import Divider from '@material-ui/core/Divider'; 7 8 const useStyles = makeStyles(theme => ({ 9 container: { 10 marginTop: 64, 11 paddingTop: 0, 12 }, 13 noGroupsText: { 14 textAlign: 'center', 15 }, 16 })); 17 18 export function List(props) { 19 const classes = useStyles(); 20 21 return ( 22 <MaterialList 23 component="nav" 24 className={classes.container} 25 {...props} 26 /> 27 ); 28 } 29 30 export function ListItem(props) { 31 return ( 32 <> 33 <MaterialListItem {...props} /> 34 <Divider /> 35 </> 36 ); 37 } 38 39 export function NoItemsListItem(props) { 40 const classes = useStyles(); 41 42 return ( 43 <MaterialListItem> 44 <MaterialListItemText className={classes.noGroupsText} {...props} /> 45 </MaterialListItem> 46 ); 47 }