changed to queryselector to extract username and date and last message fields in userbox

chatto/src/main/resources/static/js/chat.js

@@ -66,11 +66,20 @@ for (let i = 0; i < userBoxes.length; i++) {
         }
         let words = this.innerText.split("\n");
         // console.log(words);
-        document.getElementById('user-name-span').innerText = 'Chat with ' + words[1];
+        // let children = this.children;
+        // let userName = children[0].innerText;
+        let userName = this.querySelectorAll('span')[1].innerText;
+        document.getElementById('user-name-span').innerText = userName;
+        populateMessages(userName);
         this.className += " active";
     })
 }
 
+function populateMessages(userName)
+{
+    console.log(userName);
+}
+
 // var lastMessageTimeStamp;
 
 // console.log(authToken);

chatto/src/main/resources/templates/chat.html

@@ -82,7 +82,12 @@
                                             <span th:text="${userName}">Khalid</span>
                                             <p th:text="${userName} + ' is online'">Kalid is online</p>
                                         </div>
+                                        <div class="d-flex flex-column ml-auto">
+                                            <div class="text-right">Dec 25</div>
+                                            <div style="color: rgba(255,255,255,0.7);">Hello how are you</div>
+                                        </div>
                                     </div>
+
                                 </li>
                             </th:block>
                         </ui>