MOBILE-2795 notifications: Show user avatars

src/addon/notifications/providers/notifications.ts

@@ -44,9 +44,10 @@ export class AddonNotificationsProvider {
      * Function to format notification data.
      *
      * @param {any[]} notifications List of notifications.
+     * @return {Promise<any[]>} Promise resolved with notifications.
      */
-    protected formatNotificationsData(notifications: any[]): void {
+    protected formatNotificationsData(notifications: any[]): Promise<any> {
-        notifications.forEach((notification) => {
+        const promises = notifications.map((notification) => {
             // Set message to show.
             if (notification.contexturl && notification.contexturl.indexOf('/mod/forum/') >= 0) {
                 notification.mobiletext = notification.smallmessage;
@@ -60,13 +61,19 @@ export class AddonNotificationsProvider {
             }
             if (notification.useridfrom > 0) {
                 // Try to get the profile picture of the user.
-                this.userProvider.getProfile(notification.useridfrom, notification.courseid, true).then((user) => {
+                return this.userProvider.getProfile(notification.useridfrom, notification.courseid, true).then((user) => {
                     notification.profileimageurlfrom = user.profileimageurl;
+
+                    return notification;
                 }).catch(() => {
                     // Error getting user. This can happen if device is offline or the user is deleted.
                 });
             }
+
+            return Promise.resolve(notification);
         });
+
+        return Promise.all(promises);
     }
 
     /**
@@ -145,14 +152,16 @@ export class AddonNotificationsProvider {
             return site.read('core_message_get_messages', data, preSets).then((response) => {
                 if (response.messages) {
                     const notifications = response.messages;
-                    this.formatNotificationsData(notifications);
-                    if (this.appProvider.isDesktop() && toDisplay && !read && limitFrom === 0) {
-                        // Store the last received notification. Don't block the user for this.
-                        this.emulatorHelper.storeLastReceivedNotification(
-                            AddonNotificationsProvider.PUSH_SIMULATION_COMPONENT, notifications[0], siteId);
-                    }
 
-                    return notifications;
+                    return this.formatNotificationsData(notifications).then(() => {
+                        if (this.appProvider.isDesktop() && toDisplay && !read && limitFrom === 0) {
+                            // Store the last received notification. Don't block the user for this.
+                            this.emulatorHelper.storeLastReceivedNotification(
+                                AddonNotificationsProvider.PUSH_SIMULATION_COMPONENT, notifications[0], siteId);
+                        }
+
+                        return notifications;
+                    });
                 } else {
                     return Promise.reject(null);
                 }

src/components/user-avatar/core-user-avatar.html

@@ -1,3 +1,4 @@
-<img src="{{profileUrl}}" [alt]="'core.pictureof' | translate:{$a: fullname}" core-external-content onError="this.src='assets/img/user-avatar.png'" role="presentation" [siteId]="siteId || null" (click)="gotoProfile($event)">
+<img *ngIf="profileUrl" [src]="profileUrl" [alt]="'core.pictureof' | translate:{$a: fullname}" core-external-content onError="this.src='assets/img/user-avatar.png'" role="presentation" [siteId]="siteId || null" (click)="gotoProfile($event)">
+<img *ngIf="!profileUrl" src="assets/img/user-avatar.png" [alt]="'core.pictureof' | translate:{$a: fullname}" role="presentation" (click)="gotoProfile($event)">
 <span *ngIf="checkOnline && isOnline()" class="contact-status online"></span>
 <ng-content></ng-content>