[REF] web: graph and pivot: rework view props

This commit simplifies the props of the GraphView. We only keep
props that are necessary (e.g. for the dashboard view), and for the
others, we find the information in the arch. That way, there's only
one way to do, which is easier to understand.

We also remove the "display" and "title" props from pivot as they
weren't used.

X-original-commit: c26953ef15b0846282bbeccd7cf0de25e1a47392
Part-of: odoo/odoo#76918

addons/web/static/src/views/graph/graph_arch_parser.js

@@ -5,15 +5,15 @@ import { GROUPABLE_TYPES } from "@web/search/utils/misc";
 import { XMLParser } from "@web/core/utils/xml";
 import { archParseBoolean } from "../helpers/utils";
 
-export const MODES = ["bar", "line", "pie"];
-export const ORDERS = ["ASC", "DESC", null];
+const MODES = ["bar", "line", "pie"];
+const ORDERS = ["ASC", "DESC", null];
 
 export class GraphArchParser extends XMLParser {
     parse(arch, fields = {}) {
         const archInfo = { fields, fieldAttrs: {}, groupBy: [] };
         this.visitXML(arch, (node) => {
             switch (node.tagName) {
-                case "graph":
+                case "graph": {
                     if (node.hasAttribute("disable_linking")) {
                         archInfo.disableLinking = archParseBoolean(
                             node.getAttribute("disable_linking")
@@ -35,7 +35,8 @@ export class GraphArchParser extends XMLParser {
                         archInfo.title = title;
                     }
                     break;
-                case "field":
+                }
+                case "field": {
                     let fieldName = node.getAttribute("name"); // exists (rng validation)
                     if (fieldName === "id") {
                         break;
@@ -73,6 +74,7 @@ export class GraphArchParser extends XMLParser {
                         }
                     }
                     break;
+                }
             }
         });
         return archInfo;

addons/web/static/src/views/graph/graph_renderer.js

@@ -251,12 +251,11 @@ export class GraphRenderer extends Component {
      * @returns {Object}
      */
     getLegendOptions() {
-        const { display, mode } = this.props.metaData;
+        const { mode } = this.props.metaData;
         const { data } = this.props;
         const refLength = mode === "pie" ? data.labels.length : data.datasets.length;
-        const displayLegend = "legend" in display ? display.legend : true;
         const legendOptions = {
-            display: refLength <= 20 && displayLegend,
+            display: refLength <= 20,
             position: "top",
             onHover: this.onlegendHover.bind(this),
             onLeave: this.onLegendLeave.bind(this),
@@ -403,7 +402,7 @@ export class GraphRenderer extends Component {
     getScaleOptions() {
         const {
             allIntegers,
-            display,
+            displayScaleLabels,
             fields,
             groupBy,
             measure,
@@ -413,7 +412,6 @@ export class GraphRenderer extends Component {
         if (mode === "pie") {
             return {};
         }
-        const displayScaleLabels = "scaleLabels" in display ? display.scaleLabels : true;
         const xAxe = {
             type: "category",
             scaleLabel: {

addons/web/static/src/views/graph/graph_view.js

@@ -3,7 +3,7 @@
 import { _lt } from "@web/core/l10n/translation";
 import { ControlPanel } from "@web/search/control_panel/control_panel";
 import { SearchPanel } from "@web/search/search_panel/search_panel";
-import { GraphArchParser, MODES, ORDERS } from "./graph_arch_parser";
+import { GraphArchParser } from "./graph_arch_parser";
 import { GraphModel } from "./graph_model";
 import { GraphRenderer } from "./graph_renderer";
 import { GroupByMenu } from "@web/search/group_by_menu/group_by_menu";
@@ -17,37 +17,31 @@ const viewRegistry = registry.category("views");
 
 const { Component } = owl;
 
-const KEYS = [
-    "additionalMeasures",
-    "disableLinking",
-    "display",
-    "fields",
-    "fieldAttrs",
-    "groupBy",
-    "measure",
-    "mode",
-    "order",
-    "resModel",
-    "stacked",
-    "title",
-];
-
 export class GraphView extends Component {
     setup() {
         this.actionService = useService("action");
 
         let modelParams;
-        if (this.props.state && this.props.state.metaData) {
-            // check this (dashboard testss)
+        if (this.props.state) {
             modelParams = this.props.state.metaData;
         } else {
             const { arch, fields } = this.props;
             const parser = new this.constructor.ArchParser();
             const archInfo = parser.parse(arch, fields);
-            modelParams = {};
-            for (const key of KEYS) {
-                modelParams[key] = key in archInfo ? archInfo[key] : this.props[key];
-            }
+            modelParams = {
+                additionalMeasures: this.props.additionalMeasures,
+                disableLinking: Boolean(archInfo.disableLinking),
+                displayScaleLabels: this.props.displayScaleLabels,
+                fieldAttrs: archInfo.fieldAttrs,
+                fields: this.props.fields,
+                groupBy: archInfo.groupBy,
+                measure: archInfo.measure || "__count",
+                mode: archInfo.mode || "bar",
+                order: archInfo.order || null,
+                resModel: this.props.resModel,
+                stacked: "stacked" in archInfo ? archInfo.stacked : true,
+                title: archInfo.title || this.env._t("Untitled"),
+            };
         }
 
         this.model = useModel(this.constructor.Model, modelParams);
@@ -142,24 +136,15 @@ GraphView.components = { ControlPanel, GroupByMenu, Renderer: GraphRenderer, Sea
 
 GraphView.defaultProps = {
     additionalMeasures: [],
-    disableLinking: false,
-    display: {},
-    measure: "__count",
-    mode: "bar",
-    order: null,
-    stacked: true,
+    displayGroupByMenu: false,
+    displayScaleLabels: true,
 };
 
 GraphView.props = {
     ...standardViewProps,
     additionalMeasures: { type: Array, elements: String, optional: true },
-    disableLinking: { type: Boolean, optional: true },
-    display: { type: Object, optional: true },
-    measure: { type: String, optional: true },
-    mode: { validate: (m) => MODES.includes(m), optional: true },
-    order: { validate: (o) => ORDERS.includes(o), optional: true },
-    stacked: { type: Boolean, optional: true },
-    title: { type: String, optional: true },
+    displayGroupByMenu: { type: Boolean, optional: true },
+    displayScaleLabels: { type: Boolean, optional: true },
 };
 
 GraphView.type = "graph";

addons/web/static/src/views/graph/graph_view.xml

@@ -8,7 +8,7 @@
                 <t t-set="activeMeasures" t-value="[model.metaData.measure]"/>
             </t>
         </div>
-        <t t-if="props.display and props.display['bottom-right'] === false">
+        <t t-if="props.displayGroupByMenu">
             <div class="btn-group" role="toolbar" aria-label="Group By">
                 <GroupByMenu showCaretDown="true"/>
             </div>

addons/web/static/src/views/pivot/pivot_view.js

@@ -45,7 +45,7 @@ export class PivotView extends Component {
                 fieldAttrs: archInfo.fieldAttrs,
                 resModel: this.props.resModel,
                 rowGroupBys: archInfo.rowGroupBys,
-                title: this.props.title || archInfo.title || this.env._t("Untitled"),
+                title: archInfo.title || this.env._t("Untitled"),
                 widgets: archInfo.widgets,
             };
         }
@@ -162,12 +162,9 @@ PivotView.components = { ControlPanel, SearchPanel, Renderer: PivotRenderer };
 PivotView.props = {
     ...standardViewProps,
     additionalMeasures: { type: Array, elements: String, optional: 1 },
-    display: { type: Object, optional: 1 },
-    title: { type: String, optional: 1 },
 };
 PivotView.defaultProps = {
     additionalMeasures: [],
-    display: {},
 };
 
 PivotView.Model = PivotModel;

addons/web/static/src/views/view.js

@@ -87,6 +87,7 @@ const STANDARD_PROPS = new Set([
     "noContentHelp",
 
     "breadcrumbs",
+    "display",
     "viewSwitcherEntries",
 
     "globalState",

addons/web/static/tests/views/graph_view_tests.js

@@ -1,16 +1,17 @@
 /** @odoo-module **/
 
 import { BORDER_WHITE, DEFAULT_BG } from "@web/views/graph/colors";
-import { click, makeDeferred, nextTick, triggerEvent } from "@web/../tests/helpers/utils";
-import { createWebClient, doAction } from "@web/../tests/webclient/helpers";
 import { dialogService } from "@web/core/dialog/dialog_service";
 import { GraphArchParser } from "@web/views/graph/graph_arch_parser";
-import { makeView } from "./helpers";
 import { registry } from "@web/core/registry";
-import { setupControlPanelServiceRegistry } from "@web/../tests/search/helpers";
+import { makeView } from "./helpers";
+import { click, makeDeferred, nextTick, triggerEvent } from "@web/../tests/helpers/utils";
+import { makeFakeLocalizationService } from "@web/../tests/helpers/mock_services";
+import { createWebClient, doAction } from "@web/../tests/webclient/helpers";
 import {
     editFavoriteName,
     saveFavorite,
+    setupControlPanelServiceRegistry,
     switchView,
     toggleFavoriteMenu,
     toggleFilterMenu,
@@ -2066,7 +2067,7 @@ QUnit.module("Views", (hooks) => {
             type: "graph",
             resModel: "foo",
             arch: `
-                <graph string="Gloups">
+                <graph>
                     <field name="product_id"/>
                 </graph>
             `,
@@ -2864,6 +2865,7 @@ QUnit.module("Views", (hooks) => {
     QUnit.test('graph view with attribute disable_linking="1"', async function (assert) {
         assert.expect(4);
 
+        serviceRegistry.add("localization", makeFakeLocalizationService());
         serviceRegistry.add(
             "action",
             {

addons/web/static/tests/views/pivot_view_tests.js

@@ -398,7 +398,6 @@ QUnit.module("Views", (hooks) => {
         patchWithCleanup(session, {
             user_context: { userContextKey: true },
         });
-
         const fakeActionService = {
             start() {
                 return {
@@ -432,12 +431,11 @@ QUnit.module("Views", (hooks) => {
             resModel: "partner",
             serverData,
             arch: `
-                <pivot>
+                <pivot string="Partners">
                     <field name="product_id" type="row"/>
                     <field name="foo" type="measure"/>
                 </pivot>`,
             context: { someKey: true, search_default_test: 3 },
-            title: "Partners", // FIXME props ignored
             views: [
                 [2, "form"],
                 [5, "kanban"],
@@ -666,7 +664,6 @@ QUnit.module("Views", (hooks) => {
                     <filter name="date_filter" date="date" domain="[]" default_period='this_month'/>
                 </search>`,
             context: { search_default_date_filter: true },
-            title: "Partners",
         });
 
         assert.hasClass(
@@ -715,7 +712,6 @@ QUnit.module("Views", (hooks) => {
                         <filter name="date_filter" date="date" domain="[]" default_period='this_month'/>
                     </search>`,
                 context: { search_default_date_filter: true },
-                title: "Partners",
             });
 
             await toggleComparisonMenu(pivot);