From 471061090927cd0856d84921db4df4a9820546f4 Mon Sep 17 00:00:00 2001
From: Dani Palou <dani@moodle.com>
Date: Mon, 19 Nov 2018 13:04:59 +0100
Subject: [PATCH] MOBILE-2632 message: Display user data from messages

---
 .../messages/pages/discussion/discussion.html |  8 +++++-
 .../messages/pages/discussion/discussion.ts   | 27 +++++++++++++++++++
 2 files changed, 34 insertions(+), 1 deletion(-)

diff --git a/src/addon/messages/pages/discussion/discussion.html b/src/addon/messages/pages/discussion/discussion.html
index 74e8b3e88..36466b3c3 100644
--- a/src/addon/messages/pages/discussion/discussion.html
+++ b/src/addon/messages/pages/discussion/discussion.html
@@ -20,7 +20,7 @@
         <core-infinite-loading [enabled]="canLoadMore" (action)="loadPrevious($event)" position="top" [error]="loadMoreError"></core-infinite-loading>
         <ion-list class="addon-messages-discussion-container safe-area-page" [attr.aria-live]="polite">
             <ng-container *ngFor="let message of messages; index as index; last as last">
-                <ion-chip *ngIf="showDate(message, messages[index - 1])" class="addon-messages-date" color="light">
+                <ion-chip *ngIf="message.showDate" class="addon-messages-date" color="light">
                     <ion-label>{{ message.timecreated | coreFormatDate: "LL" }}</ion-label>
                 </ion-chip>
 
@@ -30,6 +30,12 @@
                 </ion-chip>
 
                 <ion-item text-wrap (longPress)="copyMessage(message)" class="addon-message" [class.addon-message-mine]="message.useridfrom == currentUserId" [@coreSlideInOut]="message.useridfrom == currentUserId ? '' : 'fromLeft'">
+                    <!-- User data. -->
+                    <ion-avatar item-start *ngIf="message.showUserData">
+                        <img [src]="members[message.useridfrom].profileimageurl" [alt]="'core.pictureof' | translate:{$a: members[message.useridfrom].fullname}" core-external-content onError="this.src='assets/img/user-avatar.png'">
+                    </ion-avatar>
+                    <h2 *ngIf="message.showUserData">{{ members[message.useridfrom].fullname }}</h2>
+
                     <!-- Some messages have <p> and some others don't. Add a <p> so they all have same styles. -->
                     <p class="addon-message-text">
                         <core-format-text (afterRender)="last && scrollToBottom()" [text]="message.text"></core-format-text>
diff --git a/src/addon/messages/pages/discussion/discussion.ts b/src/addon/messages/pages/discussion/discussion.ts
index 7df042ffa..606e6081c 100644
--- a/src/addon/messages/pages/discussion/discussion.ts
+++ b/src/addon/messages/pages/discussion/discussion.ts
@@ -73,6 +73,7 @@ export class AddonMessagesDiscussionPage implements OnDestroy {
     canDelete = false;
     groupMessagingEnabled: boolean;
     isGroup = false;
+    members: any = {}; // Members that wrote a message, indexed by ID.
 
     constructor(private eventsProvider: CoreEventsProvider, sitesProvider: CoreSitesProvider, navParams: NavParams,
             private userProvider: CoreUserProvider, private navCtrl: NavController, private messagesSync: AddonMessagesSyncProvider,
@@ -294,6 +295,12 @@ export class AddonMessagesDiscussionPage implements OnDestroy {
             // Sort the messages.
             this.messagesProvider.sortMessages(this.messages);
 
+            // Calculate which messages need to display the date or user data.
+            this.messages.forEach((message, index): any => {
+                message.showDate = this.showDate(message, this.messages[index - 1]);
+                message.showUserData = this.showUserData(message, this.messages[index - 1]);
+            });
+
             // Notify that there can be a new message.
             this.notifyNewMessage();
 
@@ -360,6 +367,13 @@ export class AddonMessagesDiscussionPage implements OnDestroy {
         return this.messagesProvider.getConversationMessages(this.conversationId, excludePending, offset).then((result) => {
             pagesToLoad--;
 
+            // Treat members. Don't use CoreUtilsProvider.arrayToObject because we don't want to override the existing object.
+            if (result.members) {
+                result.members.forEach((member) => {
+                    this.members[member.id] = member;
+                });
+            }
+
             if (pagesToLoad > 0 && result.canLoadMore) {
                 offset += AddonMessagesProvider.LIMIT_MESSAGES;
 
@@ -831,6 +845,19 @@ export class AddonMessagesDiscussionPage implements OnDestroy {
         return !moment(message.timecreated).isSame(prevMessage.timecreated, 'day');
     }
 
+    /**
+     * Check if the user info should be displayed for the current message.
+     * User data is only displayed for group conversations if the previous message was from another user.
+     *
+     * @param {any} message Current message where to show the user info.
+     * @param {any} [prevMessage] Previous message.
+     * @return {boolean} Whether user data should be shown.
+     */
+    showUserData(message: any, prevMessage?: any): boolean {
+        return this.isGroup && message.useridfrom != this.currentUserId && this.members[message.useridfrom] &&
+            (!prevMessage || prevMessage.useridfrom != message.useridfrom || message.showDate);
+    }
+
     /**
      * Toggles delete state.
      */