import {List, ListItem} from "@mui/material";

export default function NicknameList({nicknames}: {nicknames: string[]|undefined}){
    if (!nicknames){
        return (<></>)
    }
    if (nicknames.length > 0){
        return (
            <>
                <p className="report-content-header">Nicknames:</p>
                <List>
                    {nicknames.map((item) => {
                        return <ListItem className="report-nickname">{item}</ListItem>
                    })}
                </List>
            </>
        )
    } else {
        return (<></>)
    }
}