@cubejs-client/react 1.7.37 → 1.7.39

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

@@ -383,14 +383,11 @@
       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 = {};
@@ -684,7 +681,7 @@
   }];
 
   /**
-   * `<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**
    *
@@ -752,14 +749,11 @@
       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);
@@ -1430,7 +1424,7 @@
   });
 
   /**
-   * Cube.js context provider
+   * Cube context provider
    * ```js
    * import React from 'react';
    * import cube from '@cubejs-client/core';
@@ -1623,7 +1617,7 @@
   }
 
   /**
-   * A React hook for executing Cube.js queries
+   * A React hook for executing Cube queries
    * ```js
    * import React from 'react';
    * import { Table } from 'antd';
@@ -1682,17 +1676,29 @@
       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) {
@@ -1710,35 +1716,61 @@
               }
               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 () {
@@ -1754,15 +1786,15 @@
       }
       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)) {
@@ -1773,6 +1805,7 @@
                 }
                 setError(null);
                 setLoading(true);
+                setProgress(null);
                 _context.p = 1;
                 if (!subscribeRequest) {
                   _context.n = 3;
@@ -1790,34 +1823,46 @@
                 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]]);
@@ -1826,6 +1871,7 @@
       }
       loadQuery();
       return function () {
+        requestIdRef.current += 1;
         if (subscribeRequest) {
           subscribeRequest.unsubscribe();
           subscribeRequest = null;