Reduced blocking UI on conversation view switches

chat/preview/event-bus.ts

@@ -35,5 +35,9 @@ export interface CharacterDataEvent {
 }
 
 
+export interface SelectConversationEvent extends EventBusEvent {
+    conversation: Conversation;
+}
+
 export const EventBus = new Vue();
 

learn/cache-manager.ts

@@ -1,6 +1,6 @@
 import * as _ from 'lodash';
 import core from '../chat/core';
-import { ChannelAdEvent, ChannelMessageEvent, CharacterDataEvent, EventBus } from '../chat/preview/event-bus';
+import { ChannelAdEvent, ChannelMessageEvent, CharacterDataEvent, EventBus, SelectConversationEvent } from '../chat/preview/event-bus';
 import { Channel, Conversation } from '../chat/interfaces';
 import { methods } from '../site/character_page/data_store';
 import { Character as ComplexCharacter } from '../site/character_page/interfaces';
@@ -44,6 +44,8 @@ export class CacheManager {
 
     protected lastPost: Date = new Date();
 
+    protected lastFetch = Date.now();
+
 
     markLastPostTime(): void {
         this.lastPost = new Date();
@@ -191,13 +193,82 @@ export class CacheManager {
         EventBus.$on(
             'character-data',
             async(data: CharacterDataEvent) => {
-                await this.addProfile(data.character);
+                // this promise is intentionally NOT chained
+                // tslint:disable-next-line: no-floating-promises
+              this.onCharacterData(data);
             }
         );
 
         EventBus.$on(
             'channel-message',
             async(data: ChannelMessageEvent) => {
+                // this promise is intentionally NOT chained
+                // tslint:disable-next-line: no-floating-promises
+                this.onChannelMessage(data);
+            }
+        );
+
+        EventBus.$on(
+            'channel-ad',
+            async(data: ChannelAdEvent) => {
+                // this promise is intentionally NOT chained
+                // tslint:disable-next-line: no-floating-promises
+                this.onChannelAd(data);
+            }
+        );
+
+        EventBus.$on(
+            'select-conversation',
+            async(data: SelectConversationEvent) => {
+              // this promise is intentionally NOT chained
+                // tslint:disable-next-line: no-floating-promises
+              this.onSelectConversation(data);
+            }
+        );
+
+
+        // EventBus.$on(
+        //     'private-message',
+        //     (data: any) => {}
+        // );
+
+
+        const scheduleNextFetch = () => {
+            this.profileTimer = setTimeout(
+                async() => {
+                    const next = this.consumeNextInQueue();
+
+                    if (next) {
+                        try {
+                            if ((false) && (next)) {
+                              console.log(`Fetch '${next.name}' for channel '${next.channelId}', gap: ${(Date.now() - this.lastFetch)}ms`);
+                              this.lastFetch = Date.now();
+                            }
+
+                            await this.fetchProfile(next.name);
+                        } catch (err) {
+                            console.error('Profile queue error', err);
+
+                            this.queue.push(next); // return to queue
+                        }
+                    }
+
+                    scheduleNextFetch();
+                },
+                CacheManager.PROFILE_QUERY_DELAY
+            );
+        };
+
+        scheduleNextFetch();
+    }
+
+
+    async onCharacterData(data: CharacterDataEvent): Promise<void> {
+      await this.addProfile(data.character);
+    }
+
+
+    async onChannelMessage(data: ChannelMessageEvent): Promise<void> {
         const message = data.message;
         const channel = data.channel;
 
@@ -212,11 +283,9 @@ export class CacheManager {
 
         // await this.addProfile(message.sender.name);
     }
-        );
 
-        EventBus.$on(
+
-            'channel-ad',
+    async onChannelAd(data: ChannelAdEvent): Promise<void> {
-            async(data: ChannelAdEvent) => {
         const message = data.message;
         const channel = data.channel;
 
@@ -235,13 +304,9 @@ export class CacheManager {
 
         // this.addProfile(message.sender.name);
     }
-        );
 
-
+    async onSelectConversation(data: SelectConversationEvent): Promise<void> {
-        EventBus.$on(
+        const conversation = data.conversation;
-            'select-conversation',
-            async(data: ChannelAdEvent) => {
-                const conversation = data.conversation as Conversation;
         const channel = _.get(conversation, 'channel') as (Channel.Channel | undefined);
         const channelId = _.get(channel, 'id', '<missing>');
 
@@ -289,46 +354,6 @@ export class CacheManager {
             );
         }
     }
-        );
-
-
-        // EventBus.$on(
-        //     'private-message',
-        //     (data: any) => {}
-        // );
-
-
-        const scheduleNextFetch = () => {
-            this.profileTimer = setTimeout(
-                async() => {
-                    const next = this.consumeNextInQueue();
-
-                    if (next) {
-                        try {
-                            if ((false) && (next)) {
-                              console.log(`Fetch '${next.name}' for channel '${next.channelId}', gap: ${(Date.now() - this.lastFetch)}ms`);
-                              this.lastFetch = Date.now();
-                            }
-
-                            await this.fetchProfile(next.name);
-                        } catch (err) {
-                            console.error('Profile queue error', err);
-
-                            this.queue.push(next); // return to queue
-                        }
-                    }
-
-                    scheduleNextFetch();
-                },
-                CacheManager.PROFILE_QUERY_DELAY
-            );
-        };
-
-        scheduleNextFetch();
-    }
-
-
-    protected lastFetch = Date.now();
 
 
     async resolvePScore(