[IMP] mail: move discuss widget logic into model part1

This PR prepares the ground for the one introducing the new environment in the discuss
app. Indeed, the discuss widget will be removed since it was used as an action. This widget
basically handle two things: rainbowman on empty inbox/push state. This first part focuses on
moving the rainbow man logic to the discussView model.

task-2582313

closes odoo/odoo#91365

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

addons/mail/static/src/components/discuss/discuss.js

@@ -1,6 +1,7 @@
 /** @odoo-module **/
 
-import { useUpdate } from '@mail/component_hooks/use_update';
+import { useComponentToModel } from '@mail/component_hooks/use_component_to_model';
+import { useUpdateToModel } from '@mail/component_hooks/use_update_to_model';
 import { registerMessagingComponent } from '@mail/utils/messaging_component';
 import { LegacyComponent } from '@web/legacy/legacy_component';
 
@@ -10,25 +11,8 @@ export class Discuss extends LegacyComponent {
      * @override
      */
     setup() {
-        this._updateLocalStoreProps();
-        // bind since passed as props
-        useUpdate({ func: () => this._update() });
-    }
-
-    _update() {
-        if (this.discussView.discuss.thread) {
-            this.trigger('o-push-state-action-manager');
-        }
-        if (
-            this.discussView.discuss.thread &&
-            this.discussView.discuss.thread === this.messaging.inbox &&
-            this.discussView.discuss.threadView &&
-            this._lastThreadCache === this.discussView.discuss.threadView.threadCache.localId &&
-            this._lastThreadCounter > 0 && this.discussView.discuss.thread.counter === 0
-        ) {
-            this.trigger('o-show-rainbow-man');
-        }
-        this._updateLocalStoreProps();
+        useComponentToModel({ fieldName: 'component' });
+        useUpdateToModel({ methodName: 'onComponentUpdate' });
     }
 
     //--------------------------------------------------------------------------
@@ -41,35 +25,6 @@ export class Discuss extends LegacyComponent {
     get discussView() {
         return this.props.record;
     }
-
-    //--------------------------------------------------------------------------
-    // Private
-    //--------------------------------------------------------------------------
-
-    /**
-     * @private
-     */
-    _updateLocalStoreProps() {
-        /**
-         * Locally tracked store props `activeThreadCache`.
-         * Useful to set scroll position from last stored one and to display
-         * rainbox man on inbox.
-         */
-        this._lastThreadCache = (
-            this.discussView.discuss.threadView &&
-            this.discussView.discuss.threadView.threadCache &&
-            this.discussView.discuss.threadView.threadCache.localId
-        );
-        /**
-         * Locally tracked store props `threadCounter`.
-         * Useful to display the rainbow man on inbox.
-         */
-        this._lastThreadCounter = (
-            this.discussView.discuss.thread &&
-            this.discussView.discuss.thread.counter
-        );
-    }
-
 }
 
 Object.assign(Discuss, {

addons/mail/static/src/models/discuss_view.js

@@ -2,7 +2,7 @@
 
 import { registerModel } from '@mail/model/model_core';
 import { attr, one } from '@mail/model/model_field';
-import { clear, insertAndReplace } from '@mail/model/model_field_command';
+import { clear, insertAndReplace, replace } from '@mail/model/model_field_command';
 
 registerModel({
     name: 'DiscussView',
@@ -41,6 +41,38 @@ registerModel({
             }
             this.discuss.threadView.topbar.openInvitePopoverView();
         },
+        /**
+         * Handles OWL update on the discuss component.
+         */
+        onComponentUpdate() {
+            if (this.discuss.thread) {
+                this.component.trigger('o-push-state-action-manager');
+            }
+            if (
+                this.discuss.thread &&
+                this.discuss.thread === this.messaging.inbox &&
+                this.discuss.threadView &&
+                this.lastThreadCache && this.lastThreadCache.localId === this.discuss.threadView.threadCache.localId &&
+                this.lastThreadCounter > 0 && this.discuss.thread.counter === 0
+            ) {
+                this.env.bus.trigger('show-effect', {
+                    message: this.env._t("Congratulations, your inbox is empty!"),
+                    type: 'rainbow_man',
+                });
+            }
+            const lastThreadCache = (
+                this.discuss.threadView &&
+                this.discuss.threadView.threadCache &&
+                this.discuss.threadView.threadCache
+            );
+            this.update({
+                lastThreadCache: lastThreadCache ? replace(lastThreadCache) : clear(),
+                lastThreadCounter: (
+                    this.discuss.thread &&
+                    this.discuss.thread.counter
+                ),
+            });
+        },
         onHideMobileAddItemHeader() {
             if (!this.exists()) {
                 return;
@@ -111,11 +143,7 @@ registerModel({
         },
     },
     fields: {
-        mobileAddItemHeaderAutocompleteInputView: one('AutocompleteInputView', {
-            compute: '_computeMobileAddItemHeaderAutocompleteInputView',
-            inverse: 'discussViewOwnerAsMobileAddItemHeader',
-            isCausal: true,
-        }),
+        component: attr(),
         discuss: one('Discuss', {
             inverse: 'discussView',
             readonly: true,
@@ -131,6 +159,19 @@ registerModel({
             inverse: 'discussViewOwnerAsInbox',
             isCausal: true,
         }),
+        /**
+         * Useful to display rainbow man on inbox.
+         */
+        lastThreadCache: one('ThreadCache'),
+        /**
+         * Useful to display rainbow man on inbox.
+         */
+        lastThreadCounter: attr(),
+        mobileAddItemHeaderAutocompleteInputView: one('AutocompleteInputView', {
+            compute: '_computeMobileAddItemHeaderAutocompleteInputView',
+            inverse: 'discussViewOwnerAsMobileAddItemHeader',
+            isCausal: true,
+        }),
         /**
          * Reference of the quick search input. Useful to filter channels and
          * chats based on this input content.

addons/mail/static/src/widgets/discuss/discuss.js

@@ -81,18 +81,10 @@ export const DiscussWidget = AbstractAction.extend({
             this._pushStateActionManager();
             this._lastPushStateActiveThread = this.discuss.thread;
         };
-        this._showRainbowManEventListener = ev => {
-            ev.stopPropagation();
-            this._showRainbowMan();
-        };
         this.el.addEventListener(
             'o-push-state-action-manager',
             this._pushStateActionManagerEventListener
         );
-        this.el.addEventListener(
-            'o-show-rainbow-man',
-            this._showRainbowManEventListener
-        );
 
         this.app = new App(DiscussContainer, {
             templates: window.__OWL_TEMPLATES__,
@@ -116,10 +108,6 @@ export const DiscussWidget = AbstractAction.extend({
             'o-push-state-action-manager',
             this._pushStateActionManagerEventListener
         );
-        this.el.removeEventListener(
-            'o-show-rainbow-man',
-            this._showRainbowManEventListener
-        );
     },
 
     //--------------------------------------------------------------------------
@@ -135,13 +123,4 @@ export const DiscussWidget = AbstractAction.extend({
             active_id: this.discuss.activeId,
         });
     },
-    /**
-     * @private
-     */
-    _showRainbowMan() {
-        this.trigger_up('show_effect', {
-            message: this.env._t("Congratulations, your inbox is empty!"),
-            type: 'rainbow_man',
-        });
-    },
 });