From 21659b9e545ed926d8392eb02717b6c2bc7d26e9 Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Thu, 21 Aug 2025 13:41:18 -0500
Subject: [PATCH 01/16] [IMP] web_refresher: add auto refresh on interval

---
 web_refresher/__manifest__.py                |  2 +-
 web_refresher/static/src/js/refresher.esm.js | 49 ++++++++++++++++++--
 web_refresher/static/src/xml/refresher.xml   | 31 ++++++++++---
 3 files changed, 70 insertions(+), 12 deletions(-)

diff --git a/web_refresher/__manifest__.py b/web_refresher/__manifest__.py
index dccde6e64684..5115eeda1b8d 100644
--- a/web_refresher/__manifest__.py
+++ b/web_refresher/__manifest__.py
@@ -1,6 +1,6 @@
 {
     "name": "Web Refresher",
-    "version": "18.0.1.0.0",
+    "version": "18.0.2.0.0",
     "author": "Compassion Switzerland, Tecnativa, Odoo Community Association (OCA)",
     "license": "AGPL-3",
     "website": "https://github.com/OCA/web",
diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index b8aadcea9538..08ad74137e37 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -13,10 +13,10 @@ export function useRefreshAnimation(timeout) {
 
     /**
      * @returns {DOMTokenList|null}
-     */
-    function contentClassList() {
-        const content = document.querySelector(".o_content");
-        return content ? content.classList : null;
+    */
+   function contentClassList() {
+       const content = document.querySelector(".o_content");
+       return content ? content.classList : null;
     }
 
     function clearAnimationTimeout() {
@@ -39,11 +39,15 @@ export function useRefreshAnimation(timeout) {
 }
 
 export class Refresher extends Component {
+
     setup() {
         super.setup();
         this.action = useService("action");
         this.refreshAnimation = useRefreshAnimation(1000);
         this.onClickRefresh = useDebounced(this.onClickRefresh, 200);
+        this.onChangeAutoRefreshInterval = this.onChangeAutoRefreshInterval.bind(this);
+        this.refreshInterval = -1;
+        this.runningRefresherId = null;
     }
 
     /**
@@ -81,6 +85,16 @@ export class Refresher extends Component {
         if (!updated) {
             updated = this._searchModelRefresh();
         }
+        // Check the refreshInterval is greater than 0 and start a timer for the next refresh
+        if (this.refreshInterval > 0) {
+            // always attempt to clear a running timeout in case the refresh was done manually
+            if (typeof this.runningRefresherId === 'number') {
+                clearTimeout(this.runningRefresherId);
+            }
+            this.runningRefresherId = setTimeout(() => {
+                this.refresh();
+            }, this.refreshInterval);
+        }
         return updated;
     }
 
@@ -111,6 +125,33 @@ export class Refresher extends Component {
             this.refreshAnimation();
         }
     }
+
+    onChangeAutoRefreshInterval(clickedOption) {
+        const newInterval = parseInt(clickedOption.value ?? clickedOption.target.value) ?? null;
+        this.refreshInterval = newInterval;
+        this._setIntervalButtonText();
+        if (this.runningRefresherId) {
+            clearTimeout(this.runningRefresherId);
+        }
+        this.refresh();
+    }
+
+    _setIntervalButtonText() {
+        let intervalValue;
+        if (!this.refreshInterval || this.refreshInterval <= 0) {
+            intervalValue = "Off";
+            document.getElementById('manual-refresh-icon').classList.remove('fa-spin');
+        } else {
+            const intervalInSeconds = this.refreshInterval / 1000;
+            if (intervalInSeconds >= 60) {
+                intervalValue = `${Math.floor(intervalInSeconds / 60)}min`;
+            } else {
+                intervalValue = `${intervalInSeconds}s`;
+            }
+            document.getElementById('manual-refresh-icon').classList.add('fa-spin');
+        }
+        document.getElementById('auto-refresh-dd').textContent = `Auto Refresh: ${intervalValue}`;
+    }
 }
 
 Object.assign(Refresher, {
diff --git a/web_refresher/static/src/xml/refresher.xml b/web_refresher/static/src/xml/refresher.xml
index 4827c5a656b1..8b526c070193 100644
--- a/web_refresher/static/src/xml/refresher.xml
+++ b/web_refresher/static/src/xml/refresher.xml
@@ -5,13 +5,30 @@
 <template>
     <t t-name="web_refresher.Button">
         <nav class="oe_refresher" aria-label="Refresher" aria-atomic="true">
-            <button
-                class="fa fa-refresh btn btn-icon oe_pager_refresh"
-                aria-label="Refresh"
-                t-on-click="onClickRefresh"
-                title="Refresh"
-                tabindex="-1"
-            />
+            <div class="btn-group" role="group">
+                <div class="btn-group" role="group">
+                    <button id="auto-refresh-dd" class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
+                        Auto Refresh: Off
+                    </button>
+                    <div class="dropdown-menu" aria-labelledby="auto-refresh-dd">
+                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="-1">Off</button>
+                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="1000">1s</button>
+                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="5000">5s</button>
+                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="10000">10s</button>
+                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="30000">30s</button>
+                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="60000">1min</button>
+                    </div>
+                </div>
+                <button
+                    id="manual-refresh-btn"
+                    class="btn btn-secondary m-0"
+                    aria-label="Refresh"
+                    t-on-click="onClickRefresh"
+                    title="Refresh"
+                    tabindex="-1">
+                    <i id="manual-refresh-icon" class="fa fa-refresh"></i>
+                </button>
+            </div>
         </nav>
     </t>
 </template>

From e0da3975660548855011cac5d1e80b8d03898a92 Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Thu, 21 Aug 2025 13:53:32 -0500
Subject: [PATCH 02/16] [FIX] web_refresher: linting

---
 web_refresher/static/src/js/refresher.esm.js | 23 ++++-----
 web_refresher/static/src/xml/refresher.xml   | 49 ++++++++++++++++----
 2 files changed, 52 insertions(+), 20 deletions(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index 08ad74137e37..3156eacaba4b 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -13,10 +13,10 @@ export function useRefreshAnimation(timeout) {
 
     /**
      * @returns {DOMTokenList|null}
-    */
-   function contentClassList() {
-       const content = document.querySelector(".o_content");
-       return content ? content.classList : null;
+     */
+    function contentClassList() {
+        const content = document.querySelector(".o_content");
+        return content ? content.classList : null;
     }
 
     function clearAnimationTimeout() {
@@ -39,7 +39,6 @@ export function useRefreshAnimation(timeout) {
 }
 
 export class Refresher extends Component {
-
     setup() {
         super.setup();
         this.action = useService("action");
@@ -87,8 +86,8 @@ export class Refresher extends Component {
         }
         // Check the refreshInterval is greater than 0 and start a timer for the next refresh
         if (this.refreshInterval > 0) {
-            // always attempt to clear a running timeout in case the refresh was done manually
-            if (typeof this.runningRefresherId === 'number') {
+            // Always attempt to clear a running timeout in case the refresh was done manually
+            if (typeof this.runningRefresherId === "number") {
                 clearTimeout(this.runningRefresherId);
             }
             this.runningRefresherId = setTimeout(() => {
@@ -127,7 +126,8 @@ export class Refresher extends Component {
     }
 
     onChangeAutoRefreshInterval(clickedOption) {
-        const newInterval = parseInt(clickedOption.value ?? clickedOption.target.value) ?? null;
+        const newInterval =
+            parseInt(clickedOption.value ?? clickedOption.target.value) ?? null;
         this.refreshInterval = newInterval;
         this._setIntervalButtonText();
         if (this.runningRefresherId) {
@@ -140,7 +140,7 @@ export class Refresher extends Component {
         let intervalValue;
         if (!this.refreshInterval || this.refreshInterval <= 0) {
             intervalValue = "Off";
-            document.getElementById('manual-refresh-icon').classList.remove('fa-spin');
+            document.getElementById("manual-refresh-icon").classList.remove("fa-spin");
         } else {
             const intervalInSeconds = this.refreshInterval / 1000;
             if (intervalInSeconds >= 60) {
@@ -148,9 +148,10 @@ export class Refresher extends Component {
             } else {
                 intervalValue = `${intervalInSeconds}s`;
             }
-            document.getElementById('manual-refresh-icon').classList.add('fa-spin');
+            document.getElementById("manual-refresh-icon").classList.add("fa-spin");
         }
-        document.getElementById('auto-refresh-dd').textContent = `Auto Refresh: ${intervalValue}`;
+        document.getElementById("auto-refresh-dd").textContent =
+            `Auto Refresh: ${intervalValue}`;
     }
 }
 
diff --git a/web_refresher/static/src/xml/refresher.xml b/web_refresher/static/src/xml/refresher.xml
index 8b526c070193..b3e7d7ab218b 100644
--- a/web_refresher/static/src/xml/refresher.xml
+++ b/web_refresher/static/src/xml/refresher.xml
@@ -7,16 +7,46 @@
         <nav class="oe_refresher" aria-label="Refresher" aria-atomic="true">
             <div class="btn-group" role="group">
                 <div class="btn-group" role="group">
-                    <button id="auto-refresh-dd" class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
+                    <button
+                        id="auto-refresh-dd"
+                        class="btn btn-secondary dropdown-toggle"
+                        type="button"
+                        data-bs-toggle="dropdown"
+                        aria-expanded="false"
+                    >
                         Auto Refresh: Off
                     </button>
                     <div class="dropdown-menu" aria-labelledby="auto-refresh-dd">
-                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="-1">Off</button>
-                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="1000">1s</button>
-                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="5000">5s</button>
-                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="10000">10s</button>
-                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="30000">30s</button>
-                        <button class="dropdown-item" t-on-click="onChangeAutoRefreshInterval" value="60000">1min</button>
+                        <button
+                            class="dropdown-item"
+                            t-on-click="onChangeAutoRefreshInterval"
+                            value="-1"
+                        >Off</button>
+                        <button
+                            class="dropdown-item"
+                            t-on-click="onChangeAutoRefreshInterval"
+                            value="1000"
+                        >1s</button>
+                        <button
+                            class="dropdown-item"
+                            t-on-click="onChangeAutoRefreshInterval"
+                            value="5000"
+                        >5s</button>
+                        <button
+                            class="dropdown-item"
+                            t-on-click="onChangeAutoRefreshInterval"
+                            value="10000"
+                        >10s</button>
+                        <button
+                            class="dropdown-item"
+                            t-on-click="onChangeAutoRefreshInterval"
+                            value="30000"
+                        >30s</button>
+                        <button
+                            class="dropdown-item"
+                            t-on-click="onChangeAutoRefreshInterval"
+                            value="60000"
+                        >1min</button>
                     </div>
                 </div>
                 <button
@@ -25,8 +55,9 @@
                     aria-label="Refresh"
                     t-on-click="onClickRefresh"
                     title="Refresh"
-                    tabindex="-1">
-                    <i id="manual-refresh-icon" class="fa fa-refresh"></i>
+                    tabindex="-1"
+                >
+                    <i id="manual-refresh-icon" class="fa fa-refresh" />
                 </button>
             </div>
         </nav>

From db951f680c69e17fdb36a1d31beb477c99cd6020 Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Thu, 21 Aug 2025 14:04:18 -0500
Subject: [PATCH 03/16] [CHORE] web_refresher: one more lint fix

---
 web_refresher/static/src/js/refresher.esm.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index 3156eacaba4b..7916e91629c3 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -127,7 +127,7 @@ export class Refresher extends Component {
 
     onChangeAutoRefreshInterval(clickedOption) {
         const newInterval =
-            parseInt(clickedOption.value ?? clickedOption.target.value) ?? null;
+            parseInt(clickedOption.value ?? clickedOption.target.value) ?? -1;
         this.refreshInterval = newInterval;
         this._setIntervalButtonText();
         if (this.runningRefresherId) {
@@ -137,7 +137,7 @@ export class Refresher extends Component {
     }
 
     _setIntervalButtonText() {
-        let intervalValue;
+        let intervalValue = 'Off';
         if (!this.refreshInterval || this.refreshInterval <= 0) {
             intervalValue = "Off";
             document.getElementById("manual-refresh-icon").classList.remove("fa-spin");

From 888ab62f06eebf4742bc85ac8254e5b3cae35858 Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Mon, 1 Sep 2025 07:18:18 -0500
Subject: [PATCH 04/16] [CHORE] web_refresher: one more lint fix

---
 web_refresher/static/src/js/refresher.esm.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index 7916e91629c3..a24a58cd9936 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -39,13 +39,15 @@ export function useRefreshAnimation(timeout) {
 }
 
 export class Refresher extends Component {
+    autoRefreshIntervalKey = "autoRefreshInterval";
     setup() {
         super.setup();
         this.action = useService("action");
         this.refreshAnimation = useRefreshAnimation(1000);
         this.onClickRefresh = useDebounced(this.onClickRefresh, 200);
         this.onChangeAutoRefreshInterval = this.onChangeAutoRefreshInterval.bind(this);
-        this.refreshInterval = -1;
+        this.refreshInterval = localStorage.getItem(this.autoRefreshIntervalKey) ?? -1;
+        this._setIntervalButtonText();
         this.runningRefresherId = null;
     }
 
@@ -128,6 +130,7 @@ export class Refresher extends Component {
     onChangeAutoRefreshInterval(clickedOption) {
         const newInterval =
             parseInt(clickedOption.value ?? clickedOption.target.value) ?? -1;
+        localStorage.setItem(this.autoRefreshIntervalKey, newInterval);
         this.refreshInterval = newInterval;
         this._setIntervalButtonText();
         if (this.runningRefresherId) {

From 756622274b9f621d39aa02cca660102e3830d214 Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Mon, 1 Sep 2025 07:23:00 -0500
Subject: [PATCH 05/16] [IMP] web_refresher: make the interval text cleaner

---
 web_refresher/static/src/js/refresher.esm.js | 13 +++----------
 web_refresher/static/src/xml/refresher.xml   |  2 +-
 2 files changed, 4 insertions(+), 11 deletions(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index a24a58cd9936..335731e4faa0 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -131,8 +131,9 @@ export class Refresher extends Component {
         const newInterval =
             parseInt(clickedOption.value ?? clickedOption.target.value) ?? -1;
         localStorage.setItem(this.autoRefreshIntervalKey, newInterval);
+        const newIntervalText = clickedOption.textContent ?? clickedOption.target.textContent;
         this.refreshInterval = newInterval;
-        this._setIntervalButtonText();
+        this._setIntervalButtonText(newIntervalText);
         if (this.runningRefresherId) {
             clearTimeout(this.runningRefresherId);
         }
@@ -142,19 +143,11 @@ export class Refresher extends Component {
     _setIntervalButtonText() {
         let intervalValue = 'Off';
         if (!this.refreshInterval || this.refreshInterval <= 0) {
-            intervalValue = "Off";
             document.getElementById("manual-refresh-icon").classList.remove("fa-spin");
         } else {
-            const intervalInSeconds = this.refreshInterval / 1000;
-            if (intervalInSeconds >= 60) {
-                intervalValue = `${Math.floor(intervalInSeconds / 60)}min`;
-            } else {
-                intervalValue = `${intervalInSeconds}s`;
-            }
             document.getElementById("manual-refresh-icon").classList.add("fa-spin");
         }
-        document.getElementById("auto-refresh-dd").textContent =
-            `Auto Refresh: ${intervalValue}`;
+        document.getElementById("auto-refresh-interval-text").textContent = intervalText;
     }
 }
 
diff --git a/web_refresher/static/src/xml/refresher.xml b/web_refresher/static/src/xml/refresher.xml
index b3e7d7ab218b..cac20be924f8 100644
--- a/web_refresher/static/src/xml/refresher.xml
+++ b/web_refresher/static/src/xml/refresher.xml
@@ -14,7 +14,7 @@
                         data-bs-toggle="dropdown"
                         aria-expanded="false"
                     >
-                        Auto Refresh: Off
+                        Auto Refresh: <span id="auto-refresh-interval-text">Off</span>
                     </button>
                     <div class="dropdown-menu" aria-labelledby="auto-refresh-dd">
                         <button

From abdc1c270575ee223857d45cd88ce511ac9e1736 Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Thu, 21 Aug 2025 14:40:46 -0500
Subject: [PATCH 06/16] [CHORE] lint

---
 web_refresher/static/src/js/refresher.esm.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index 335731e4faa0..8642a1c96e22 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -147,7 +147,8 @@ export class Refresher extends Component {
         } else {
             document.getElementById("manual-refresh-icon").classList.add("fa-spin");
         }
-        document.getElementById("auto-refresh-interval-text").textContent = intervalText;
+        document.getElementById("auto-refresh-interval-text").textContent =
+            intervalText;
     }
 }
 

From 7956c867ba48bb3d5bc7985bd1647294277a4c39 Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Mon, 1 Sep 2025 07:24:22 -0500
Subject: [PATCH 07/16] [FIX] parse int from localstorage

---
 web_refresher/static/src/js/refresher.esm.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index 8642a1c96e22..1decce1cc4b5 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -46,7 +46,7 @@ export class Refresher extends Component {
         this.refreshAnimation = useRefreshAnimation(1000);
         this.onClickRefresh = useDebounced(this.onClickRefresh, 200);
         this.onChangeAutoRefreshInterval = this.onChangeAutoRefreshInterval.bind(this);
-        this.refreshInterval = localStorage.getItem(this.autoRefreshIntervalKey) ?? -1;
+        this.refreshInterval = parseInt(localStorage.getItem(this.autoRefreshIntervalKey)) ?? -1;
         this._setIntervalButtonText();
         this.runningRefresherId = null;
     }

From f9ef3c7bd6e653d98dbb15d030f990e95825313c Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Wed, 3 Sep 2025 15:32:54 -0500
Subject: [PATCH 08/16] [FIX] Moving state to local storage and defaulting the
 value on load

---
 web_refresher/static/src/js/refresher.esm.js | 49 +++++++++++++++-----
 1 file changed, 37 insertions(+), 12 deletions(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index 1decce1cc4b5..8e0f2ae782be 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -3,7 +3,7 @@
  * Copyright 2023 Taras Shabaranskyi
  * License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl). */
 
-import {Component} from "@odoo/owl";
+import {Component, onMounted, onWillUnmount} from "@odoo/owl";
 import {useDebounced} from "@web/core/utils/timing";
 import {useService} from "@web/core/utils/hooks";
 
@@ -46,11 +46,32 @@ export class Refresher extends Component {
         this.refreshAnimation = useRefreshAnimation(1000);
         this.onClickRefresh = useDebounced(this.onClickRefresh, 200);
         this.onChangeAutoRefreshInterval = this.onChangeAutoRefreshInterval.bind(this);
-        this.refreshInterval = parseInt(localStorage.getItem(this.autoRefreshIntervalKey)) ?? -1;
-        this._setIntervalButtonText();
         this.runningRefresherId = null;
+        const intervalValue = this._getLocalStorageValue();
+        onMounted(() => {
+            this.refreshInterval = intervalValue.refreshInterval;
+            this._setIntervalButtonText(intervalValue.intervalText);
+        });
+        onWillUnmount(() => {
+            if (this.runningRefresherId) {
+                clearTimeout(this.runningRefresherId);
+            }
+        });
+    }
+
+    _getLocalStorageValue() {
+        const jsonValue = localStorage.getItem(this.autoRefreshIntervalKey);
+        if (jsonValue) {
+            const { refreshInterval, intervalText } = JSON.parse(jsonValue);
+            return { refreshInterval: parseInt(refreshInterval ?? -1), intervalText };
+        }
+        return { refreshInterval: -1, intervalText: 'Off' };
     }
 
+    _setLocalStorageValue({ refreshInterval, intervalText }) {
+        const value = JSON.stringify({ refreshInterval, intervalText });
+        localStorage.setItem(this.autoRefreshIntervalKey, value);
+    }
     /**
      * @returns {Boolean}
      * @private
@@ -130,25 +151,29 @@ export class Refresher extends Component {
     onChangeAutoRefreshInterval(clickedOption) {
         const newInterval =
             parseInt(clickedOption.value ?? clickedOption.target.value) ?? -1;
-        localStorage.setItem(this.autoRefreshIntervalKey, newInterval);
         const newIntervalText = clickedOption.textContent ?? clickedOption.target.textContent;
         this.refreshInterval = newInterval;
         this._setIntervalButtonText(newIntervalText);
+        this._setLocalStorageValue({ refreshInterval: newInterval, intervalText: newIntervalText });
         if (this.runningRefresherId) {
             clearTimeout(this.runningRefresherId);
         }
         this.refresh();
     }
 
-    _setIntervalButtonText() {
-        let intervalValue = 'Off';
-        if (!this.refreshInterval || this.refreshInterval <= 0) {
-            document.getElementById("manual-refresh-icon").classList.remove("fa-spin");
-        } else {
-            document.getElementById("manual-refresh-icon").classList.add("fa-spin");
+    _setIntervalButtonText(intervalText = 'Off') {
+        const manualRefreshIcon = document.getElementById("manual-refresh-icon");
+        if (manualRefreshIcon) {
+            if (!this.refreshInterval || this.refreshInterval <= 0) {
+                manualRefreshIcon.classList.remove("fa-spin");
+            } else {
+                manualRefreshIcon.classList.add("fa-spin");
+            }
+        }
+        const refreshText = document.getElementById("auto-refresh-interval-text");
+        if (refreshText) {
+            refreshText.textContent = intervalText;
         }
-        document.getElementById("auto-refresh-interval-text").textContent =
-            intervalText;
     }
 }
 

From 2ad1acef8838d21452212cb65cbf16706da69bc0 Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Wed, 3 Sep 2025 15:35:04 -0500
Subject: [PATCH 09/16] [IMP] Slightly more elegent form of loading

---
 web_refresher/static/src/js/refresher.esm.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index 8e0f2ae782be..779ab1d626cf 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -49,8 +49,7 @@ export class Refresher extends Component {
         this.runningRefresherId = null;
         const intervalValue = this._getLocalStorageValue();
         onMounted(() => {
-            this.refreshInterval = intervalValue.refreshInterval;
-            this._setIntervalButtonText(intervalValue.intervalText);
+            this.onChangeAutoRefreshInterval({ value: intervalValue.refreshInterval, textContent: intervalValue.intervalText });
         });
         onWillUnmount(() => {
             if (this.runningRefresherId) {

From 029006254c105497d3f64aeaddd6442899d1e1f7 Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Wed, 3 Sep 2025 15:39:13 -0500
Subject: [PATCH 10/16] [LINT] fix lint errors

---
 web_refresher/static/src/js/refresher.esm.js | 25 +++++++++++++-------
 1 file changed, 16 insertions(+), 9 deletions(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index 779ab1d626cf..c6acb90717b0 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -49,7 +49,10 @@ export class Refresher extends Component {
         this.runningRefresherId = null;
         const intervalValue = this._getLocalStorageValue();
         onMounted(() => {
-            this.onChangeAutoRefreshInterval({ value: intervalValue.refreshInterval, textContent: intervalValue.intervalText });
+            this.onChangeAutoRefreshInterval({
+                value: intervalValue.refreshInterval,
+                textContent: intervalValue.intervalText
+            });
         });
         onWillUnmount(() => {
             if (this.runningRefresherId) {
@@ -61,14 +64,14 @@ export class Refresher extends Component {
     _getLocalStorageValue() {
         const jsonValue = localStorage.getItem(this.autoRefreshIntervalKey);
         if (jsonValue) {
-            const { refreshInterval, intervalText } = JSON.parse(jsonValue);
-            return { refreshInterval: parseInt(refreshInterval ?? -1), intervalText };
+            const {refreshInterval, intervalText} = JSON.parse(jsonValue);
+            return {refreshInterval: parseInt(refreshInterval ?? -1), intervalText};
         }
-        return { refreshInterval: -1, intervalText: 'Off' };
+        return {refreshInterval: -1, intervalText: "Off"};
     }
 
-    _setLocalStorageValue({ refreshInterval, intervalText }) {
-        const value = JSON.stringify({ refreshInterval, intervalText });
+    _setLocalStorageValue({refreshInterval, intervalText}) {
+        const value = JSON.stringify({refreshInterval, intervalText});
         localStorage.setItem(this.autoRefreshIntervalKey, value);
     }
     /**
@@ -150,17 +153,21 @@ export class Refresher extends Component {
     onChangeAutoRefreshInterval(clickedOption) {
         const newInterval =
             parseInt(clickedOption.value ?? clickedOption.target.value) ?? -1;
-        const newIntervalText = clickedOption.textContent ?? clickedOption.target.textContent;
+        const newIntervalText =
+            clickedOption.textContent ?? clickedOption.target.textContent;
         this.refreshInterval = newInterval;
         this._setIntervalButtonText(newIntervalText);
-        this._setLocalStorageValue({ refreshInterval: newInterval, intervalText: newIntervalText });
+        this._setLocalStorageValue({
+            refreshInterval: newInterval,
+            intervalText: newIntervalText
+        });
         if (this.runningRefresherId) {
             clearTimeout(this.runningRefresherId);
         }
         this.refresh();
     }
 
-    _setIntervalButtonText(intervalText = 'Off') {
+    _setIntervalButtonText(intervalText = "Off") {
         const manualRefreshIcon = document.getElementById("manual-refresh-icon");
         if (manualRefreshIcon) {
             if (!this.refreshInterval || this.refreshInterval <= 0) {

From 99b33165239078618823c4a16e8ef762512a40f5 Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Wed, 3 Sep 2025 15:41:48 -0500
Subject: [PATCH 11/16] [LINT] Again

---
 web_refresher/static/src/js/refresher.esm.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index c6acb90717b0..91d3dbb48247 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -51,7 +51,7 @@ export class Refresher extends Component {
         onMounted(() => {
             this.onChangeAutoRefreshInterval({
                 value: intervalValue.refreshInterval,
-                textContent: intervalValue.intervalText
+                textContent: intervalValue.intervalText,
             });
         });
         onWillUnmount(() => {
@@ -159,7 +159,7 @@ export class Refresher extends Component {
         this._setIntervalButtonText(newIntervalText);
         this._setLocalStorageValue({
             refreshInterval: newInterval,
-            intervalText: newIntervalText
+            intervalText: newIntervalText,
         });
         if (this.runningRefresherId) {
             clearTimeout(this.runningRefresherId);

From 2f71126f8145c5280ec6be226433d960a7abc39f Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Thu, 4 Sep 2025 10:45:14 -0500
Subject: [PATCH 12/16] [IMP] add per page settings and a default

---
 web_refresher/static/src/js/refresher.esm.js | 76 +++++++++++++++-----
 web_refresher/static/src/xml/refresher.xml   | 10 +++
 2 files changed, 70 insertions(+), 16 deletions(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index 91d3dbb48247..b7974ef083bc 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -39,7 +39,8 @@ export function useRefreshAnimation(timeout) {
 }
 
 export class Refresher extends Component {
-    autoRefreshIntervalKey = "autoRefreshInterval";
+    autoRefreshIntervalKey = "oca.web_refresher.auto_refresh";
+    refreshDefaultSettingsKey = "default";
     setup() {
         super.setup();
         this.action = useService("action");
@@ -47,8 +48,8 @@ export class Refresher extends Component {
         this.onClickRefresh = useDebounced(this.onClickRefresh, 200);
         this.onChangeAutoRefreshInterval = this.onChangeAutoRefreshInterval.bind(this);
         this.runningRefresherId = null;
-        const intervalValue = this._getLocalStorageValue();
         onMounted(() => {
+            const intervalValue = this._getLocalStorageValue(window.location.pathname);
             this.onChangeAutoRefreshInterval({
                 value: intervalValue.refreshInterval,
                 textContent: intervalValue.intervalText,
@@ -61,17 +62,29 @@ export class Refresher extends Component {
         });
     }
 
-    _getLocalStorageValue() {
+    _getLocalStorageValue(lookupKey) {
         const jsonValue = localStorage.getItem(this.autoRefreshIntervalKey);
-        if (jsonValue) {
-            const {refreshInterval, intervalText} = JSON.parse(jsonValue);
-            return {refreshInterval: parseInt(refreshInterval ?? -1), intervalText};
+        const refreshSettings = jsonValue ? JSON.parse(jsonValue) : {};
+        let returnInterval = -1;
+        let returnText = "Off";
+        if (Object.hasOwn(refreshSettings, lookupKey)) {
+            const {refreshInterval=-1, intervalText="Off"} = refreshSettings[lookupKey];
+            returnInterval = parseInt(refreshInterval ?? -1)
+            returnText = intervalText;
+        } else if (Object.hasOwn(refreshSettings, this.refreshDefaultSettingsKey)) {
+            const {refreshInterval=-1, intervalText="Off"} = refreshSettings[this.refreshDefaultSettingsKey];
+            returnInterval = parseInt(refreshInterval ?? -1)
+            returnText = intervalText;
         }
-        return {refreshInterval: -1, intervalText: "Off"};
+        return {refreshInterval: returnInterval, intervalText: returnText};
     }
 
-    _setLocalStorageValue({refreshInterval, intervalText}) {
-        const value = JSON.stringify({refreshInterval, intervalText});
+    _setLocalStorageValue(settingsKey, {refreshInterval, intervalText}) {
+        // Get current settings
+        const jsonValue = localStorage.getItem(this.autoRefreshIntervalKey);
+        const refreshSettings = jsonValue ? JSON.parse(jsonValue) : {};
+        refreshSettings[settingsKey] = {refreshInterval, intervalText};
+        const value = JSON.stringify(refreshSettings);
         localStorage.setItem(this.autoRefreshIntervalKey, value);
     }
     /**
@@ -139,6 +152,15 @@ export class Refresher extends Component {
         this.action.doAction(viewAction, options);
     }
 
+    _isRefreshIntervalDefault() {
+        const intervalValue = this._getLocalStorageValue(this.refreshDefaultSettingsKey);
+
+        if (Object.hasOwn(intervalValue, 'refreshInterval') && this.refreshInterval === intervalValue.refreshInterval) {
+            return true;
+        }
+        return false;
+    }
+
     async onClickRefresh() {
         const {searchModel, pagerProps} = this.props;
         if (!searchModel && !pagerProps) {
@@ -150,24 +172,34 @@ export class Refresher extends Component {
         }
     }
 
+    setRefreshAsDefault() {
+        this._setLocalStorageValue(this.refreshDefaultSettingsKey, {
+            refreshInterval: this.refreshInterval,
+            intervalText: document.getElementById("auto-refresh-interval-text").textContent,
+        });
+        this._setIntervalUi(document.getElementById("auto-refresh-interval-text").textContent);
+    }
+
     onChangeAutoRefreshInterval(clickedOption) {
         const newInterval =
             parseInt(clickedOption.value ?? clickedOption.target.value) ?? -1;
         const newIntervalText =
-            clickedOption.textContent ?? clickedOption.target.textContent;
+            clickedOption.textContent ?? clickedOption.target.textContent ?? "Off";
         this.refreshInterval = newInterval;
-        this._setIntervalButtonText(newIntervalText);
-        this._setLocalStorageValue({
-            refreshInterval: newInterval,
-            intervalText: newIntervalText,
-        });
+        this._setIntervalUi(newIntervalText);
         if (this.runningRefresherId) {
             clearTimeout(this.runningRefresherId);
         }
         this.refresh();
+
+        this._setLocalStorageValue(window.location.pathname, {
+            refreshInterval: newInterval,
+            intervalText: newIntervalText,
+        });
     }
 
-    _setIntervalButtonText(intervalText = "Off") {
+    _setIntervalUi(intervalText) {
+        // Check if the refresh is active and spin the refresh button if active
         const manualRefreshIcon = document.getElementById("manual-refresh-icon");
         if (manualRefreshIcon) {
             if (!this.refreshInterval || this.refreshInterval <= 0) {
@@ -176,10 +208,22 @@ export class Refresher extends Component {
                 manualRefreshIcon.classList.add("fa-spin");
             }
         }
+        // Set the interval dropdown text to the selected interval
         const refreshText = document.getElementById("auto-refresh-interval-text");
         if (refreshText) {
             refreshText.textContent = intervalText;
         }
+        // Check if the current interval is the default and set the star icon accordingly
+        const setAsDefaultIcon = document.getElementById("set-as-default-icon");
+        if (setAsDefaultIcon) {
+            if (this._isRefreshIntervalDefault()) {
+                setAsDefaultIcon.classList.remove("fa-star-o");
+                setAsDefaultIcon.classList.add("fa-star");
+            } else {
+                setAsDefaultIcon.classList.remove("fa-star");
+                setAsDefaultIcon.classList.add("fa-star-o");
+            }
+        }
     }
 }
 
diff --git a/web_refresher/static/src/xml/refresher.xml b/web_refresher/static/src/xml/refresher.xml
index cac20be924f8..9a13e8325c36 100644
--- a/web_refresher/static/src/xml/refresher.xml
+++ b/web_refresher/static/src/xml/refresher.xml
@@ -49,6 +49,16 @@
                         >1min</button>
                     </div>
                 </div>
+                <button
+                    id="set-as-default-btn"
+                    class="btn btn-secondary m-0"
+                    aria-label="Set as Default"
+                    t-on-click="setRefreshAsDefault"
+                    title="Set as Default"
+                    tabindex="-1"
+                >
+                    <i id="set-as-default-icon" class="fa" />
+                </button>
                 <button
                     id="manual-refresh-btn"
                     class="btn btn-secondary m-0"

From c4d694baab46ef3d3605ac09e6bb31df9656b66c Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Thu, 4 Sep 2025 10:52:57 -0500
Subject: [PATCH 13/16] [FIX] Fixing up the "default" setting when not yet set

---
 web_refresher/static/src/js/refresher.esm.js | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index b7974ef083bc..3b0800bb223c 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -65,6 +65,9 @@ export class Refresher extends Component {
     _getLocalStorageValue(lookupKey) {
         const jsonValue = localStorage.getItem(this.autoRefreshIntervalKey);
         const refreshSettings = jsonValue ? JSON.parse(jsonValue) : {};
+        if (!lookupKey) {
+            return refreshSettings;
+        }
         let returnInterval = -1;
         let returnText = "Off";
         if (Object.hasOwn(refreshSettings, lookupKey)) {
@@ -153,9 +156,11 @@ export class Refresher extends Component {
     }
 
     _isRefreshIntervalDefault() {
-        const intervalValue = this._getLocalStorageValue(this.refreshDefaultSettingsKey);
+        const localStoredIntervals = this._getLocalStorageValue();
 
-        if (Object.hasOwn(intervalValue, 'refreshInterval') && this.refreshInterval === intervalValue.refreshInterval) {
+        if (Object.hasOwn(localStoredIntervals, this.refreshDefaultSettingsKey)
+            && Object.hasOwn(localStoredIntervals[this.refreshDefaultSettingsKey], 'refreshInterval')
+            && this.refreshInterval === localStoredIntervals[this.refreshDefaultSettingsKey].refreshInterval) {
             return true;
         }
         return false;

From 509f99a1c86daccef2dceac754f544976727c1ce Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Thu, 4 Sep 2025 11:20:43 -0500
Subject: [PATCH 14/16] [LINT] Always with the lint failures

---
 web_refresher/static/src/js/refresher.esm.js | 29 ++++++++++++++------
 1 file changed, 20 insertions(+), 9 deletions(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index 3b0800bb223c..a4e49de4d100 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -71,12 +71,14 @@ export class Refresher extends Component {
         let returnInterval = -1;
         let returnText = "Off";
         if (Object.hasOwn(refreshSettings, lookupKey)) {
-            const {refreshInterval=-1, intervalText="Off"} = refreshSettings[lookupKey];
-            returnInterval = parseInt(refreshInterval ?? -1)
+            const {refreshInterval = -1, intervalText = "Off"} =
+                refreshSettings[lookupKey];
+            returnInterval = parseInt(refreshInterval ?? -1);
             returnText = intervalText;
         } else if (Object.hasOwn(refreshSettings, this.refreshDefaultSettingsKey)) {
-            const {refreshInterval=-1, intervalText="Off"} = refreshSettings[this.refreshDefaultSettingsKey];
-            returnInterval = parseInt(refreshInterval ?? -1)
+            const {refreshInterval = -1, intervalText = "Off"} =
+                refreshSettings[this.refreshDefaultSettingsKey];
+            returnInterval = parseInt(refreshInterval ?? -1);
             returnText = intervalText;
         }
         return {refreshInterval: returnInterval, intervalText: returnText};
@@ -158,9 +160,15 @@ export class Refresher extends Component {
     _isRefreshIntervalDefault() {
         const localStoredIntervals = this._getLocalStorageValue();
 
-        if (Object.hasOwn(localStoredIntervals, this.refreshDefaultSettingsKey)
-            && Object.hasOwn(localStoredIntervals[this.refreshDefaultSettingsKey], 'refreshInterval')
-            && this.refreshInterval === localStoredIntervals[this.refreshDefaultSettingsKey].refreshInterval) {
+        if (
+            Object.hasOwn(localStoredIntervals, this.refreshDefaultSettingsKey) &&
+            Object.hasOwn(
+                localStoredIntervals[this.refreshDefaultSettingsKey],
+                "refreshInterval"
+            ) &&
+            this.refreshInterval ===
+                localStoredIntervals[this.refreshDefaultSettingsKey].refreshInterval
+        ) {
             return true;
         }
         return false;
@@ -180,9 +188,12 @@ export class Refresher extends Component {
     setRefreshAsDefault() {
         this._setLocalStorageValue(this.refreshDefaultSettingsKey, {
             refreshInterval: this.refreshInterval,
-            intervalText: document.getElementById("auto-refresh-interval-text").textContent,
+            intervalText: document.getElementById("auto-refresh-interval-text")
+                .textContent,
         });
-        this._setIntervalUi(document.getElementById("auto-refresh-interval-text").textContent);
+        this._setIntervalUi(
+            document.getElementById("auto-refresh-interval-text").textContent
+        );
     }
 
     onChangeAutoRefreshInterval(clickedOption) {

From 7cdfeaa4a92a708ce43efc7449c475326400a2ca Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Wed, 22 Oct 2025 13:50:51 -0500
Subject: [PATCH 15/16] fix: memory leak due to held refrence blocking GC

---
 web_refresher/static/src/js/refresher.esm.js | 26 ++++++++++++--------
 1 file changed, 16 insertions(+), 10 deletions(-)

diff --git a/web_refresher/static/src/js/refresher.esm.js b/web_refresher/static/src/js/refresher.esm.js
index a4e49de4d100..f0889aeb46fe 100644
--- a/web_refresher/static/src/js/refresher.esm.js
+++ b/web_refresher/static/src/js/refresher.esm.js
@@ -10,27 +10,33 @@ import {useService} from "@web/core/utils/hooks";
 export function useRefreshAnimation(timeout) {
     const refreshClass = "o_content__refresh";
     let timeoutId = null;
-
-    /**
-     * @returns {DOMTokenList|null}
-     */
-    function contentClassList() {
-        const content = document.querySelector(".o_content");
-        return content ? content.classList : null;
-    }
+    let cachedElement = null;
 
     function clearAnimationTimeout() {
         if (timeoutId) {
             clearTimeout(timeoutId);
         }
         timeoutId = null;
+        cachedElement = null;
     }
 
     function animate() {
         clearAnimationTimeout();
-        contentClassList().add(refreshClass);
+
+        // Cache the element reference before modifying it
+        const content = document.querySelector(".o_content");
+        if (!content) {
+            return;
+        }
+
+        cachedElement = content;
+        cachedElement.classList.add(refreshClass);
+
         timeoutId = setTimeout(() => {
-            contentClassList().remove(refreshClass);
+            // Only remove class from the same cached element
+            if (cachedElement && cachedElement.classList.contains(refreshClass)) {
+                cachedElement.classList.remove(refreshClass);
+            }
             clearAnimationTimeout();
         }, timeout);
     }

From 33face0015177fc7f766b8c075b25c18e8bc9ec5 Mon Sep 17 00:00:00 2001
From: Matt O'Keefe <Matt@OKeefe.dev>
Date: Wed, 22 Oct 2025 14:01:00 -0500
Subject: [PATCH 16/16] Hide on small view auto refresh

---
 web_refresher/static/src/xml/refresher.xml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/web_refresher/static/src/xml/refresher.xml b/web_refresher/static/src/xml/refresher.xml
index 9a13e8325c36..5764857cd5cb 100644
--- a/web_refresher/static/src/xml/refresher.xml
+++ b/web_refresher/static/src/xml/refresher.xml
@@ -6,7 +6,7 @@
     <t t-name="web_refresher.Button">
         <nav class="oe_refresher" aria-label="Refresher" aria-atomic="true">
             <div class="btn-group" role="group">
-                <div class="btn-group" role="group">
+                <div class="btn-group d-none d-md-block" role="group">
                     <button
                         id="auto-refresh-dd"
                         class="btn btn-secondary dropdown-toggle"
@@ -51,7 +51,7 @@
                 </div>
                 <button
                     id="set-as-default-btn"
-                    class="btn btn-secondary m-0"
+                    class="btn btn-secondary m-0 d-none d-md-block"
                     aria-label="Set as Default"
                     t-on-click="setRefreshAsDefault"
                     title="Set as Default"