Arsharth/hydrogen-web
1
0
Fork 0
forked from mystiq/hydrogen-web
Code Issues Pull requests Projects Releases Packages Wiki Activity

Merge pull request #498 from vector-im/bwindels/fix-replies

Browse source 
Fix replies after releasing scroll improvements
This commit is contained in:
Bruno Windels 2021-09-16 22:43:15 +02:00 committed by GitHub
commit 5cf8c3c7d2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 9 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/domain/session/room/ComposerViewModel.js
View file

@ -25,7 +25,7 @@ export class ComposerViewModel extends ViewModel {
} }
setReplyingTo(entry) { setReplyingTo(entry) {
const changed = this._replyVM?.id?.equals(entry?.asEventKey()); const changed = new Boolean(entry) !== new Boolean(this._replyVM) || !this._replyVM?.id.equals(entry.asEventKey());
if (changed) { if (changed) {
this._replyVM = this.disposeTracked(this._replyVM); this._replyVM = this.disposeTracked(this._replyVM);
if (entry) { if (entry) {

1
src/platform/web/ui/session/room/TimelineView.ts
View file

@ -176,7 +176,6 @@ export class TimelineView extends TemplateView<TimelineViewModel> {
bottomNodeIndex = len - 1; bottomNodeIndex = len - 1;
} else { } else {
const viewportBottom = scrollTop + clientHeight; const viewportBottom = scrollTop + clientHeight;
// console.log(`viewportBottom: ${viewportBottom} (${scrollTop} + ${clientHeight})`);
const anchoredNodeIndex = findFirstNodeIndexAtOrBelow(tilesNode, viewportBottom); const anchoredNodeIndex = findFirstNodeIndexAtOrBelow(tilesNode, viewportBottom);
this.anchoredNode = tilesNode.childNodes[anchoredNodeIndex] as HTMLElement; this.anchoredNode = tilesNode.childNodes[anchoredNodeIndex] as HTMLElement;
this.anchoredBottom = bottom(this.anchoredNode!); this.anchoredBottom = bottom(this.anchoredNode!);

16
src/platform/web/ui/session/room/timeline/BaseMessageView.js
View file

@ -33,6 +33,10 @@ export class BaseMessageView extends TemplateView {
} }
render(t, vm) { render(t, vm) {
const children = [this.renderMessageBody(t, vm)];
if (this._interactive) {
children.push(t.button({className: "Timeline_messageOptions"}, "⋯"));
}
const li = t.el(this._tagName, {className: { const li = t.el(this._tagName, {className: {
"Timeline_message": true, "Timeline_message": true,
own: vm.isOwn, own: vm.isOwn,
@ -40,13 +44,7 @@ export class BaseMessageView extends TemplateView {
unverified: vm.isUnverified, unverified: vm.isUnverified,
disabled: !this._interactive, disabled: !this._interactive,
continuation: vm => vm.isContinuation, continuation: vm => vm.isContinuation,
}}, [ }}, children);
// dynamically added and removed nodes are handled below
this.renderMessageBody(t, vm),
// should be after body as it is overlayed on top
this._interactive ? t.button({className: "Timeline_messageOptions"}, "⋯") : [],
]);
const avatar = t.a({href: vm.memberPanelLink, className: "Timeline_messageAvatar"}, [renderStaticAvatar(vm, 30)]);
// given that there can be many tiles, we don't add // given that there can be many tiles, we don't add
// unneeded DOM nodes in case of a continuation, and we add it // unneeded DOM nodes in case of a continuation, and we add it
// with a side-effect binding to not have to create sub views, // with a side-effect binding to not have to create sub views,
@ -57,8 +55,10 @@ export class BaseMessageView extends TemplateView {
li.removeChild(li.querySelector(".Timeline_messageAvatar")); li.removeChild(li.querySelector(".Timeline_messageAvatar"));
li.removeChild(li.querySelector(".Timeline_messageSender")); li.removeChild(li.querySelector(".Timeline_messageSender"));
} else if (!isContinuation) { } else if (!isContinuation) {
const avatar = tag.a({href: vm.memberPanelLink, className: "Timeline_messageAvatar"}, [renderStaticAvatar(vm, 30)]);
const sender = tag.div({className: `Timeline_messageSender usercolor${vm.avatarColorNumber}`}, vm.displayName);
li.insertBefore(avatar, li.firstChild); li.insertBefore(avatar, li.firstChild);
li.insertBefore(tag.div({className: `Timeline_messageSender usercolor${vm.avatarColorNumber}`}, vm.displayName), li.firstChild); li.insertBefore(sender, li.firstChild);
} }
}); });
// similarly, we could do this with a simple ifView, // similarly, we could do this with a simple ifView,