UI Work on chats

client/src/redux/messaging/messaging.actions.js

@@ -9,3 +9,13 @@ export const toggleConversationVisible = conversationId => ({
   type: MessagingActionTypes.TOGGLE_CONVERSATION_VISIBLE,
   payload: conversationId
 });
+
+export const openConversation = phone => ({
+  type: MessagingActionTypes.OPEN_CONVERSATION,
+  payload: phone
+});
+
+export const closeConversation = phone => ({
+  type: MessagingActionTypes.CLOSE_CONVERSATION,
+  payload: phone
+});

client/src/redux/messaging/messaging.reducer.js

@@ -3,8 +3,8 @@ import MessagingActionTypes from "./messaging.types";
 const INITIAL_STATE = {
   visible: false,
   conversations: [
-    { id: 1, phone: "6049992002", open: false },
-    { id: 2, phone: "6049992991", open: false }
+    { phone: "6049992002", open: false },
+    { phone: "6049992991", open: false }
   ]
 };
 
@@ -21,20 +21,33 @@ const messagingReducer = (state = INITIAL_STATE, action) => {
         visible: true
       };
     case MessagingActionTypes.OPEN_CONVERSATION:
-      return {
-        ...state,
-        conversations: [...state.conversations, action.payload]
-      };
+      if (state.conversations.find(c => c.phone === action.payload))
+        return {
+          ...state,
+          conversations: state.conversations.map(c =>
+            c.phone === action.payload ? { ...c, open: true } : c
+          )
+        };
+      else
+        return {
+          ...state,
+          conversations: [
+            ...state.conversations,
+            { phone: action.payload, open: true }
+          ]
+        };
     case MessagingActionTypes.CLOSE_CONVERSATION:
       return {
         ...state,
-        conversations: state.conversations.filter(c => c !== action.paylod)
+        conversations: state.conversations.filter(
+          c => c.phone !== action.payload
+        )
       };
     case MessagingActionTypes.TOGGLE_CONVERSATION_VISIBLE:
       return {
         ...state,
         conversations: state.conversations.map(c =>
-          c.id === action.payload ? { ...c, open: !c.open } : c
+          c.phone === action.payload ? { ...c, open: !c.open } : c
         )
       };
     default: