refactor: introduce ActivePageTimer to help to do partial page refresh (#38372)

Before, the logic is already there for "pull merge box".

After, the logic is extracted into a general class ActivePageTimer and
will help more pages (including #38329)

web_src/js/features/common-fetch-action.ts

@@ -1,6 +1,6 @@
 import {GET, request} from '../modules/fetch.ts';
 import {hideToastsAll, showErrorToast} from '../modules/toast.ts';
-import {addDelegatedEventListener, createElementFromHTML} from '../utils/dom.ts';
+import {activePageTimerRefresh, addDelegatedEventListener, createElementFromHTML} from '../utils/dom.ts';
 import {errorMessage, errorName} from '../modules/errors.ts';
 import {confirmModal, createConfirmModal} from './comp/ConfirmModal.ts';
 import {ignoreAreYouSure} from '../vendor/jquery.are-you-sure.ts';
@@ -330,17 +330,10 @@ function initFetchActionTriggerEvery(el: HTMLElement, trigger: string) {
 
   const num = parseInt(match[1], 10), unit = match[2];
   const intervalMs = unit === 's' ? num * 1000 : num;
-  const fn = async () => {
-    try {
-      await performFetchActionTrigger(el, 'every');
-    } finally {
-      // only continue if the element is still in the document
-      if (document.contains(el)) {
-        setTimeout(fn, intervalMs);
-      }
-    }
-  };
-  setTimeout(fn, intervalMs);
+  activePageTimerRefresh({
+    interval: () => document.contains(el) ? intervalMs : 0, // only continue if the element is still in the document
+    async callback() { await performFetchActionTrigger(el, 'every') },
+  });
 }
 
 function initFetchActionTrigger(el: HTMLElement) {