@cubejs-client/react 1.7.37 → 1.7.39

package/README.md

@@ -1,16 +1,16 @@
-<p align="center"><a href="https://cube.dev"><img src="https://i.imgur.com/zYHXm4o.png" alt="Cube.js" width="300px"></a></p>
+<p align="center"><a href="https://cube.dev"><img src="https://i.imgur.com/zYHXm4o.png" alt="Cube" width="300px"></a></p>
 
 [Website](https://cube.dev) • [Docs](https://docs.cube.dev) • [Blog](https://cube.dev/blog) • [Slack](https://slack.cube.dev) • [Twitter](https://twitter.com/the_cube_dev)
 
 [![npm version](https://badge.fury.io/js/%40cubejs-client%2Freact.svg)](https://badge.fury.io/js/%40cubejs-client%2Freact)
 [![GitHub Actions](https://github.com/cube-js/cube.js/workflows/Build/badge.svg)](https://github.com/cube-js/cube.js/actions?query=workflow%3ABuild+branch%3Amaster)
 
-# Cube.js React
+# Cube React
 
-Cube.js React is a set of helper React components to simplify Cube.js query rendering.
+Cube React is a set of helper React components to simplify Cube query rendering.
 
 [Learn more](https://github.com/cube-js/cube.js#getting-started)
 
 ### License
 
-Cube.js React is [MIT licensed](./LICENSE).
+Cube React is [MIT licensed](./LICENSE).

package/dist/CubeProvider.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { CubeProviderProps } from './types';
 /**
- * Cube.js context provider
+ * Cube context provider
  * ```js
  * import React from 'react';
  * import cube from '@cubejs-client/core';

package/dist/QueryBuilder.d.ts

@@ -1,8 +1,9 @@
 import React from 'react';
 import type { CubeApi, DryRunResponse, Meta, PivotConfig, Query } from '@cubejs-client/core';
+import CubeContext from './CubeContext';
 import type { ChartType, CubeContextProps, QueryBuilderInternalState, QueryBuilderProps, QueryBuilderRenderProps, QueryBuilderStateUpdate, QueryMemberType, QueryRendererRenderProps, ResolveMemberArgs } from './types';
 /**
- * `<QueryBuilder />` is used to build interactive analytics query builders. It abstracts state management and API calls to Cube.js Backend. It uses render prop technique and doesn’t render anything itself, but calls the render function instead.
+ * `<QueryBuilder />` is used to build interactive analytics query builders. It abstracts state management and API calls to Cube Backend. It uses render prop technique and doesn’t render anything itself, but calls the render function instead.
  *
  * **Example**
  *
@@ -67,6 +68,7 @@ import type { ChartType, CubeContextProps, QueryBuilderInternalState, QueryBuild
  */
 export default class QueryBuilder extends React.Component<QueryBuilderProps, QueryBuilderInternalState> {
     static contextType: React.Context<CubeContextProps>;
+    context: React.ContextType<typeof CubeContext>;
     static defaultProps: {
         cubeApi: null;
         stateChangeHeuristics: null;
@@ -130,6 +132,6 @@ export default class QueryBuilder extends React.Component<QueryBuilderProps, Que
     validatedQuery(state?: QueryBuilderStateUpdate): Query;
     defaultHeuristics(newState: QueryBuilderStateUpdate): QueryBuilderStateUpdate;
     applyStateChangeHeuristics(newState: QueryBuilderStateUpdate): QueryBuilderStateUpdate;
-    render(): React.ReactNode;
+    render(): string | number | boolean | Iterable<React.ReactNode> | React.JSX.Element | null | undefined;
 }
 //# sourceMappingURL=QueryBuilder.d.ts.map

package/dist/QueryBuilder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QueryBuilder.d.ts","sourceRoot":"","sources":["../src/QueryBuilder.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,OAAO,KAAK,EACV,OAAO,EAEP,cAAc,EACd,IAAI,EAEJ,WAAW,EAEX,KAAK,EAQN,MAAM,qBAAqB,CAAC;AAK7B,OAAO,KAAK,EAGV,SAAS,EACT,gBAAgB,EAYhB,yBAAyB,EACzB,iBAAiB,EACjB,uBAAuB,EAEvB,uBAAuB,EACvB,eAAe,EACf,wBAAwB,EAExB,iBAAiB,EAMlB,MAAM,SAAS,CAAC;AAcjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+DG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,KAAK,CAAC,SAAS,CAAC,iBAAiB,EAAE,yBAAyB,CAAC;IACrG,MAAM,CAAC,WAAW,kCAAe;IAEjC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;MAgBjB;IAIF,MAAM,CAAC,wBAAwB,CAAC,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAsB1F,MAAM,CAAC,aAAa,CAClB,IAAI,EAAE,eAAe,EACrB,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,iBAAiB,GACjC,OAAO,EAAE;gBAkCA,KAAK,EAAE,iBAAiB;IAmB9B,iBAAiB;IAKjB,kBAAkB,CAAC,SAAS,EAAE,iBAAiB;IAmCrD,OAAO,CAAC,QAAQ,CAAW;IAE3B,OAAO,CAAC,qBAAqB,CAAW;IAExC,OAAO,CAAC,WAAW,CAAC,CAAmB;IAEvC,SAAS,sBAmCP;IAEF,OAAO,IAAI,OAAO;IAMlB,iBAAiB,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,IAAI;IAgB3C,cAAc;IAKd,kBAAkB,CAAC,kBAAkB,CAAC,EAAE,wBAAwB,GAAG,uBAAuB;IAgP1F,WAAW,CAAC,WAAW,EAAE,KAAK;IAWxB,cAAc,CAAC,KAAK,EAAE,uBAAuB;IAkGnD,cAAc,CAAC,KAAK,CAAC,EAAE,uBAAuB;IAM9C,iBAAiB,CAAC,QAAQ,EAAE,uBAAuB,GAAG,uBAAuB;IAS7E,0BAA0B,CAAC,QAAQ,EAAE,uBAAuB,GAAG,uBAAuB;IAQtF,MAAM;CAyBP"}
+{"version":3,"file":"QueryBuilder.d.ts","sourceRoot":"","sources":["../src/QueryBuilder.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,OAAO,KAAK,EACV,OAAO,EAEP,cAAc,EACd,IAAI,EAEJ,WAAW,EAEX,KAAK,EAQN,MAAM,qBAAqB,CAAC;AAG7B,OAAO,WAAW,MAAM,eAAe,CAAC;AAExC,OAAO,KAAK,EAGV,SAAS,EACT,gBAAgB,EAYhB,yBAAyB,EACzB,iBAAiB,EACjB,uBAAuB,EAEvB,uBAAuB,EACvB,eAAe,EACf,wBAAwB,EAExB,iBAAiB,EAMlB,MAAM,SAAS,CAAC;AAcjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+DG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,KAAK,CAAC,SAAS,CAAC,iBAAiB,EAAE,yBAAyB,CAAC;IACrG,MAAM,CAAC,WAAW,kCAAe;IAEjC,OAAO,EAAG,KAAK,CAAC,WAAW,CAAC,OAAO,WAAW,CAAC,CAAC;IAEhD,MAAM,CAAC,YAAY;;;;;;;;;;;;;;MAgBjB;IAIF,MAAM,CAAC,wBAAwB,CAAC,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAsB1F,MAAM,CAAC,aAAa,CAClB,IAAI,EAAE,eAAe,EACrB,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,iBAAiB,GACjC,OAAO,EAAE;gBAkCA,KAAK,EAAE,iBAAiB;IAmB9B,iBAAiB;IAKjB,kBAAkB,CAAC,SAAS,EAAE,iBAAiB;IA+BrD,OAAO,CAAC,QAAQ,CAAW;IAE3B,OAAO,CAAC,qBAAqB,CAAW;IAExC,OAAO,CAAC,WAAW,CAAC,CAAmB;IAEvC,SAAS,sBAmCP;IAEF,OAAO,IAAI,OAAO;IAMlB,iBAAiB,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,IAAI;IAgB3C,cAAc;IAKd,kBAAkB,CAAC,kBAAkB,CAAC,EAAE,wBAAwB,GAAG,uBAAuB;IAgP1F,WAAW,CAAC,WAAW,EAAE,KAAK;IAWxB,cAAc,CAAC,KAAK,EAAE,uBAAuB;IAkGnD,cAAc,CAAC,KAAK,CAAC,EAAE,uBAAuB;IAM9C,iBAAiB,CAAC,QAAQ,EAAE,uBAAuB,GAAG,uBAAuB;IAS7E,0BAA0B,CAAC,QAAQ,EAAE,uBAAuB,GAAG,uBAAuB;IAQtF,MAAM;CAyBP"}

package/dist/QueryRenderer.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import type { CubeApi, Query } from '@cubejs-client/core';
+import CubeContext from './CubeContext';
 import type { QueryRendererProps, QueryRendererState } from './types';
 /**
  * `<QueryRenderer />` a react component that accepts a query, fetches the given query, and uses the render prop to render the resulting data
@@ -8,6 +9,7 @@ import type { QueryRendererProps, QueryRendererState } from './types';
  */
 export default class QueryRenderer extends React.Component<QueryRendererProps, QueryRendererState> {
     static contextType: React.Context<import("./types").CubeContextProps>;
+    context: React.ContextType<typeof CubeContext>;
     static defaultProps: {
         cubeApi: null;
         query: null;

package/dist/QueryRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QueryRenderer.d.ts","sourceRoot":"","sources":["../src/QueryRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,OAAO,EAAqB,KAAK,EAAa,MAAM,qBAAqB,CAAC;AAGxF,OAAO,KAAK,EAGV,kBAAkB,EAElB,kBAAkB,EACnB,MAAM,SAAS,CAAC;AAEjB;;;;GAIG;AACH,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,KAAK,CAAC,SAAS,CAAC,kBAAkB,EAAE,kBAAkB,CAAC;IAChG,MAAM,CAAC,WAAW,oDAAe;IAEjC,MAAM,CAAC,YAAY;;;;;;;;;MASjB;IAGF,MAAM,CAAC,cAAc,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,EAAE;gBAIhC,KAAK,EAAE,kBAAkB;IAMrC,iBAAiB;IAUjB,qBAAqB,CAAC,SAAS,EAAE,kBAAkB,EAAE,SAAS,EAAE,kBAAkB;IAgBlF,kBAAkB,CAAC,SAAS,EAAE,kBAAkB;IAmBhD,OAAO,CAAC,QAAQ,CAAW;IAE3B,OAAO,IAAI,OAAO;IAKlB,IAAI,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,EAAE;IAkD3B,WAAW,CAAC,OAAO,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,KAAK,CAAA;KAAE;IA8B9C,MAAM;CAqBP"}
+{"version":3,"file":"QueryRenderer.d.ts","sourceRoot":"","sources":["../src/QueryRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,OAAO,EAAqB,KAAK,EAAa,MAAM,qBAAqB,CAAC;AAExF,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,KAAK,EAGV,kBAAkB,EAElB,kBAAkB,EACnB,MAAM,SAAS,CAAC;AAEjB;;;;GAIG;AACH,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,KAAK,CAAC,SAAS,CAAC,kBAAkB,EAAE,kBAAkB,CAAC;IAChG,MAAM,CAAC,WAAW,oDAAe;IAEjC,OAAO,EAAG,KAAK,CAAC,WAAW,CAAC,OAAO,WAAW,CAAC,CAAC;IAEhD,MAAM,CAAC,YAAY;;;;;;;;;MASjB;IAGF,MAAM,CAAC,cAAc,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,EAAE;gBAIhC,KAAK,EAAE,kBAAkB;IAMrC,iBAAiB;IAUjB,qBAAqB,CAAC,SAAS,EAAE,kBAAkB,EAAE,SAAS,EAAE,kBAAkB;IAgBlF,kBAAkB,CAAC,SAAS,EAAE,kBAAkB;IAehD,OAAO,CAAC,QAAQ,CAAW;IAE3B,OAAO,IAAI,OAAO;IAKlB,IAAI,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,EAAE;IAkD3B,WAAW,CAAC,OAAO,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,KAAK,CAAA;KAAE;IA8B9C,MAAM;CAqBP"}

package/dist/QueryRendererWithTotals.d.ts

@@ -1,4 +1,5 @@
+import React from 'react';
 import type { QueryRendererWithTotalsProps } from './types';
-declare const QueryRendererWithTotals: ({ query, ...restProps }: QueryRendererWithTotalsProps) => JSX.Element;
+declare const QueryRendererWithTotals: ({ query, ...restProps }: QueryRendererWithTotalsProps) => React.JSX.Element;
 export default QueryRendererWithTotals;
 //# sourceMappingURL=QueryRendererWithTotals.d.ts.map

package/dist/QueryRendererWithTotals.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QueryRendererWithTotals.d.ts","sourceRoot":"","sources":["../src/QueryRendererWithTotals.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,SAAS,CAAC;AAE5D,QAAA,MAAM,uBAAuB,GAAI,yBAAyB,4BAA4B,gBAerF,CAAC;AAEF,eAAe,uBAAuB,CAAC"}
+{"version":3,"file":"QueryRendererWithTotals.d.ts","sourceRoot":"","sources":["../src/QueryRendererWithTotals.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,SAAS,CAAC;AAE5D,QAAA,MAAM,uBAAuB,GAAI,yBAAyB,4BAA4B,sBAerF,CAAC;AAEF,eAAe,uBAAuB,CAAC"}

package/dist/cubejs-client-react.cjs.js

@@ -407,14 +407,11 @@ var QueryRenderer = /*#__PURE__*/function (_React$Component) {
     var _this;
     _classCallCheck(this, QueryRenderer);
     _this = _callSuper(this, QueryRenderer, [props]);
+    _defineProperty(_this, "context", void 0);
     // These sit after the lifecycle methods because `react/sort-comp` sorts
     // TypeScript field declarations into `everything-else`, which the configured
     // order puts after `lifecycle`. Runtime is unaffected: field initializers run
     // right after `super()`, so the constructor's assignments still win.
-    //
-    // `this.context` is not re-declared: React types it as `any`, and a field
-    // declaration would be emitted at runtime and shadow the context React
-    // assigns.
     _defineProperty(_this, "mutexObj", void 0);
     _this.state = {};
     _this.mutexObj = {};
@@ -708,7 +705,7 @@ var granularities = [{
 }];
 
 /**
- * `<QueryBuilder />` is used to build interactive analytics query builders. It abstracts state management and API calls to Cube.js Backend. It uses render prop technique and doesn’t render anything itself, but calls the render function instead.
+ * `<QueryBuilder />` is used to build interactive analytics query builders. It abstracts state management and API calls to Cube Backend. It uses render prop technique and doesn’t render anything itself, but calls the render function instead.
  *
  * **Example**
  *
@@ -776,14 +773,11 @@ var QueryBuilder = /*#__PURE__*/function (_React$Component) {
     var _this;
     _classCallCheck(this, QueryBuilder);
     _this = _callSuper(this, QueryBuilder, [props]);
+    _defineProperty(_this, "context", void 0);
     // These sit after the lifecycle methods because `react/sort-comp` sorts
     // TypeScript field declarations into `everything-else`, which the configured
     // order puts after `lifecycle`. Runtime is unaffected: field initializers run
     // right after `super()`, so the constructor's assignments still win.
-    //
-    // `this.context` is not re-declared: React types it as `any`, and a field
-    // declaration would be emitted at runtime and shadow the context React
-    // assigns.
     _defineProperty(_this, "mutexObj", void 0);
     _defineProperty(_this, "orderMembersOrderKeys", void 0);
     _defineProperty(_this, "prevContext", void 0);
@@ -1454,7 +1448,7 @@ _defineProperty(QueryBuilder, "defaultProps", {
 });
 
 /**
- * Cube.js context provider
+ * Cube context provider
  * ```js
  * import React from 'react';
  * import cube from '@cubejs-client/core';
@@ -1647,7 +1641,7 @@ function useLazyDryRun(query) {
 }
 
 /**
- * A React hook for executing Cube.js queries
+ * A React hook for executing Cube queries
  * ```js
  * import React from 'react';
  * import { Table } from 'antd';
@@ -1706,17 +1700,29 @@ function useCubeQuery(query) {
     error = _useState0[0],
     setError = _useState0[1];
   var context = React.useContext(CubeContext);
+  var requestIdRef = React.useRef(0);
+  var hasStartedRequestRef = React.useRef(false);
   var subscribeRequest = null;
-
-  // `progressResponse` is not part of the public `ProgressResult` API
-  var progressCallback = function progressCallback(progressResult) {
-    return setProgress(progressResult.progressResponse);
-  };
-  function fetch() {
-    return _fetch.apply(this, arguments);
+  function isCurrentRequest(requestId) {
+    return requestId === requestIdRef.current;
   }
-  function _fetch() {
-    _fetch = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() {
+  function startRequest() {
+    hasStartedRequestRef.current = true;
+    return ++requestIdRef.current;
+  }
+  function createProgressCallback(requestId) {
+    return function (progressResult) {
+      if (isCurrentRequest(requestId)) {
+        // `progressResponse` is not part of the public `ProgressResult` API
+        setProgress(progressResult.progressResponse);
+      }
+    };
+  }
+  function fetchQuery(_x) {
+    return _fetchQuery.apply(this, arguments);
+  }
+  function _fetchQuery() {
+    _fetchQuery = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(requestId) {
       var resetResultSetOnChange, cubeApi, _context$options, response, _t2;
       return _regenerator().w(function (_context2) {
         while (1) switch (_context2.p = _context2.n) {
@@ -1734,35 +1740,61 @@ function useCubeQuery(query) {
             }
             setError(null);
             setLoading(true);
+            setProgress(null);
             _context2.p = 2;
             _context2.n = 3;
             return cubeApi.load(query, _objectSpread2({
               mutexObj: mutexRef.current,
               mutexKey: 'query',
-              progressCallback: progressCallback,
+              progressCallback: createProgressCallback(requestId),
               castNumerics: Boolean(typeof options.castNumerics === 'boolean' ? options.castNumerics : context === null || context === void 0 || (_context$options = context.options) === null || _context$options === void 0 ? void 0 : _context$options.castNumerics)
             }, options.cache ? {
               cache: options.cache
             } : {}));
           case 3:
             response = _context2.v;
-            setResultSet(response);
-            setProgress(null);
+            if (isCurrentRequest(requestId)) {
+              setResultSet(response);
+              setProgress(null);
+            }
             _context2.n = 5;
             break;
           case 4:
             _context2.p = 4;
             _t2 = _context2.v;
-            setError(_t2);
-            setResultSet(null);
-            setProgress(null);
+            if (isCurrentRequest(requestId)) {
+              setError(_t2);
+              setResultSet(null);
+              setProgress(null);
+            }
           case 5:
-            setLoading(false);
+            if (isCurrentRequest(requestId)) {
+              setLoading(false);
+            }
           case 6:
             return _context2.a(2);
         }
       }, _callee2, null, [[2, 4]]);
     }));
+    return _fetchQuery.apply(this, arguments);
+  }
+  function fetch() {
+    return _fetch.apply(this, arguments);
+  }
+  function _fetch() {
+    _fetch = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3() {
+      var requestId;
+      return _regenerator().w(function (_context3) {
+        while (1) switch (_context3.n) {
+          case 0:
+            requestId = startRequest();
+            _context3.n = 1;
+            return fetchQuery(requestId);
+          case 1:
+            return _context3.a(2);
+        }
+      }, _callee3);
+    }));
     return _fetch.apply(this, arguments);
   }
   React.useEffect(function () {
@@ -1778,15 +1810,15 @@ function useCubeQuery(query) {
     }
     function _loadQuery() {
       _loadQuery = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
-        var previousQuery, _t;
+        var requestId, previousQuery, _t;
         return _regenerator().w(function (_context) {
           while (1) switch (_context.p = _context.n) {
             case 0:
               if (!(!skip && core.isQueryPresent(query))) {
-                _context.n = 7;
+                _context.n = 8;
                 break;
               }
-              // `areQueriesEqual` is declared for a single query, and reads no more
+              requestId = startRequest(); // `areQueriesEqual` is declared for a single query, and reads no more
               // than `order` off one when given an array of queries
               previousQuery = currentQuery;
               if (!core.areQueriesEqual(previousQuery, query)) {
@@ -1797,6 +1829,7 @@ function useCubeQuery(query) {
               }
               setError(null);
               setLoading(true);
+              setProgress(null);
               _context.p = 1;
               if (!subscribeRequest) {
                 _context.n = 3;
@@ -1814,34 +1847,46 @@ function useCubeQuery(query) {
               subscribeRequest = cubeApi.subscribe(query, _objectSpread2({
                 mutexObj: mutexRef.current,
                 mutexKey: 'query',
-                progressCallback: progressCallback
+                progressCallback: createProgressCallback(requestId)
               }, options.cache ? {
                 cache: options.cache
               } : {}), function (e, result) {
-                if (e) {
-                  setError(e);
-                } else {
-                  setResultSet(result);
+                if (isCurrentRequest(requestId)) {
+                  if (e) {
+                    setError(e);
+                  } else {
+                    setResultSet(result);
+                  }
+                  setLoading(false);
+                  setProgress(null);
                 }
-                setLoading(false);
-                setProgress(null);
               });
               _context.n = 5;
               break;
             case 4:
               _context.n = 5;
-              return fetch();
+              return fetchQuery(requestId);
             case 5:
               _context.n = 7;
               break;
             case 6:
               _context.p = 6;
               _t = _context.v;
-              setError(_t);
-              setResultSet(null);
-              setLoading(false);
-              setProgress(null);
+              if (isCurrentRequest(requestId)) {
+                setError(_t);
+                setResultSet(null);
+                setLoading(false);
+                setProgress(null);
+              }
             case 7:
+              _context.n = 9;
+              break;
+            case 8:
+              if (hasStartedRequestRef.current) {
+                setLoading(false);
+                setProgress(null);
+              }
+            case 9:
               return _context.a(2);
           }
         }, _callee, null, [[1, 6]]);
@@ -1850,6 +1895,7 @@ function useCubeQuery(query) {
     }
     loadQuery();
     return function () {
+      requestIdRef.current += 1;
       if (subscribeRequest) {
         subscribeRequest.unsubscribe();
         subscribeRequest = null;