@khanacademy/wonder-blocks-data 9.1.2 → 10.0.1

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @khanacademy/wonder-blocks-data
 
+## 10.0.1
+
+### Patch Changes
+
+-   Updated dependencies [175a2dd2]
+    -   @khanacademy/wonder-blocks-core@4.5.0
+
+## 10.0.0
+
+### Major Changes
+
+-   5a3ec7f9: Make sure request ID generation handles objects like Date and Error instances better
+
 ## 9.1.2
 
 ### Patch Changes

package/dist/es/index.js

@@ -1,5 +1,5 @@
 import { Server, useForceUpdate } from '@khanacademy/wonder-blocks-core';
-import { KindError, clone } from '@khanacademy/wonder-stuff-core';
+import { KindError, clone, entries } from '@khanacademy/wonder-stuff-core';
 import _extends from '@babel/runtime/helpers/extends';
 import * as React from 'react';
 import { useContext, useRef, useMemo, useCallback } from 'react';
@@ -690,19 +690,30 @@ const toString = value => {
     return value;
   }
 
+  if (typeof value === "object" && value != null) {
+    if (value instanceof Date) {
+      return value.toISOString();
+    } else if (typeof value.toString === "function") {
+      return value.toString();
+    }
+  }
+
   return (_JSON$stringify = JSON.stringify(value)) != null ? _JSON$stringify : "";
 };
 
 const toStringifiedVariables = (acc, key, value) => {
   if (typeof value === "object" && value !== null) {
-    return Object.entries(value).reduce((innerAcc, [i, v]) => {
-      const subKey = `${key}.${i}`;
-      return toStringifiedVariables(innerAcc, subKey, v);
-    }, acc);
-  } else {
-    acc[key] = toString(value);
+    const subValues = entries(value);
+
+    if (subValues.length !== 0) {
+      return subValues.reduce((innerAcc, [i, v]) => {
+        const subKey = `${key}.${i}`;
+        return toStringifiedVariables(innerAcc, subKey, v);
+      }, acc);
+    }
   }
 
+  acc[key] = toString(value);
   return acc;
 };
 

package/dist/index.js

@@ -92,7 +92,7 @@ module.exports =
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return DataErrors; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return DataError; });
-/* harmony import */ var _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+/* harmony import */ var _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5);
 /* harmony import */ var _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__);
 
 
@@ -193,7 +193,7 @@ const FetchPolicy = __webpack_require__(23).Mirrored(["CacheBeforeNetwork", "Cac
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return GqlErrors; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return GqlError; });
-/* harmony import */ var _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+/* harmony import */ var _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5);
 /* harmony import */ var _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__);
 
 
@@ -239,6 +239,12 @@ class GqlError extends _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0
 
 /***/ }),
 /* 5 */
+/***/ (function(module, exports) {
+
+module.exports = require("@khanacademy/wonder-stuff-core");
+
+/***/ }),
+/* 6 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -323,7 +329,7 @@ const useSharedCache = (id, scope, initialValue) => {
 };
 
 /***/ }),
-/* 6 */
+/* 7 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -351,12 +357,6 @@ const Status = Object.freeze({
   })
 });
 
-/***/ }),
-/* 7 */
-/***/ (function(module, exports) {
-
-module.exports = require("@khanacademy/wonder-stuff-core");
-
 /***/ }),
 /* 8 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
@@ -900,7 +900,7 @@ class ScopedInMemoryCache {
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(1);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _use_server_effect_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(16);
-/* harmony import */ var _use_shared_cache_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(5);
+/* harmony import */ var _use_shared_cache_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(6);
 /* harmony import */ var _use_cached_effect_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(17);
 /* harmony import */ var _util_types_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(3);
 
@@ -1009,7 +1009,7 @@ const useHydratableEffect = (requestId, handler, options = {}) => {
 
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return SerializableInMemoryCache; });
-/* harmony import */ var _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
+/* harmony import */ var _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5);
 /* harmony import */ var _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _data_error_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(0);
 /* harmony import */ var _scoped_in_memory_cache_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(11);
