Refactored Messaging as a part of BOD-14. Breaking changes remain.

client/src/components/chat-conversation/chat-conversation.component.jsx

@@ -1,27 +1,27 @@
 import { Badge, Card } from "antd";
 import React from "react";
-import ChatConversationClosedComponent from "./chat-conversation.closed.component";
-import ChatConversationOpenComponent from "./chat-conversation.open.component";
+import ChatMessageListComponent from "../chat-messages-list/chat-message-list.component";
+import ChatSendMessage from "../chat-send-message/chat-send-message.component";
+import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component.jsx";
+import AlertComponent from "../alert/alert.component";
 
 export default function ChatConversationComponent({
-  conversation,
   messages,
   subState,
-  unreadCount
+  conversation,
+  unreadCount,
 }) {
+  const [loading, error] = subState;
+
+  if (loading) return <LoadingSkeleton />;
+  if (error) return <AlertComponent message={error.message} type='error' />;
+
   return (
     <div className='chat-conversation'>
       <Badge count={unreadCount}>
+        <ChatSendMessage conversation={conversation} />
         <Card size='small'>
-          {conversation.open ? (
-            <ChatConversationOpenComponent
-              messages={messages}
-              conversation={conversation}
-              subState={subState}
-            />
-          ) : (
-            <ChatConversationClosedComponent conversation={conversation} />
-          )}
+          <ChatMessageListComponent messages={messages} />
         </Card>
       </Badge>
     </div>