Add 'skipPollOnFocusLost' flag to query hooks

The query hooks in 'buildHooks.ts' and 'apiState.ts' files now include the 'skipPollOnFocusLost' flag.

Author: riqts

packages/toolkit/src/query/core/apiState.ts

@@ -83,6 +83,12 @@ export type SubscriptionOptions = {
    * How frequently to automatically re-fetch data (in milliseconds). Defaults to `0` (off).
    */
   pollingInterval?: number
+  /**
+   *  Defaults to 'false'. This setting allows you to control whether RTK Query will continue polling if the window is not focused.
+   *
+   *  If pollingInterval is not set or set to 0, this **will not be evaluated** until pollingInterval is greater than 0.
+   */
+  skipPollOnFocusLost?: boolean
   /**
    * Defaults to `false`. This setting allows you to control whether RTK Query will try to refetch all subscribed queries after regaining a network connection.
    *

packages/toolkit/src/query/react/buildHooks.ts

@@ -672,6 +672,7 @@ export function buildHooks<Definitions extends EndpointDefinitions>({
         refetchOnMountOrArgChange,
         skip = false,
         pollingInterval = 0,
+        skipPollOnFocusLost = false,
       } = {}
     ) => {
       const { initiate } = api.endpoints[name] as ApiEndpointQuery<
@@ -715,6 +716,7 @@ export function buildHooks<Definitions extends EndpointDefinitions>({
         refetchOnReconnect,
         refetchOnFocus,
         pollingInterval,
+        skipPollOnFocusLost,
       })
 
       const lastRenderHadSubscription = useRef(false)
@@ -815,6 +817,7 @@ export function buildHooks<Definitions extends EndpointDefinitions>({
       refetchOnReconnect,
       refetchOnFocus,
       pollingInterval = 0,
+      skipPollOnFocusLost = false,
     } = {}) => {
       const { initiate } = api.endpoints[name] as ApiEndpointQuery<
         QueryDefinition<any, any, any, any, any>,
@@ -829,6 +832,7 @@ export function buildHooks<Definitions extends EndpointDefinitions>({
         refetchOnReconnect,
         refetchOnFocus,
         pollingInterval,
+        skipPollOnFocusLost,
       })
 
       usePossiblyImmediateEffect(() => {