wip

Author: emma-sg

frontend/src/pages/org/workflows-list-group-controller.ts

@@ -1,19 +1,35 @@
 import { Task } from "@lit/task";
 import { type ReactiveController } from "lit";
+import queryString from "query-string";
+
+import { type Workflow } from "./types";
 
 import { type WorkflowsList } from "@/pages/org/workflows-list";
+import { type APIPaginatedList } from "@/types/api";
+import { type UserInfo } from "@/types/user";
+
+const stringifyQuery = (query: {}) =>
+  queryString.stringify(query, {
+    arrayFormat: "comma",
+  });
 
 export class ClockController implements ReactiveController {
   host: WorkflowsList;
 
-  timeout: number;
-  private _timerID?: number;
+  private readonly POLL_INTERVAL_SECONDS;
+  private runningIntervalId?: number;
+  private allIntervalId?: number;
 
   readonly task;
 
-  constructor(host: WorkflowsList, timeout = 1000, INITIAL_PAGE_SIZE = 10) {
+  constructor(
+    host: WorkflowsList,
+    INITIAL_PAGE_SIZE = 10,
+    POLL_INTERVAL_SECONDS = 10,
+    userInfo: () => UserInfo | undefined,
+  ) {
     (this.host = host).addController(this);
-    this.timeout = timeout;
+    this.POLL_INTERVAL_SECONDS = POLL_INTERVAL_SECONDS;
     this.task = new Task(this.host, {
       task: async (
         [showRunningFirst, filterBy, orderBy, page, filterByCurrentUser],
@@ -26,16 +42,16 @@ export class ClockController implements ReactiveController {
           ...filterBy,
           page: page || 1,
           pageSize: this.task.value?.pageSize || INITIAL_PAGE_SIZE,
-          userid: filterByCurrentUser ? this.host.userInfo?.id : undefined,
+          userid: filterByCurrentUser ? userInfo()?.id : undefined,
           sortBy: orderBy.field,
           sortDirection: orderBy.direction === "desc" ? -1 : 1,
           running: true,
-        };
+        } as const;
 
         const query = stringifyQuery(queryParams);
 
-        const workflows = await this.api.fetch<APIPaginatedList<Workflow>>(
-          `/orgs/${this.orgId}/crawlconfigs?${query}`,
+        const workflows = await this.host.api.fetch<APIPaginatedList<Workflow>>(
+          `/orgs/${this.host.orgId}/crawlconfigs?${query}`,
           {
             signal: signal,
           },
@@ -49,32 +65,21 @@ export class ClockController implements ReactiveController {
         clearTimeout(this.allIntervalId);
 
         this.runningIntervalId = window.setTimeout(() => {
-          void this.runningWorkflowsTask.run();
+          void this.task.run();
         }, 1000 * POLL_INTERVAL_SECONDS);
 
         return workflows;
       },
       args: () =>
         [
-          this.showRunningFirst,
-          this.filterBy,
-          this.orderBy,
-          this.page[WorkflowGroup.RUNNING],
-          this.filterByCurrentUser,
+          this.host.showRunningFirst,
+          this.host.filterBy,
+          this.host.orderBy,
+          this.host.page[WorkflowGroup.RUNNING],
+          this.host.filterByCurrentUser,
         ] as const,
     });
   }
-  hostConnected() {
-    // Start a timer when the host is connected
-    this._timerID = setInterval(() => {
-      this.value = new Date();
-      // Update the host with new value
-      this.host.requestUpdate();
-    }, this.timeout);
-  }
-  hostDisconnected() {
-    // Clear the timer when the host is disconnected
-    clearInterval(this._timerID);
-    this._timerID = undefined;
-  }
+  hostConnected() {}
+  hostDisconnected() {}
 }

frontend/src/pages/org/workflows-list.ts

@@ -39,8 +39,8 @@ type SortDirection = "asc" | "desc";
 
 const FILTER_BY_CURRENT_USER_STORAGE_KEY =
   "btrix.filterByCurrentUser.crawlConfigs";
-const INITIAL_PAGE_SIZE = 1;
-const POLL_INTERVAL_SECONDS = 1;
+const INITIAL_PAGE_SIZE = 10;
+const POLL_INTERVAL_SECONDS = 10;
 // const ABORT_REASON_THROTTLE = "throttled";
 // NOTE Backend pagination max is 1000
 const SEEDS_MAX = 1000;