community: smoother voices (fixes #9185) (#9186)

Co-authored-by: dogi <[email protected]>

Author: Mutugiii

package.json

@@ -1,7 +1,7 @@
 {
   "name": "planet",
   "license": "AGPL-3.0",
-  "version": "0.20.46",
+  "version": "0.20.47",
   "myplanet": {
     "latest": "v0.34.30",
     "min": "v0.33.30"

src/app/community/community.component.ts

@@ -3,7 +3,7 @@ import { ActivatedRoute, ParamMap, Router } from '@angular/router';
 import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
 import { UntypedFormBuilder } from '@angular/forms';
 import { Subject, forkJoin, iif, of, throwError } from 'rxjs';
-import { takeUntil, finalize, switchMap, map, catchError, tap, debounceTime, distinctUntilChanged } from 'rxjs/operators';
+import { takeUntil, finalize, switchMap, map, catchError, tap, debounceTime, distinctUntilChanged, take } from 'rxjs/operators';
 import { StateService } from '../shared/state.service';
 import { NewsService } from '../news/news.service';
 import { DialogsFormService } from '../shared/dialogs/dialogs-form.service';
@@ -69,6 +69,7 @@ export class CommunityComponent implements OnInit, OnDestroy {
   availableLabels: string[] = [];
   selectedLabel = '';
   pinned = false;
+  attachmentMap: Record<string, any> = {};
 
   get leadersTabLabel(): string {
     return this.configuration.planetType === 'nation' ? $localize`Nation Leaders` : $localize`Community Leaders`;
@@ -108,7 +109,6 @@ export class CommunityComponent implements OnInit, OnDestroy {
     const newsSortValue = (item: any) => item.sharedDate || item.doc.time;
     this.newsService.newsUpdated$.pipe(takeUntil(this.onDestroy$)).subscribe(news => {
       this.news = news.sort((a, b) => newsSortValue(b) - newsSortValue(a));
-      this.news.forEach(item => item.doc.messageLower = item.doc.message?.toLowerCase() || '');
       this.filteredNews = this.news;
       this.availableLabels = this.getAvailableLabels(this.news);
       this.isLoading = false;
@@ -291,9 +291,13 @@ export class CommunityComponent implements OnInit, OnDestroy {
 
   getLinks(planetCode?) {
     return this.teamsService.getTeamMembers(this.team || this.teamObject(planetCode), true).pipe(map((docs) => {
-      const { link: links, transaction: finances, report: reports } = docs.reduce((docObject, doc) => ({
-        ...docObject, [doc.docType]: [ ...(docObject[doc.docType] || []), doc ]
-      }), { link: [], transaction: [] });
+      const { link: links, transaction: finances, report: reports } = docs.reduce((docObject, doc) => {
+        if (!docObject[doc.docType]) {
+          docObject[doc.docType] = [];
+        }
+        docObject[doc.docType].push(doc);
+        return docObject;
+      }, { link: [], transaction: [], report: [] });
       return { links, finances, reports };
     }));
   }
@@ -312,21 +316,40 @@ export class CommunityComponent implements OnInit, OnDestroy {
 
   setCouncillors(users) {
     const planetCode = this.planetCode ? this.planetCode : this.stateService.configuration.code;
-    this.couchService.findAll('attachments').subscribe((attachments: any[]) => {
-      this.councillors = users
-        .filter(user => planetCode === user.doc.planetCode && (user.doc.isUserAdmin || user.doc.roles.indexOf('leader')) !== -1)
-        .map(user => {
-          const { _id: userId, planetCode: userPlanetCode, name } = user.doc;
-          const attachmentId = `org.couchdb.user:${name}@${userPlanetCode}`;
-          const attachmentDoc: any = attachments.find(attachment => attachment._id === attachmentId);
-          const avatar = attachmentDoc ?
-            `${environment.couchAddress}/attachments/${attachmentId}/${Object.keys(attachmentDoc._attachments)[0]}` :
-            (user.imageSrc || 'assets/image.png');
-          return { avatar, userDoc: user, userId, name: user.doc.name, userPlanetCode: user.doc.planetCode, ...user };
-        });
+    const councillorUsers = users
+      .filter(user => planetCode === user.doc.planetCode && (user.doc.isUserAdmin || user.doc.roles.indexOf('leader')) !== -1);
+    const attachmentIds = councillorUsers
+      .map(user => `org.couchdb.user:${user.doc.name}@${user.doc.planetCode}`)
+      .filter(id => !!id);
+
+    this.fetchMissingAttachments(attachmentIds).pipe(take(1)).subscribe(() => {
+      this.councillors = councillorUsers.map(user => {
+        const { _id: userId, planetCode: userPlanetCode, name } = user.doc;
+        const attachmentId = `org.couchdb.user:${name}@${userPlanetCode}`;
+        const attachmentDoc: any = this.attachmentMap[attachmentId];
+        const avatar = attachmentDoc ?
+          `${environment.couchAddress}/attachments/${attachmentId}/${Object.keys(attachmentDoc._attachments)[0]}` :
+          (user.imageSrc || 'assets/image.png');
+        return { avatar, userDoc: user, userId, name: user.doc.name, userPlanetCode: user.doc.planetCode, ...user };
+      });
     });
   }
 
+  private fetchMissingAttachments(ids: string[]) {
+    const missing = ids.filter(id => !this.attachmentMap[id]);
+    if (missing.length === 0) {
+      return of(undefined);
+    }
+    return this.couchService.findAttachmentsByIds(missing).pipe(
+      tap((attachments: any[]) => {
+        attachments.forEach(attachment => {
+          this.attachmentMap[attachment._id] = attachment;
+        });
+      }),
+      map(() => undefined)
+    );
+  }
+
   openAddLinkDialog() {
     this.dialog.open(CommunityLinkDialogComponent, {
       width: '50vw',
@@ -498,7 +521,12 @@ export class CommunityComponent implements OnInit, OnDestroy {
     }
     if (this.voiceSearch) {
       const lower = this.voiceSearch.toLowerCase();
-      filtered = filtered.filter(item => item.doc.messageLower.includes(lower));
+      filtered = filtered.filter(item => {
+        if (typeof item.doc.messageLower !== 'string') {
+          item.doc.messageLower = (item.doc.message || '').toLowerCase();
+        }
+        return item.doc.messageLower.includes(lower);
+      });
     }
     this.filteredNews = filtered;
   }

src/app/news/news-list.component.ts

@@ -59,7 +59,6 @@ export class NewsListComponent implements OnInit, OnChanges, AfterViewInit, OnDe
   ) {}
 
   ngOnInit() {
-
     this.router.events.subscribe(() => {
       this.initNews();
     });
@@ -71,7 +70,11 @@ export class NewsListComponent implements OnInit, OnChanges, AfterViewInit, OnDe
     let isLatest = true;
     this.replyObject = {};
     this.items.forEach(item => {
-      this.replyObject[item.doc.replyTo || 'root'] = [ ...(this.replyObject[item.doc.replyTo || 'root'] || []), item ];
+      const key = item.doc.replyTo || 'root';
+      if (!this.replyObject[key]) {
+        this.replyObject[key] = [];
+      }
+      this.replyObject[key].push(item);
       if (!item.doc.replyTo && isLatest) {
         item.latestMessage = true;
         isLatest = false;

src/app/news/news.service.ts

@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
-import { Subject, forkJoin, of } from 'rxjs';
-import { map } from 'rxjs/operators';
+import { Subject, of } from 'rxjs';
+import { map, switchMap } from 'rxjs/operators';
 import { CouchService } from '../shared/couchdb.service';
 import { StateService } from '../shared/state.service';
 import { UserService } from '../shared/user.service';
@@ -29,19 +29,25 @@ export class NewsService {
 
   requestNews({ selectors, viewId } = this.currentOptions) {
     this.currentOptions = { selectors, viewId };
-    forkJoin([
-      this.couchService.findAll(this.dbName, findDocuments(selectors, 0, [ { 'time': 'desc' } ])),
-      this.couchService.findAll('attachments')
-    ]).subscribe(([ newsItems, avatars ]) => {
+    this.couchService.findAll(this.dbName, findDocuments(selectors, 0, [ { 'time': 'desc' } ])).pipe(
+      switchMap((newsItems: any[]) =>
+        this.couchService.findAttachmentsByIds(this.collectAttachmentIds(newsItems)).pipe(
+          map((attachments: any[]) => ({
+            newsItems,
+            avatarMap: new Map<string, any>(attachments.map((attachment: any) => [ attachment._id, attachment ]))
+          }))
+        )
+      )
+    ).subscribe(({ newsItems, avatarMap }) => {
       this.newsUpdated$.next(newsItems.map((item: any) => (
-        { doc: item, sharedDate: this.findShareDate(item, viewId), avatar: this.findAvatar(item.user, avatars), _id: item._id }
+        { doc: item, sharedDate: this.findShareDate(item, viewId), avatar: this.findAvatar(item.user, avatarMap), _id: item._id }
       )));
     });
   }
 
-  findAvatar(user: any, attachments: any[]) {
+  findAvatar(user: any, attachments: Map<string, any>) {
     const attachmentId = `${user._id}@${user.planetCode}`;
-    const attachment = attachments.find(avatar => avatar._id === attachmentId);
+    const attachment = attachments.get(attachmentId);
     const extractFilename = (object) => Object.keys(object._attachments)[0];
     return attachment ?
       `${this.imgUrlPrefix}/attachments/${attachmentId}/${extractFilename(attachment)}` :
@@ -54,6 +60,17 @@ export class NewsService {
     return ((item.viewIn || []).find(view => view._id === viewId) || {}).sharedDate;
   }
 
+  private collectAttachmentIds(newsItems: any[]): string[] {
+    const ids = new Set<string>();
+    newsItems.forEach((item: any) => {
+      const user = item?.user;
+      if (user && user._id && user.planetCode) {
+        ids.add(`${user._id}@${user.planetCode}`);
+      }
+    });
+    return Array.from(ids);
+  }
+
   postNews(post, successMessage = $localize`Thank you for submitting your message`, isMessageEdit = true) {
     const { configuration } = this.stateService;
     const message = typeof post.message === 'string' ? post.message : post.message.text;

src/app/shared/couchdb.service.ts

@@ -1,8 +1,8 @@
 import { Injectable } from '@angular/core';
 import { HttpHeaders, HttpClient, HttpRequest } from '@angular/common/http';
 import { environment } from '../../environments/environment';
-import { Observable, of, empty, throwError } from 'rxjs';
-import { catchError, map, expand, toArray, flatMap, switchMap } from 'rxjs/operators';
+import { Observable, of, empty, throwError, forkJoin } from 'rxjs';
+import { catchError, map, expand, toArray, flatMap, switchMap } from 'rxjs/operators';
 import { debug } from '../debug-operator';
 import { PlanetMessageService } from './planet-message.service';
 import { findDocuments } from './mangoQueries';
@@ -97,15 +97,33 @@ export class CouchService {
     }));
   }
 
-  findAll(db: string, query: any = { 'selector': { '_id': { '$gt': null } }, 'limit': 1000 }, opts?: any) {
-    return this.findAllRequest(db, query, opts).pipe(flatMap(({ docs }) => docs), toArray());
-  }
-
-  findAllStream(db: string, query: any = { 'selector': { '_id': { '$gt': null } }, 'limit': 1000 }, opts?: any) {
-    return this.findAllRequest(db, query, opts).pipe(map(({ docs }) => docs));
-  }
-
-  private findAllRequest(db: string, query: any, opts: any) {
+  findAll(db: string, query: any = { 'selector': { '_id': { '$gt': null } }, 'limit': 1000 }, opts?: any) {
+    return this.findAllRequest(db, query, opts).pipe(flatMap(({ docs }) => docs), toArray());
+  }
+
+  findAllStream(db: string, query: any = { 'selector': { '_id': { '$gt': null } }, 'limit': 1000 }, opts?: any) {
+    return this.findAllRequest(db, query, opts).pipe(map(({ docs }) => docs));
+  }
+
+  findAttachmentsByIds(ids: string[], opts?: any) {
+    const uniqueIds = Array.from(new Set((ids || []).filter(id => !!id)));
+    if (uniqueIds.length === 0) {
+      return of([]);
+    }
+    const chunkSize = 50;
+    const queries = [];
+    for (let i = 0; i < uniqueIds.length; i += chunkSize) {
+      const chunk = uniqueIds.slice(i, i + chunkSize);
+      queries.push(
+        this.findAll('attachments', findDocuments({ '_id': { '$in': chunk } }, 0, 0, chunk.length), opts)
+      );
+    }
+    return forkJoin(queries).pipe(
+      map((results: any[]) => results.reduce((acc: any[], docs: any[]) => acc.concat(docs), []))
+    );
+  }
+
+  private findAllRequest(db: string, query: any, opts: any) {
     return this.post(db + '/_find', query, opts).pipe(
       catchError(() => {
         return of({ docs: [], rows: [] });