Merge pull request #965 from vector-im/bwindels/fix-947

Fix timeline not backfilling with "Not Loading" message shown at top

src/domain/session/room/timeline/tiles/DateTile.ts

@@ -119,6 +119,14 @@ export class DateTile extends ViewModel implements ITile<BaseEventEntry> {
         return false;
     }
 
+    /**
+     * This tile needs to do the comparison between tiles, as it uses the entry
+     * from another tile to determine its sorting order.
+     * */
+    get comparisonIsNotCommutative(): boolean {
+        return true;
+    }
+
     // let item know it has a new sibling
     updatePreviousSibling(prev: ITile<BaseEntry> | undefined): void {
         // forward the sibling update to our next tile, so it is informed
@@ -178,4 +186,4 @@ export function tests() {
             assert.equal(tiles[2], b);
         }
     }
-}
+}

src/domain/session/room/timeline/tiles/ITile.ts

@@ -24,7 +24,20 @@ export interface ITile<E extends BaseEntry = BaseEntry> extends IDisposable {
     setUpdateEmit(emitUpdate: EmitUpdateFn): void;
     get upperEntry(): E;
     get lowerEntry(): E;
+    /** compare two tiles, returning:
+     *  - 0 if both tiles are considered equal
+     *  - a negative value if this tiles is sorted before the given tile
+     *  - a positive value if this tiles is sorted after the given tile
+     **/
     compare(tile: ITile<BaseEntry>): number;
+    /** Some tiles might need comparison mechanisms that are not commutative,
+     * (e.g. `tileA.compare(tileB)` not being the same as `tileB.compare(tileA)`),
+     * a property needed for reliably sorting the tiles in TilesCollection.
+     * To counteract this, tiles can indicate this is not the case for them and
+     * when any other tile is being compared to a tile where this flag is true,
+     * it should delegate the comparison to the given tile.
+     * E.g. one example where this flag is used is DateTile. */
+    get comparisonIsNotCommutative(): boolean;
     compareEntry(entry: BaseEntry): number;
     // update received for already included (falls within sort keys) entry
     updateEntry(entry: BaseEntry, param: any): UpdateAction;

src/domain/session/room/timeline/tiles/SimpleTile.js

@@ -110,8 +110,16 @@ export class SimpleTile extends ViewModel {
         return this._entry;
     }
 
+    get comparisonIsNotCommutative() {
+        return false;
+    }
+
     compare(tile) {
-        return this.upperEntry.compare(tile.upperEntry);
+        if (tile.comparisonIsNotCommutative) {
+            return -tile.compare(this);
+        } else {
+            return this.upperEntry.compare(tile.upperEntry);
+        }
     }
 
     compareEntry(entry) {
@@ -241,4 +249,4 @@ export function tests() {
             assert.equal(fridayTile.needsDateSeparator, true);
         },
     }
-}
+}

src/platform/web/dom/TimeFormatter.ts

@@ -61,7 +61,6 @@ export class TimeFormatter implements ITimeFormatter {
 
     formatRelativeDate(date: Date): string {
         let daysDiff = Math.floor((date.getTime() - this.todayMidnight.getTime()) / TimeScope.Day);
-        console.log("formatRelativeDate daysDiff", daysDiff, date);
         if (daysDiff >= -1 && daysDiff <= 1) {
             // Tomorrow, Today, Yesterday
             return capitalizeFirstLetter(this.relativeDayFormatter.format(daysDiff, "day"));
@@ -80,4 +79,4 @@ export class TimeFormatter implements ITimeFormatter {
 
 function capitalizeFirstLetter(str: string) {
     return str.slice(0, 1).toLocaleUpperCase() + str.slice(1);
-}
+}