@@ -1173,8 +1173,8 @@ const useServerEffect = (requestId, handler, options = {}) => {
 /* harmony import */ var _khanacademy_wonder_blocks_core__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_blocks_core__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _util_data_error_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(0);
 /* harmony import */ var _util_request_fulfillment_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(10);
-/* harmony import */ var _util_status_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(6);
-/* harmony import */ var _use_shared_cache_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(5);
+/* harmony import */ var _util_status_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(7);
+/* harmony import */ var _use_shared_cache_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(6);
 /* harmony import */ var _use_request_interception_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(20);
 /* harmony import */ var _util_types_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(3);
 
@@ -1716,7 +1716,7 @@ const abortInflightRequests = () => {
 
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return purgeCaches; });
-/* harmony import */ var _hooks_use_shared_cache_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5);
+/* harmony import */ var _hooks_use_shared_cache_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(6);
 /* harmony import */ var _hydration_cache_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(15);
 
 
@@ -1843,6 +1843,10 @@ const InterceptRequests = ({
 
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return getGqlRequestId; });
+/* harmony import */ var _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5);
+/* harmony import */ var _khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__);
+
+
 const toString = value => {
   var _JSON$stringify;
 
@@ -1850,6 +1854,14 @@ const toString = value => {
     return value;
   }
 
+  if (typeof value === "object" && value != null) {
+    if (value instanceof Date) {
+      return value.toISOString();
+    } else if (typeof value.toString === "function") {
+      return value.toString();
+    }
+  }
+
   return (_JSON$stringify = JSON.stringify(value)) != null ? _JSON$stringify : "";
 };
 
@@ -1860,14 +1872,19 @@ const toStringifiedVariables = (acc, key, value) => {
     // extra %-encodings. This means that an object or array variable
     // turns into x variables, where x is the field or element count of
     // variable. See below for example.
-    return Object.entries(value).reduce((innerAcc, [i, v]) => {
-      const subKey = `${key}.${i}`;
-      return toStringifiedVariables(innerAcc, subKey, v);
-    }, acc);
-  } else {
-    acc[key] = toString(value);
+    const subValues = Object(_khanacademy_wonder_stuff_core__WEBPACK_IMPORTED_MODULE_0__["entries"])(value); // If we don't get any entries, it's possible this is a Date, Error,
+    // or some other non-standard value. While these generally should be
+    // avoided as variables, we should handle them gracefully.
+
+    if (subValues.length !== 0) {
+      return subValues.reduce((innerAcc, [i, v]) => {
+        const subKey = `${key}.${i}`;
+        return toStringifiedVariables(innerAcc, subKey, v);
+      }, acc);
+    }
   }
 
+  acc[key] = toString(value);
   return acc;
 };
 /**
@@ -2078,7 +2095,7 @@ const useGql = (context = {}) => {
 
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return resultFromCachedResponse; });
-/* harmony import */ var _status_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(6);
+/* harmony import */ var _status_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
 /* harmony import */ var _data_error_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(0);
 
 
@@ -2208,7 +2225,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _hooks_use_cached_effect_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(17);
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useCachedEffect", function() { return _hooks_use_cached_effect_js__WEBPACK_IMPORTED_MODULE_9__["a"]; });
 
-/* harmony import */ var _hooks_use_shared_cache_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(5);
+/* harmony import */ var _hooks_use_shared_cache_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(6);
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useSharedCache", function() { return _hooks_use_shared_cache_js__WEBPACK_IMPORTED_MODULE_10__["b"]; });
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SharedCache", function() { return _hooks_use_shared_cache_js__WEBPACK_IMPORTED_MODULE_10__["a"]; });
@@ -2224,7 +2241,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _util_serializable_in_memory_cache_js__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(13);
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SerializableInMemoryCache", function() { return _util_serializable_in_memory_cache_js__WEBPACK_IMPORTED_MODULE_13__["a"]; });
 
