Merge branch 'feat/autorefresh-fields' into alpha

src/context/ActionViewContext.tsx

@@ -276,7 +276,7 @@ export const useActionViewContext = () => {
       searchTreeNameSearch: undefined,
       goToResourceId: async () => {},
       limit: DEFAULT_SEARCH_LIMIT,
-      isActive: false,
+      isActive: undefined,
       formIsSaving: false,
       setFormIsSaving: () => {},
       formHasChanges: false,

src/hooks/useAutorefreshableFields.ts

@@ -0,0 +1,102 @@
+import { ConnectionProvider } from "..";
+import { useNetworkRequest } from "./useNetworkRequest";
+import { useDeepCompareEffect } from "use-deep-compare";
+import { useRef, useState, useCallback } from "react";
+
+const AUTOREFRESH_INTERVAL_SECONDS = 3 * 1000;
+
+export type UseAutorefreshableFieldsOpts = {
+  model: string;
+  id?: number;
+  context: any;
+  autorefreshableFields?: string[];
+  fieldDefs: any;
+  onAutorefreshableFieldsChange: (newValues: any) => void;
+};
+
+export const useAutorefreshableFields = (
+  opts: UseAutorefreshableFieldsOpts,
+) => {
+  const {
+    model,
+    id,
+    context,
+    autorefreshableFields,
+    fieldDefs,
+    onAutorefreshableFieldsChange,
+  } = opts;
+
+  const intervalRef = useRef<NodeJS.Timeout | null>(null);
+  const [isActive, setIsActive] = useState(true);
+
+  const [fetchRequest, cancelRequest] = useNetworkRequest(
+    ConnectionProvider.getHandler().readObjects,
+  );
+
+  const refresh = useCallback(async () => {
+    if (!id || !autorefreshableFields?.length || !isActive) return;
+
+    try {
+      const [result] = await fetchRequest({
+        model,
+        ids: [id],
+        fields: fieldDefs,
+        fieldsToRetrieve: autorefreshableFields,
+        context,
+      });
+      onAutorefreshableFieldsChange(result);
+    } catch (err) {
+      console.error(err);
+    }
+  }, [
+    id,
+    autorefreshableFields,
+    isActive,
+    fetchRequest,
+    model,
+    fieldDefs,
+    context,
+    onAutorefreshableFieldsChange,
+  ]);
+
+  useDeepCompareEffect(() => {
+    const shouldStart = id && autorefreshableFields?.length && isActive;
+
+    if (shouldStart) {
+      refresh();
+      intervalRef.current = setInterval(refresh, AUTOREFRESH_INTERVAL_SECONDS);
+    }
+
+    return () => {
+      // setIsActive(false);
+      cancelRequest();
+      if (intervalRef.current) {
+        clearInterval(intervalRef.current);
+        intervalRef.current = null;
+      }
+    };
+  }, [
+    autorefreshableFields,
+    fetchRequest,
+    fieldDefs,
+    model,
+    id,
+    context,
+    isActive,
+  ]);
+
+  const pause = useCallback(() => {
+    setIsActive(false);
+    if (intervalRef.current) {
+      clearInterval(intervalRef.current);
+      intervalRef.current = null;
+    }
+    cancelRequest();
+  }, [cancelRequest]);
+
+  const resume = useCallback(() => {
+    setIsActive(true);
+  }, []);
+
+  return { pause, resume };
+};

src/views/CurrentTabContent.tsx

@@ -1,4 +1,4 @@
-import React, { useContext } from "react";
+import { useContext } from "react";
 
 import {
   TabManagerContext,