[IMP] *: adapt modules to Owl search panel

Adaptation of the rest of the environment to the changes regarding the
refactored search panel and model.

This commit includes the following changes:

- Since the control panel model is now part of the search model, the
view widget is responsible of its instantiation with the appropriate
API; creating an ActionModel holding the required model extensions.

- The controller is now importing/exporting the state of the entire
search model as well as the current state of the search panel (given
throught its props). Changes have been made to adapt to this behaviour.

- The multiple components linked to the control panel model have been
adapted to reflect the changes brought to it (they will now listen to
the "searchModel" instead of the "controlPanelModel").

- The `test_utils_create` methods have also been adapted to properly
instantiate a searchModel

Part of task 2228968

Co-authored-by: Julien Mougenot <jum@odoo.com>
Co-authored-by: Mathieu Duckerts-Antoine <dam@odoo.com>

9 files changed, 37 insertions, 38 deletions

diff --git a/addons/web/static/src/js/control_panel/comparison_menu.js b/addons/web/static/src/js/control_panel/comparison_menu.js
index 4504370e7c4..dee1c982d2e 100644
--- a/addons/web/static/src/js/control_panel/comparison_menu.js
+++ b/addons/web/static/src/js/control_panel/comparison_menu.js
@@ -3,7 +3,7 @@ odoo.define("web.ComparisonMenu", function (require) {
 
     const DropdownMenu = require("web.DropdownMenu");
     const { FACET_ICONS } = require("web.searchUtils");
-    const { useModel } = require("web.model");
+    const { useModel } = require("web/static/src/js/model.js");
 
     /**
      * "Comparison" menu
@@ -15,7 +15,7 @@ odoo.define("web.ComparisonMenu", function (require) {
     class ComparisonMenu extends DropdownMenu {
         constructor() {
             super(...arguments);
-            this.model = useModel("controlPanelModel");
+            this.model = useModel('searchModel');
         }
 
         //---------------------------------------------------------------------
@@ -33,7 +33,7 @@ odoo.define("web.ComparisonMenu", function (require) {
          * @override
          */
         get items() {
-            return this.model.getFiltersOfType("comparison");
+            return this.model.get('filters', f => f.type === 'comparison');
         }
 
         /**
diff --git a/addons/web/static/src/js/control_panel/control_panel.js b/addons/web/static/src/js/control_panel/control_panel.js
index b315893076a..aca28bc0eb2 100644
--- a/addons/web/static/src/js/control_panel/control_panel.js
+++ b/addons/web/static/src/js/control_panel/control_panel.js
@@ -2,15 +2,15 @@ odoo.define('web.ControlPanel', function (require) {
     "use strict";
 
     const ActionMenus = require('web.ActionMenus');
-    const ControlPanelModel = require('web.ControlPanelModel');
     const ComparisonMenu = require('web.ComparisonMenu');
+    const ActionModel = require('web/static/src/js/views/action_model.js');
     const FavoriteMenu = require('web.FavoriteMenu');
     const FilterMenu = require('web.FilterMenu');
     const GroupByMenu = require('web.GroupByMenu');
     const patchMixin = require('web.patchMixin');
     const Pager = require('web.Pager');
     const SearchBar = require('web.SearchBar');
-    const { useModel } = require('web.model');
+    const { useModel } = require('web/static/src/js/model.js');
 
     const { Component, hooks } = owl;
     const { useRef, useSubEnv } = hooks;
@@ -105,14 +105,14 @@ odoo.define('web.ControlPanel', function (require) {
 
             useSubEnv({
                 action: this.props.action,
-                controlPanelModel: this.props.controlPanelModel,
+                searchModel: this.props.searchModel,
                 view: this.props.view,
             });
 
             // Connect to the model
             // TODO: move this in enterprise whenever possible
-            if (this.env.controlPanelModel) {
-                this.model = useModel('controlPanelModel');
+            if (this.env.searchModel) {
+                this.model = useModel('searchModel');
             }
 
             // Reference hooks
@@ -135,7 +135,7 @@ odoo.define('web.ControlPanel', function (require) {
         }
 
         async willUpdateProps(nextProps) {
-            // Note: action and controlPanelModel are not likely to change during
+            // Note: action and searchModel are not likely to change during
             // the lifespan of a ControlPanel instance, so we only need to update
             // the view information.
             if ('view' in nextProps) {
@@ -185,6 +185,7 @@ odoo.define('web.ControlPanel', function (require) {
             return formattedFields;
         }
     }
+    ControlPanel.modelExtension = "ControlPanel";
 
     ControlPanel.components = {
         SearchBar,
@@ -202,7 +203,7 @@ odoo.define('web.ControlPanel', function (require) {
     ControlPanel.props = {
         action: Object,
         breadcrumbs: Array,
-        controlPanelModel: ControlPanelModel,
+        searchModel: ActionModel,
         cp_content: { type: Object, optional: 1 },
         fields: Object,
         pager: { validate: p => typeof p === 'object' || p === null, optional: 1 },
@@ -214,7 +215,6 @@ odoo.define('web.ControlPanel', function (require) {
         withBreadcrumbs: Boolean,
         withSearchBar: Boolean,
     };
-
     ControlPanel.template = 'web.ControlPanel';
 
     return patchMixin(ControlPanel);
diff --git a/addons/web/static/src/js/control_panel/custom_favorite_item.js b/addons/web/static/src/js/control_panel/custom_favorite_item.js
index b7b3a34ef81..b7adb031467 100644
--- a/addons/web/static/src/js/control_panel/custom_favorite_item.js
+++ b/addons/web/static/src/js/control_panel/custom_favorite_item.js
@@ -4,7 +4,7 @@ odoo.define('web.CustomFavoriteItem', function (require) {
     const DropdownMenuItem = require('web.DropdownMenuItem');
     const FavoriteMenu = require('web.FavoriteMenu');
     const { useAutofocus } = require('web.custom_hooks');
-    const { useModel } = require('web.model');
+    const { useModel } = require('web/static/src/js/model.js');
 
     const { useRef } = owl.hooks;
 
@@ -39,7 +39,7 @@ odoo.define('web.CustomFavoriteItem', function (require) {
             this.shareAllUsersId = `o_favorite_share_all_users_${favId}`;
 
             this.descriptionRef = useRef('description');
-            this.model = useModel('controlPanelModel');
+            this.model = useModel('searchModel');
             this.interactive = true;
             Object.assign(this.state, {
                 description: this.env.action.name || "",
@@ -65,7 +65,7 @@ odoo.define('web.CustomFavoriteItem', function (require) {
                 });
                 return this.descriptionRef.el.focus();
             }
-            const favorites = this.model.getFiltersOfType('favorite');
+            const favorites = this.model.get('filters', f => f.type === 'favorite');
             if (favorites.some(f => f.description === this.state.description)) {
                 this.env.services.notification.notify({
                     message: this.env._t("Filter with same name already exists."),
diff --git a/addons/web/static/src/js/control_panel/custom_filter_item.js b/addons/web/static/src/js/control_panel/custom_filter_item.js
index 592a948d135..98080f6a418 100644
--- a/addons/web/static/src/js/control_panel/custom_filter_item.js
+++ b/addons/web/static/src/js/control_panel/custom_filter_item.js
@@ -7,7 +7,7 @@ odoo.define('web.CustomFilterItem', function (require) {
     const { FIELD_OPERATORS, FIELD_TYPES } = require('web.searchUtils');
     const field_utils = require('web.field_utils');
     const patchMixin = require('web.patchMixin');
-    const { useModel } = require('web.model');
+    const { useModel } = require('web/static/src/js/model.js');
 
     /**
      * Filter generator menu
@@ -46,7 +46,7 @@ odoo.define('web.CustomFilterItem', function (require) {
         constructor() {
             super(...arguments);
 
-            this.model = useModel('controlPanelModel');
+            this.model = useModel('searchModel');
 
             this.canBeOpened = true;
             this.state.conditions = [];
diff --git a/addons/web/static/src/js/control_panel/custom_group_by_item.js b/addons/web/static/src/js/control_panel/custom_group_by_item.js
index 8082608d3ff..20a1c3c7eb7 100644
--- a/addons/web/static/src/js/control_panel/custom_group_by_item.js
+++ b/addons/web/static/src/js/control_panel/custom_group_by_item.js
@@ -2,7 +2,7 @@ odoo.define('web.CustomGroupByItem', function (require) {
     "use strict";
 
     const DropdownMenuItem = require('web.DropdownMenuItem');
-    const { useModel } = require('web.model');
+    const { useModel } = require('web/static/src/js/model.js');
 
     /**
      * Group by generator menu
@@ -20,7 +20,7 @@ odoo.define('web.CustomGroupByItem', function (require) {
             this.canBeOpened = true;
             this.state.fieldName = this.props.fields[0].name;
 
-            this.model = useModel('controlPanelModel');
+            this.model = useModel('searchModel');
         }
 
         //---------------------------------------------------------------------
diff --git a/addons/web/static/src/js/control_panel/favorite_menu.js b/addons/web/static/src/js/control_panel/favorite_menu.js
index 066b30f30d5..ff09109fe59 100644
--- a/addons/web/static/src/js/control_panel/favorite_menu.js
+++ b/addons/web/static/src/js/control_panel/favorite_menu.js
@@ -5,7 +5,7 @@ odoo.define('web.FavoriteMenu', function (require) {
     const DropdownMenu = require('web.DropdownMenu');
     const { FACET_ICONS } = require("web.searchUtils");
     const Registry = require('web.Registry');
-    const { useModel } = require('web.model');
+    const { useModel } = require('web/static/src/js/model.js');
 
     /**
      * 'Favorites' menu
@@ -22,7 +22,7 @@ odoo.define('web.FavoriteMenu', function (require) {
         constructor() {
             super(...arguments);
 
-            this.model = useModel('controlPanelModel');
+            this.model = useModel('searchModel');
             this.state.deletedFavorite = false;
         }
 
@@ -41,7 +41,7 @@ odoo.define('web.FavoriteMenu', function (require) {
          * @override
          */
         get items() {
-            const favorites = this.model.getFiltersOfType('favorite');
+            const favorites = this.model.get('filters', f => f.type === 'favorite');
             const registryMenus = this.constructor.registry.values().reduce(
                 (menus, Component) => {
                     if (Component.shouldBeDisplayed(this.env)) {
@@ -91,7 +91,7 @@ odoo.define('web.FavoriteMenu', function (require) {
          * @private
          */
         async _onRemoveFavorite() {
-            await this.model.dispatch('deleteFavorite', this.state.deletedFavorite.id);
+            this.model.dispatch('deleteFavorite', this.state.deletedFavorite.id);
             this.state.deletedFavorite = false;
         }
     }
diff --git a/addons/web/static/src/js/control_panel/filter_menu.js b/addons/web/static/src/js/control_panel/filter_menu.js
index 2341def75b0..da37eb2359b 100644
--- a/addons/web/static/src/js/control_panel/filter_menu.js
+++ b/addons/web/static/src/js/control_panel/filter_menu.js
@@ -4,7 +4,7 @@ odoo.define('web.FilterMenu', function (require) {
     const CustomFilterItem = require('web.CustomFilterItem');
     const DropdownMenu = require('web.DropdownMenu');
     const { FACET_ICONS } = require("web.searchUtils");
-    const { useModel } = require('web.model');
+    const { useModel } = require('web/static/src/js/model.js');
 
     /**
      * 'Filters' menu
@@ -20,7 +20,7 @@ odoo.define('web.FilterMenu', function (require) {
         constructor() {
             super(...arguments);
 
-            this.model = useModel('controlPanelModel');
+            this.model = useModel('searchModel');
         }
 
         //---------------------------------------------------------------------
@@ -38,7 +38,7 @@ odoo.define('web.FilterMenu', function (require) {
          * @override
          */
         get items() {
-            return this.model.getFiltersOfType('filter');
+            return this.model.get('filters', f => f.type === 'filter');
         }
 
         /**
diff --git a/addons/web/static/src/js/control_panel/groupby_menu.js b/addons/web/static/src/js/control_panel/groupby_menu.js
index 97bad1a2ce7..546952ad50d 100644
--- a/addons/web/static/src/js/control_panel/groupby_menu.js
+++ b/addons/web/static/src/js/control_panel/groupby_menu.js
@@ -4,7 +4,7 @@ odoo.define('web.GroupByMenu', function (require) {
     const CustomGroupByItem = require('web.CustomGroupByItem');
     const DropdownMenu = require('web.DropdownMenu');
     const { FACET_ICONS, GROUPABLE_TYPES } = require('web.searchUtils');
-    const { useModel } = require('web.model');
+    const { useModel } = require('web/static/src/js/model.js');
 
     /**
      * 'Group by' menu
@@ -24,7 +24,7 @@ odoo.define('web.GroupByMenu', function (require) {
                 .filter(field => this._validateField(field))
                 .sort(({ string: a }, { string: b }) => a > b ? 1 : a < b ? -1 : 0);
 
-            this.model = useModel('controlPanelModel');
+            this.model = useModel('searchModel');
         }
 
         //---------------------------------------------------------------------
@@ -42,7 +42,7 @@ odoo.define('web.GroupByMenu', function (require) {
          * @override
          */
         get items() {
-            return this.model.getFiltersOfType('groupBy');
+            return this.model.get('filters', f => f.type === 'groupBy');
         }
 
         /**
diff --git a/addons/web/static/src/js/control_panel/search_bar.js b/addons/web/static/src/js/control_panel/search_bar.js
index 3082c38c055..22f6ee6a60b 100644
--- a/addons/web/static/src/js/control_panel/search_bar.js
+++ b/addons/web/static/src/js/control_panel/search_bar.js
@@ -4,7 +4,7 @@ odoo.define('web.SearchBar', function (require) {
     const Domain = require('web.Domain');
     const field_utils = require('web.field_utils');
     const { useAutofocus } = require('web.custom_hooks');
-    const { useModel } = require('web.model');
+    const { useModel } = require('web/static/src/js/model.js');
 
     const CHAR_FIELDS = ['char', 'html', 'many2many', 'many2one', 'one2many', 'text'];
     const { Component, hooks } = owl;
@@ -42,14 +42,14 @@ odoo.define('web.SearchBar', function (require) {
 
             this.focusOnUpdate = useAutofocus();
             this.inputRef = useRef('search-input');
-            this.model = useModel('controlPanelModel');
+            this.model = useModel('searchModel');
             this.state = useState({
                 sources: [],
                 focusedItem: 0,
                 inputValue: "",
             });
 
-            this.autoCompleteSources = this.model.getFiltersOfType('field').map(
+            this.autoCompleteSources = this.model.get('filters', f => f.type === 'field').map(
                 filter => this._createSource(filter)
             );
             this.noResultItem = [null, this.env._t("(no result)")];
@@ -60,15 +60,15 @@ odoo.define('web.SearchBar', function (require) {
 
         mounted() {
             // 'search' will always patch the search bar, 'focus' will never.
-            this.env.controlPanelModel.on('search', this, this.focusOnUpdate);
-            this.env.controlPanelModel.on('focus-control-panel', this, () => {
+            this.env.searchModel.on('search', this, this.focusOnUpdate);
+            this.env.searchModel.on('focus-control-panel', this, () => {
                 this.inputRef.el.focus();
             });
         }
 
         willUnmount() {
-            this.env.controlPanelModel.off('search', this);
-            this.env.controlPanelModel.off('focus-control-panel', this);
+            this.env.searchModel.off('search', this);
+            this.env.searchModel.off('focus-control-panel', this);
         }
 
         //---------------------------------------------------------------------
@@ -376,9 +376,8 @@ odoo.define('web.SearchBar', function (require) {
                         this.state.focusedItem = this.state.sources.indexOf(currentItem.parent);
                         // Priority 3: Do nothing (navigation inside text).
                     } else if (ev.target.selectionStart === 0) {
-                        const facets = this.model.getFacets();
                         // Priority 4: navigate to rightmost facet.
-                        this._focusFacet(facets.length - 1);
+                        this._focusFacet(this.model.get("facets").length - 1);
                     }
                     break;
                 case 'ArrowRight':
@@ -408,7 +407,7 @@ odoo.define('web.SearchBar', function (require) {
                     break;
                 case 'Backspace':
                     if (!this.state.inputValue.length) {
-                        const facets = this.model.getFacets();
+                        const facets = this.model.get("facets");
                         if (facets.length) {
                             this._onFacetRemove(facets[facets.length - 1]);
                         }