owncast/webroot/js/components/chat/message.js
gingervitis 0062896b7d
chat fixes and optimizations (#431)
* - format messages on didMount instead of didUpdate. will also prevent bad setSTate loops when message is blank;
- convert message.js to functional comp
- prevent extra rerenders in messages and chat with shouldComponentUpdate checks

* revert chat test

* more concise returns;
2020-12-06 21:01:52 -08:00

31 lines
1.1 KiB
JavaScript

import { h } from '/js/web_modules/preact.js';
import htm from '/js/web_modules/htm.js';
const html = htm.bind(h);
import ChatMessageView from './chat-message-view.js';
import { SOCKET_MESSAGE_TYPES } from '../../utils/websocket.js';
export default function Message(props) {
const { message } = props;
const { type } = message;
if (type === SOCKET_MESSAGE_TYPES.CHAT || type === SOCKET_MESSAGE_TYPES.SYSTEM) {
return html`<${ChatMessageView} ...${props} />`;
} else if (type === SOCKET_MESSAGE_TYPES.NAME_CHANGE) {
const { oldName, newName } = message;
return (
html`
<div class="message message-name-change flex items-center justify-start p-3">
<div class="message-content flex flex-row items-center justify-center text-sm w-full">
<div class="text-white text-center opacity-50 overflow-hidden break-words">
<span class="font-bold">${oldName}</span> is now known as <span class="font-bold">${newName}</span>.
</div>
</div>
</div>
`
);
} else {
console.log("Unknown message type:", type);
}
}