if shape is update and item should be different view, recreate the tile

This commit is contained in:
Bruno Windels 2020-10-27 16:20:04 +01:00
parent 77dca5dd55
commit c9efee77f2
2 changed files with 46 additions and 7 deletions

View file

@ -144,6 +144,21 @@ export class ListView {
}
}
recreateItem(index, value) {
if (this._childInstances) {
const child = this._childCreator(value);
let oldChild;
if (child) {
oldChild = this._childInstances.splice(index, 1, child)[0];
this._root.replaceChild(child.mount(this._mountArgs), oldChild.root());
} else {
oldChild = this._childInstances.splice(index, 1)[0];
oldChild.root().remove();
}
oldChild.unmount();
}
}
onBeforeListChanged() {}
onListChanged() {}
}

View file

@ -20,6 +20,17 @@ import {TextMessageView} from "./timeline/TextMessageView.js";
import {ImageView} from "./timeline/ImageView.js";
import {AnnouncementView} from "./timeline/AnnouncementView.js";
function viewClassForEntry(entry) {
switch (entry.shape) {
case "gap": return GapView;
case "announcement": return AnnouncementView;
case "message":
case "message-status":
return TextMessageView;
case "image": return ImageView;
}
}
export class TimelineList extends ListView {
constructor(viewModel) {
const options = {
@ -27,13 +38,9 @@ export class TimelineList extends ListView {
list: viewModel.tiles,
}
super(options, entry => {
switch (entry.shape) {
case "gap": return new GapView(entry);
case "announcement": return new AnnouncementView(entry);
case "message":
case "message-status":
return new TextMessageView(entry);
case "image": return new ImageView(entry);
const View = viewClassForEntry(entry);
if (View) {
return new View(entry);
}
});
this._atBottom = false;
@ -127,4 +134,21 @@ export class TimelineList extends ListView {
root.scrollTop = root.scrollHeight;
}
}
onUpdate(index, value, param) {
if (param === "shape") {
if (this._childInstances) {
const ExpectedClass = viewClassForEntry(value);
const child = this._childInstances[index];
if (!ExpectedClass || !(child instanceof ExpectedClass)) {
// shape was updated, so we need to recreate the tile view,
// the shape parameter is set in EncryptedEventTile.updateEntry
// (and perhaps elsewhere by the time you read this)
super.recreateItem(index, value);
return;
}
}
}
super.onUpdate(index, value, param);
}
}