[IMP] web_refresher: Work as component of control panel

web_refresher/static/src/js/refresher.js

@@ -0,0 +1,42 @@
+/* Copyright 2022 Tecnativa - Alexandre D. Díaz
+ * License AGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). */
+odoo.define("refresher.Refresher", function (require) {
+    "use strict";
+
+    const ControlPanel = require("web.ControlPanel");
+
+    const {Component, hooks} = owl;
+    const {useRef} = hooks;
+
+    class Refresher extends Component {
+        _doRefresh() {
+            // Note: here we use the pager props, see xml
+            const {limit, currentMinimum} = this.props;
+            this.trigger("pager-changed", {currentMinimum, limit});
+        }
+    }
+    Refresher.template = "web_refresher.Button";
+
+    // Patch control panel to initialize refresher component
+    ControlPanel.components = Object.assign({}, ControlPanel.components, {
+        Refresher,
+    });
+    ControlPanel.patch("web_refresher.ControlPanel", (T) => {
+        class ControlPanelRefresher extends T {
+            constructor() {
+                super(...arguments);
+                if ("cp_content" in this.props) {
+                    const content = this.props.cp_content || {};
+                    if ("$refresher" in content) {
+                        this.additionalContent.refresher = content.$refresher;
+                    }
+                }
+
+                this.contentRefs.refresher = useRef("refresher");
+            }
+        }
+        return ControlPanelRefresher;
+    });
+
+    return Refresher;
+});

web_refresher/static/src/scss/refresher.scss

@@ -0,0 +1,7 @@
+.oe_cp_refresher {
+    margin: auto 0 auto auto;
+    padding-left: 5px;
+    text-align: right;
+    user-select: none;
+    flex-grow: 1;
+}

web_refresher/static/src/xml/pager_button.xml

@@ -1,25 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" ?>
-<!-- Copyright 2021 Tecnativa - João Marques
-     License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl). -->
-<template>
-    <t
-        t-name="web_refresher.Pager"
-        t-inherit="web.Pager"
-        t-inherit-mode="extension"
-        owl="1"
-    >
-        <xpath expr="//span[hasclass('o_pager_counter')]" position="before">
-            <span class="btn-group" aria-atomic="true">
-                <button
-                    type="button"
-                    class="fa fa-refresh btn btn-secondary o_pager_refresh"
-                    aria-label="Refresh"
-                    title="Refresh"
-                    tabindex="-1"
-                    t-on-click="_changeSelection(0)"
-                    style="margin-right: 5px;"
-                />
-            </span>
-        </xpath>
-    </t>
-</template>

web_refresher/static/src/xml/refresher.xml

@@ -0,0 +1,45 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<!-- Copyright 2022 Tecnativa - Alexandre Díaz
+     License AGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). -->
+<template>
+
+    <t
+        t-name="web_refresher.ControlPanel"
+        t-inherit="web.ControlPanel"
+        t-inherit-mode="extension"
+        owl="1"
+    >
+        <xpath expr="//div[hasclass('o_cp_pager')]" position="before">
+            <div class="oe_cp_refresher" role="search" t-ref="refresher">
+                <Refresher t-props="props.pager" />
+            </div>
+        </xpath>
+    </t>
+
+    <t
+        t-name="web_refresher.ControlPanelX2Many"
+        t-inherit="web.ControlPanelX2Many"
+        t-inherit-mode="extension"
+        owl="1"
+    >
+        <xpath expr="//div[hasclass('o_cp_pager')]" position="before">
+            <div class="oe_cp_refresher" role="search" t-ref="refresher">
+                <Refresher t-props="props.pager" />
+            </div>
+        </xpath>
+    </t>
+
+    <t t-name="web_refresher.Button" owl="1">
+        <nav class="oe_refresher" aria-label="Pager">
+            <span aria-atomic="true">
+                <button
+                    class="fa fa-refresh btn btn-icon oe_pager_refresh"
+                    aria-label="Refresh"
+                    t-on-click="_doRefresh"
+                    title="Refresh"
+                    tabindex="-1"
+                />
+            </span>
+        </nav>
+    </t>
+</template>