forked from notnull/ircz
notnull
830a61433b
backend - namespace => room - add listener 'get all clients' frontend - remove variables from initalState - create components Sidebar, TopBar, Messages, MessageEntryForm
38 lines
1.3 KiB
JavaScript
38 lines
1.3 KiB
JavaScript
import React from 'react'
|
|
import MessageEntryForm from './MessageEntryForm'
|
|
const Messages = props => {
|
|
const { title, namespace, messages, user, submitMessage } = props
|
|
return (
|
|
<div className="bg-secondary d-flex flex-column flex-grow-1 px-2 pb-4">
|
|
{/*Main Section Header*/}
|
|
<div className="d-flex justify-content-between flex-wrap flex-md-nowrap pt-3 pb-2 mb-3 border-bottom">
|
|
<h4 className="mr-auto ml-3">
|
|
{title} {namespace}
|
|
</h4>
|
|
</div>
|
|
{/*Main Section Content*/}
|
|
<div className="d-flex flex-column border border-secondary flex-grow-1">
|
|
<div className="bg-dark flex-grow-1 p-2 text-light">
|
|
{messages
|
|
.filter(
|
|
m =>
|
|
(m.to[0] === '#' && m.to === namespace) ||
|
|
(m.to[0] !== '#' && m.from === namespace) ||
|
|
(m.from === user.socketId && m.to === namespace)
|
|
)
|
|
.map(m => (
|
|
<div className="row d-flex justify-content-between" key={m.id}>
|
|
<div className="col">{m.date}</div>
|
|
<div className="col">{m.nick}</div>
|
|
<div>{m.text}</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
<MessageEntryForm submitMessage={submitMessage} user={user} />
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Messages
|