react-logo/frontend/src/components/message-list.js

23 lines
734 B
JavaScript

export function MessageList({ messages }) {
if (!Array.isArray(messages)) return null;
return (
<div className="columns" style={{marginTop:"1em"}}>
<div className="column is-4 is-offset-4">
<div className="messages">
{
messages.map((m, i) => {
return (
<div key={`message-${i}`} className={`message is-${m.type}`}>
<div className="message-body">
{m.text}
</div>
</div>
)
})
}
</div>
</div>
</div>
);
}