Fill out some more components + add application state enums

web/components/chat/ChatUserMessage.tsx

@@ -2,8 +2,21 @@ import { ChatMessage } from '../../interfaces/chat-message.model';
 
 interface Props {
   message: ChatMessage;
+  showModeratorMenu: boolean;
 }
 
 export default function ChatUserMessage(props: Props) {
-  return <div>Component goes here</div>;
+  const { message, showModeratorMenu } = props;
+  const { body, user, timestamp } = message;
+  const { displayName, displayColor } = user;
+
+  // TODO: Convert displayColor (a hue) to a usable color.
+
+  return (
+    <div>
+      <div>{displayName}</div>
+      <div>{body}</div>
+      {showModeratorMenu && <div>Moderator menu</div>}
+    </div>
+  );
 }