[IMP] mail: compute the messageViewList scroll position inside the model

task-2579306

closes odoo/odoo#83042

Signed-off-by: Sébastien Theys (seb) <seb@odoo.com>
This commit is contained in:
Didier (did)
2022-01-28 13:13:38 +00:00
parent e9d9058b64
commit 55d5fbc73e
2 changed files with 36 additions and 6 deletions
@@ -364,15 +364,17 @@ export class MessageList extends Component {
thread,
threadViewer,
});
if (this.messageListView) {
this.messageListView.update({
clientHeight: this._getScrollableElement().clientHeight,
scrollHeight: this._getScrollableElement().scrollHeight,
scrollTop: this._getScrollableElement().scrollTop,
});
}
if (!this._isLastScrollProgrammatic && threadView && threadView.exists()) {
// Margin to compensate for inaccurate scrolling to bottom and height
// flicker due height change of composer area.
const margin = 30;
// Automatically scroll to new received messages only when the list is
// currently fully scrolled.
const hasAutoScrollOnMessageReceived = (order === 'asc')
? scrollTop >= this._getScrollableElement().scrollHeight - this._getScrollableElement().clientHeight - margin
: scrollTop <= margin;
const hasAutoScrollOnMessageReceived = this.messageListView.isAtEnd;
threadView.update({ hasAutoScrollOnMessageReceived });
}
if (threadViewer && threadViewer.exists()) {
@@ -6,11 +6,39 @@ import { attr, one } from '@mail/model/model_field';
registerModel({
name: 'MessageListView',
identifyingFields: ['threadViewOwner'],
recordMethods: {
/***
* @private
* @returns {boolean}
*/
_computeIsAtEnd() {
/**
* The margin that we use to detect that the scrollbar is a the end of
* the threadView.
*/
const endThreshold = 30;
if (this.threadViewOwner.order === 'asc') {
return this.scrollTop >= this.scrollHeight - this.clientHeight - endThreshold;
}
return this.scrollTop <= endThreshold;;
},
},
fields: {
clientHeight: attr(),
/**
* States the OWL component of this message list view
*/
component: attr(),
/**
* States whether the message list scroll position is at the end of
* the message list. Depending of the message list order, this could be
* the top or the bottom.
*/
isAtEnd: attr({
compute: '_computeIsAtEnd',
}),
scrollHeight: attr(),
scrollTop: attr(),
threadViewOwner: one('ThreadView', {
inverse: 'messageListView',
readonly: true,