-/* harmony import */ var _util_status_js__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(6);
+/* harmony import */ var _util_status_js__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(7);
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Status", function() { return _util_status_js__WEBPACK_IMPORTED_MODULE_14__["a"]; });
 
 /* harmony import */ var _util_get_gql_request_id_js__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(29);

package/legacy-docs.md

@@ -1,3 +1,5 @@
 Documentation for Wonder Blocks Data is now in Storybook.
 
-Either run `yarn start:storybook` locally, or visit the the stories for the `main` branch on [Chromatic](https://main--5e1bf4b385e3fb0020b7073c.chromatic.com).
+Visit the [Data
+Storybook](https://khan.github.io/wonder-blocks/?path=/docs/data) docs on GitHub
+Pages.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@khanacademy/wonder-blocks-data",
-  "version": "9.1.2",
+  "version": "10.0.1",
   "design": "v1",
   "publishConfig": {
     "access": "public"
@@ -14,7 +14,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.18.6",
-    "@khanacademy/wonder-blocks-core": "^4.4.0"
+    "@khanacademy/wonder-blocks-core": "^4.5.0"
   },
   "peerDependencies": {
     "@khanacademy/wonder-stuff-core": "^1.0.1",

package/src/util/__tests__/get-gql-request-id.test.js

@@ -104,4 +104,31 @@ describe("#getGqlRequestId", () => {
             `variable1=value1&variable2=42&variable3=&variable4=null&variable5=true&variable6.nested1=nested1&variable6.nested2=nested2&variable7.0=1&variable7.1=2&variable7.2=3`,
         );
     });
+
+    it("should handle non-primitive values in variables", () => {
+        // Arrange
+        const operation = {
+            type: "query",
+            id: "myQuery",
+        };
+        const variables = {
+            variable1: {
+                date: new Date("2020-01-01"),
+                error: new Error("BOOM!"),
+            },
+        };
+
+        // Act
+        const requestId = getGqlRequestId(operation, variables, {
+            module: "MODULE",
+            curriculum: "CURRICULUM",
+            targetLocale: "LOCALE",
+        });
+        const result = new Set(requestId.split("|"));
+
+        // Assert
+        expect(result).toContain(
+            `variable1.date=2020-01-01T00%3A00%3A00.000Z&variable1.error=Error%3A+BOOM%21`,
+        );
+    });
 });

package/src/util/get-gql-request-id.js

@@ -1,10 +1,19 @@
 // @flow
+import {entries} from "@khanacademy/wonder-stuff-core";
 import type {GqlOperation, GqlContext} from "./gql-types.js";
 
 const toString = (value: mixed): string => {
     if (typeof value === "string") {
         return value;
     }
+
+    if (typeof value === "object" && value != null) {
+        if (value instanceof Date) {
+            return value.toISOString();
+        } else if (typeof value.toString === "function") {
+            return value.toString();
+        }
+    }
     return JSON.stringify(value) ?? "";
 };
 
@@ -15,13 +24,20 @@ const toStringifiedVariables = (acc: any, key: string, value: mixed): any => {
         // extra %-encodings. This means that an object or array variable
         // turns into x variables, where x is the field or element count of
         // variable. See below for example.
-        return Object.entries(value).reduce((innerAcc, [i, v]) => {
-            const subKey = `${key}.${i}`;
-            return toStringifiedVariables(innerAcc, subKey, v);
-        }, acc);
-    } else {
-        acc[key] = toString(value);
+        const subValues = entries(value);
+
+        // If we don't get any entries, it's possible this is a Date, Error,
+        // or some other non-standard value. While these generally should be
+        // avoided as variables, we should handle them gracefully.
+        if (subValues.length !== 0) {
+            return subValues.reduce((innerAcc, [i, v]) => {
+                const subKey = `${key}.${i}`;
+                return toStringifiedVariables(innerAcc, subKey, v);
+            }, acc);
+        }
     }
+
+    acc[key] = toString(value);
     return acc;
 };