diff --git a/.gitignore b/.gitignore
index cafb8da5df85c68eaadf5dcf4dffa554692d5ff4..3a5b25fbb369499a7db4914b95ca55d5d9f1db93 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,6 +2,8 @@
 node_modules
 npm-debug.log
 
+__pycache__
+
 # Local development
 *.env
 *.dev
diff --git a/app.js b/app.js
index b1a0bd00e72c52b2c1b4b5b15a0326dc174f0474..376eb350c423e64f6641d41e7ea3a9293387eb86 100644
--- a/app.js
+++ b/app.js
@@ -65,9 +65,8 @@ function handleLogin(username,socket){
         memberID: un
       }
     }, function (error, response, body){
-      chatIDs = body;
-      //upon receiving chatIDs, get most recent message of each one
-      getMostRecentMessages(chatIDs,socket);
+      //upon receiving chatIDs and names, get most recent message of each one
+      getMostRecentMessages(body,socket);
     });
     
     /*
@@ -76,19 +75,21 @@ function handleLogin(username,socket){
     */  
 }
 
-function getMostRecentMessages(chatIds,socket){
+function getMostRecentMessages(chatIdsNames,socket){
   //go through each chat, get most recent message and pass this information to the client
-  for (const chatID of chatIDs){
+  for (const idChatName of chatIdsNames){
     request('http://localhost:7071/api/HttpGetLastChatMessage', {
       json: true,
       body: {
-        "ChatID": chatID
+        "ChatID": idChatName.ChatID
       }
     }, function (error, response, body){
       console.log(body);
       //upon receiving it, tell the client to store the chatID 
       if(body != "error"){
-        body['ChatID'] = chatID
+        body['ChatID'] = idChatName.ChatID
+        body['chatName'] = idChatName.chatName
+        
         socket.emit('chatAndLastMsg',body);
       }
     });
diff --git a/public/game.js b/public/game.js
index 14511fe9bc7fee17b090c8f03a06c1cbeda2e3dc..d550310058e270d24cc9e93aaa4689988f5bd688 100644
--- a/public/game.js
+++ b/public/game.js
@@ -13,6 +13,7 @@ var app = new Vue({
         lastMessage:'',
         chatIDsAndLstMsgs:[],
         currentChatID:-1,
+        currentChatName:'',
         state:{state:0}
     },
     mounted: function() {
@@ -28,7 +29,9 @@ var app = new Vue({
             socket.emit('sendChat',userMsgChatID);
             this.chatMessage = '';
         },
-        retrieveChatMessages(ChatID){
+        retrieveChatMessages(ChatID,chatName){
+            this.currentChatName = chatName;
+            this.currentChatID = ChatID;
             socket.emit('requestChatMessages',ChatID);
         },
         back(){
@@ -52,11 +55,11 @@ function connect() {
     });
 
     socket.on('allChatMessages',function(ChatIDMessages){
-        app.currentChatID = ChatIDMessages.ChatID;
         app.messages = ChatIDMessages.messages;
         app.state.state = 2;
     });
     
+    //list of dictionaries {username,message,date,time,ChatID,chatName}
     socket.on('chatAndLastMsg',function(ChatIDMsg){
         app.chatIDsAndLstMsgs.push(ChatIDMsg);
     });
diff --git a/triggers/HttpGetChatsForUserID/__init__.py b/triggers/HttpGetChatsForUserID/__init__.py
index fd6e1b457569a2dba0fbc755290ebbce3e57e65c..8d176d84c5c5117d614f09095e22b0949a99d190 100644
--- a/triggers/HttpGetChatsForUserID/__init__.py
+++ b/triggers/HttpGetChatsForUserID/__init__.py
@@ -5,7 +5,7 @@ from azure.cosmos.exceptions import CosmosHttpResponseError
 
 
 #takes in memberID
-#returns chatID of chats the member is in
+#returns chatID and chatName of chats the member is in
 
 
 def main(req: func.HttpRequest,documents: func.DocumentList) -> func.HttpResponse:
@@ -21,7 +21,10 @@ def main(req: func.HttpRequest,documents: func.DocumentList) -> func.HttpRespons
     #go through each chat and find memberID
     for document in documents:
         if(memID in document["members"]):
-            chatIDs.append(document["ChatID"])
+            new_dict = {}
+            new_dict["ChatID"] = document["ChatID"]
+            new_dict["chatName"] = document["name"]
+            chatIDs.append(new_dict)
 
     
     return func.HttpResponse(json.dumps(chatIDs))
diff --git a/views/chatDisplay.ejs b/views/chatDisplay.ejs
index 432ee04d833bbe45d8060ee9353948710ed17cb9..402d26d18f36a95c4bfa8bf72dab950224716fd1 100644
--- a/views/chatDisplay.ejs
+++ b/views/chatDisplay.ejs
@@ -1,3 +1,4 @@
+<h3>{{currentChatName}}</h3>
 <button class="btn btn-primary" @click='back'>Back</button>
 <div v-for="message in messages">
     <h6>{{message.username}}: {{message.time}} {{message.message}}</h6>
diff --git a/views/showChats.ejs b/views/showChats.ejs
index c1ed7abee14f3cc36f8be366419bbf232ec4a2bf..4ecd4dff70f16346f60835ea430fde5e22305fd4 100644
--- a/views/showChats.ejs
+++ b/views/showChats.ejs
@@ -1,3 +1,4 @@
 <div v-for="chatIDMsg in chatIDsAndLstMsgs">
-    <button class="btn btn-primary" @click='retrieveChatMessages(chatIDMsg.ChatID)'>{{chatIDMsg.ChatID}}</button>
+    <button class="btn btn-primary" @click='retrieveChatMessages(chatIDMsg.ChatID,chatIDMsg.chatName)'>
+        {{chatIDMsg.ChatID}}  {{chatIDMsg.chatName}} </button>
 </div>
\ No newline at end of file