Указание отправителя чата на основе текущего входа в систему

Question

В нашем приложении есть функция чата, которая позволяет отправлять сообщения нескольким пользователям. Моя проблема в том, что пользователь может запутаться в сообщениях, отображаемых в окне чата, поскольку он отображает только 1 цвет фона. Идея состоит в том, что я хочу различать получателя и отправителя по цвету фона.

Вот мой код ListItem:

renderMessages = () => {
        var naming;
        return this.state.messages.map(message => (

            <ListItem>

                <ListItemText className="chatList"
                    style={{wordBreak: "break-word", backgroundColor: "#BC3F5C", borderRadius: "10px", width: "10px", padding: "5px", fontColor:'#ffffff'}}
                    primary={ message.names+": "+message.text}
                    secondary={message.createdAt}

                />
            </ListItem>
        ))


    }

    render() {
        return (
            <MuiThemeProvider theme={theme}>
                <div style={mainCont}>
                    <label style={labelStyle} className="labelStyle">&nbsp;&nbsp;&nbsp;Chat</label>
                    <div className="App" >

                        <ScrollToBottom className={ ROOT_CSS }>
                            <List>{this.renderMessages()}</List>
                        </ScrollToBottom>
                        <TextField className="txtFieldStyle"
                            autoFocus={true}
                            multiline={true}
                            rowsMax={1}
                            placeholder="Type something.."
                            onChange={event => this.setState({ text: event.target.value })}
                            value={this.state.text}
                            onKeyPress={this.onSubmit}
                            style={{ width: "350px", overflow: "hidden", marginLeft: "15px", fontSize: '63px', paddingBottom: '-50px', marginBottom: '-10px' }}
                        />
                        <span ref={el => (this.bottomSpan = el)} />
                    </div>
                </div>
            </MuiThemeProvider>
        )
    }
}

export default App;