Pulled scrollToBottom trigger out of select statement.
The additional delay thanks to the watch seems to fix it.
Should this still not work, we probably need to set a
duration for the delay (something like 100ms).
@@ -135,23 +135,9 @@ function genComponentConf() {
const connection = selectOpenConnection(state);
const eventUris = connection && connection.get('hasEvents');
const eventsLoaded = eventUris && eventUris.size > 0;
-
- //TODO seems like rather bad practice to have sideffects here
- delay(0).then(() => {
- // scroll to bottom directly after rendering, if snapped
- self.updateScrollposition();
-
- // amake sure latest messages are loaded
- if (connection && !connection.get('loadingEvents') && !eventsLoaded) {
- self.connections__showLatestMessages(connectionUri, 4);
- }
- });
-
-
const connectionData = selectAllByConnections(state).get(connectionUri);
const ownNeed = connectionData && connectionData.get('ownNeed');
const theirNeed = connectionData && connectionData.get('remoteNeed');
-
const chatMessages = selectSortedChatMessages(state);
return {
connectionData,
@@ -177,6 +163,26 @@ function genComponentConf() {
this.$scope.$on('$destroy', disconnect);
this.snapToBottom();
+
+ this.$scope.$watch(
+ () => this.chatMessages && this.chatMessages.length, // trigger if there's messages added (or removed)
+ () => delay(0).then(() => {
+
+ // scroll to bottom directly after rendering, if snapped
+ this.updateScrollposition();
+
+ // make sure latest messages are loaded
+ if (
+ this.connectionUri &&
+ this.connection &&
+ !this.connection.get('loadingEvents') &&
+ !this.eventsLoaded
+ ) {
+ this.connections__showLatestMessages(this.connectionUri, 4);
+ }
+ })
+ )
+
}
encodeParam(param) {
