[FIX] mail: avoid loading more messages than intended

The IntersectionObserver was sometimes started and called its callback
before the scroll was restored, in which case the load more button was
always visible, leading to loading more messages than intended.

To fix, delay the starting of the visible until the scroll is restored.

runbot-35533

closes odoo/odoo#144228

Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>

addons/mail/static/src/core/common/thread.js

@@ -88,7 +88,7 @@ export class Thread extends Component {
                     this.threadService.fetchMoreMessages(this.props.thread);
                 }
             },
-            { init: null }
+            { init: null, ready: false }
         );
         this.loadNewerState = useVisible(
             "load-newer",
@@ -97,7 +97,7 @@ export class Thread extends Component {
                     this.threadService.fetchMoreMessages(this.props.thread, "newer");
                 }
             },
-            { init: null }
+            { init: null, ready: false }
         );
         this.presentThresholdState = useVisible(
             "present-treshold",
@@ -239,9 +239,7 @@ export class Thread extends Component {
             saveScroll();
         };
         const applyScroll = () => {
-            if (this.state.mountedAndLoaded) {
-                loadedAndPatched = true;
-            } else {
+            if (!this.state.mountedAndLoaded) {
                 return;
             }
             // Use toRaw() to prevent scroll check from triggering renders.
@@ -276,6 +274,11 @@ export class Thread extends Component {
             newestPersistentMessage = thread.newestPersistentMessage;
             oldestPersistentMessage = thread.oldestPersistentMessage;
             loadNewer = thread.loadNewer;
+            if (!loadedAndPatched) {
+                loadedAndPatched = true;
+                this.loadOlderState.ready = true;
+                this.loadNewerState.ready = true;
+            }
         };
         onWillPatch(() => {
             if (!loadedAndPatched) {

addons/mail/static/src/utils/common/hooks.js

@@ -163,9 +163,12 @@ export function useAutoScroll(refName, shouldScrollPredicate = () => true) {
  * @param {string} refName
  * @param {function} cb
  */
-export function useVisible(refName, cb, { init = false } = {}) {
+export function useVisible(refName, cb, { init = false, ready = true } = {}) {
     const ref = useRef(refName);
-    const state = { isVisible: init };
+    const state = useState({
+        isVisible: init,
+        ready,
+    });
     function setValue(value) {
         state.isVisible = value;
         cb();
@@ -174,8 +177,8 @@ export function useVisible(refName, cb, { init = false } = {}) {
         setValue(entries.at(-1).isIntersecting);
     });
     useEffect(
-        (el) => {
-            if (el) {
+        (el, ready) => {
+            if (el && ready) {
                 observer.observe(el);
                 return () => {
                     setValue(false);
@@ -183,7 +186,7 @@ export function useVisible(refName, cb, { init = false } = {}) {
                 };
             }
         },
-        () => [ref.el]
+        () => [ref.el, state.ready]
     );
     return state;
 }