graphql-react - npm Package Compare versions

Comparing version 11.1.0 to 11.2.0

changelog.md

 # graphql-react changelog
 
+## 11.2.0
+
+### Minor
+
+- Added a new `cacheKeyCreator` option to the `GraphQL` instance method `operate` and the `useGraphQL` React hook.
+- The previously private `hashObject` function is now publicly exported.
+
+### Patch
+
+- Replaced Node.js deprecated `notEqual` assertions with `notStrictEqual` in tests.
+- Use the `TypeError` class instead of `Error` for relevant errors.
+
 ## 11.1.0
@@ -4,0 +16,0 @@

package.json

 {
   "name": "graphql-react",
-  "version": "11.1.0",
+  "version": "11.2.0",
   "description": "A GraphQL client for React using modern context and hooks APIs that is lightweight (< 3.5 KB size limited) but powerful; the first Relay and Apollo alternative with server side rendering.",
@@ -5,0 +5,0 @@ "license": "MIT",

readme.md

@@ -160,2 +160,3 @@ ![graphql-react logo](https://cdn.jsdelivr.net/gh/jaydenseric/graphql-react@0.1.0/graphql-react-logo.svg)
 - [function GraphQLProvider](#function-graphqlprovider)
+- [function hashObject](#function-hashobject)
 - [function reportCacheErrors](#function-reportcacheerrors)
@@ -167,2 +168,3 @@ - [function ssr](#function-ssr)
 - [type GraphQLCacheKey](#type-graphqlcachekey)
+- [type GraphQLCacheKeyCreator](#type-graphqlcachekeycreator)
 - [type GraphQLCacheValue](#type-graphqlcachevalue)
@@ -251,2 +253,3 @@ - [type GraphQLFetchOptions](#type-graphqlfetchoptions)
 | `options.fetchOptionsOverride` | [GraphQLFetchOptionsOverride](#type-graphqlfetchoptionsoverride)? | Overrides default GraphQL operation [`fetch` options](#type-graphqlfetchoptions). |
+| `options.cacheKeyCreator` | [GraphQLCacheKeyCreator](#type-graphqlcachekeycreator)? = [hashObject](#function-hashobject) | [GraphQL cache](#graphql-instance-property-cache) [key](#type-graphqlcachekey) creator for the operation. |
 | `options.reloadOnLoad` | boolean? = `false` | Should a [GraphQL reload](#graphql-instance-method-reload) happen after the operation loads, excluding the loaded operation cache. |
@@ -435,2 +438,42 @@ | `options.resetOnLoad` | boolean? = `false` | Should a [GraphQL reset](#graphql-instance-method-reset) happen after the operation loads, excluding the loaded operation cache. |
 
+### function hashObject
+
+Hashes an object.
+
+| Parameter | Type | Description |
+| :-- | :-- | :-- |
+| `object` | object | A JSON serializable object that may contain [`FormData`](https://developer.mozilla.org/docs/Web/API/FormData) instances. |
+
+**Returns:** string — A hash.
+
+#### See
+
+- [`GraphQLCacheKeyCreator` functions](#type-graphqlcachekeycreator) may use this to derive a [GraphQL cache](#graphql-instance-property-cache) [key](#type-graphqlcachekey).
+- [`GraphQL`](#class-graphql) instance method [`operate`](#graphql-instance-method-operate) uses this as a default value for `options.cacheKeyCreator`.
+- [`useGraphQL`](#function-usegraphql) React hook this uses this as a default value for `options.cacheKeyCreator`.
+
+#### Examples
+
+_Ways to `import`._
+
+> ```js
+> import { hashObject } from 'graphql-react';
+> ```
+>
+> ```js
+> import hashObject from 'graphql-react/universal/hashObject.js';
+> ```
+
+_Ways to `require`._
+
+> ```js
+> const { hashObject } = require('graphql-react');
+> ```
+>
+> ```js
+> const hashObject = require('graphql-react/universal/hashObject');
+> ```
+
+---
+
 ### function reportCacheErrors
@@ -570,2 +613,3 @@
 | `options.fetchOptionsOverride` | [GraphQLFetchOptionsOverride](#type-graphqlfetchoptionsoverride)? | Overrides default [`fetch` options](#type-graphqlfetchoptions) for the [GraphQL operation](#type-graphqloperation). To reduce work for following renders, define it outside the component or memoize it using the [`React.useMemo`](https://reactjs.org/docs/hooks-reference.html#usememo) hook. |
+| `options.cacheKeyCreator` | [GraphQLCacheKeyCreator](#type-graphqlcachekeycreator)? = [hashObject](#function-hashobject) | [GraphQL cache](#graphql-instance-property-cache) [key](#type-graphqlcachekey) creator for the operation. |
 | `options.loadOnMount` | boolean? = `false` | Should the operation load when the component mounts. |
@@ -678,3 +722,3 @@ | `options.loadOnReload` | boolean? = `false` | Should the operation load when the [`GraphQL`](#class-graphql) [`reload`](#graphql-event-reload) event fires and there is a [GraphQL cache](#graphql-instance-property-cache) [value](#type-graphqlcachevalue) to reload, but only if the operation was not the one that caused the reload. |
 
-- [`GraphQL`](#class-graphql) constructor accepts this type in `options.cache`.
+- [`GraphQL`](#class-graphql) constructor accepts this type for `options.cache`.
 - [`GraphQL`](#class-graphql) instance property [`cache`](#graphql-instance-property-cache) is this type.
@@ -686,3 +730,3 @@
 
-A [GraphQL cache](#type-graphqlcache) key, derived from a hash of the [`fetch` options](#type-graphqlfetchoptions) of the [GraphQL operation](#type-graphqloperation) that populated the [value](#type-graphqlcachevalue).
+A [GraphQL cache](#type-graphqlcache) key to identify a [GraphQL cache](#type-graphqlcache) [value](#type-graphqlcachevalue). Typically created by a [GraphQL cache](#type-graphqlcache) key [creator](#type-graphqlcachekeycreator) that hashes the [`fetch` options](#type-graphqlfetchoptions) of the associated [GraphQL operation](#type-graphqloperation) using [`hashObject`](#function-hashobject).
 
@@ -693,2 +737,19 @@ **Type:** string
 
+### type GraphQLCacheKeyCreator
+
+[GraphQL cache](#graphql-instance-property-cache) [key](#type-graphqlcachekey) creator for a [GraphQL operation](#type-graphqloperation). It can either use the provided [`fetch` options](#type-graphqlfetchoptions) (e.g. derive a hash), or simply return a hardcoded string.
+
+**Type:** Function
+
+| Parameter | Type | Description |
+| :-- | :-- | :-- |
+| `options` | [GraphQLFetchOptions](#type-graphqlfetchoptions) | [GraphQL `fetch` options](#type-graphqlfetchoptions) tailored to the [GraphQL operation](#type-graphqloperation), e.g. if there are files to upload `options.body` will be a [`FormData`](https://developer.mozilla.org/docs/Web/API/FormData) instance conforming to the [GraphQL multipart request spec](https://github.com/jaydenseric/graphql-multipart-request-spec). |
+
+#### See
+
+- [`GraphQL`](#class-graphql) instance method [`operate`](#graphql-instance-method-operate) accepts this type for `options.cacheKeyCreator`.
+- [`useGraphQL`](#function-usegraphql) React hook accepts this type for `options.cacheKeyCreator`.
+
+---
+
 ### type GraphQLCacheValue
@@ -741,4 +802,4 @@
 
-- [`GraphQL`](#class-graphql) instance method [`operate`](#graphql-instance-method-operate) accepts this type in `options.fetchOptionsOverride`.
-- [`useGraphQL`](#function-usegraphql) React hook accepts this type in `options.fetchOptionsOverride`.
+- [`GraphQL`](#class-graphql) instance method [`operate`](#graphql-instance-method-operate) accepts this type for `options.fetchOptionsOverride`.
+- [`useGraphQL`](#function-usegraphql) React hook accepts this type for `options.fetchOptionsOverride`.
 
@@ -771,4 +832,4 @@ #### Examples
 
-- [`GraphQL`](#class-graphql) instance method [`operate`](#graphql-instance-method-operate) accepts this type in `options.operation`.
-- [`useGraphQL`](#function-usegraphql) React hook accepts this type in `options.operation`.
+- [`GraphQL`](#class-graphql) instance method [`operate`](#graphql-instance-method-operate) accepts this type for `options.operation`.
+- [`useGraphQL`](#function-usegraphql) React hook accepts this type for `options.operation`.
 
@@ -775,0 +836,0 @@ ---

server/ssr.js

@@ -13,7 +13,7 @@ 'use strict';
   if (!(graphql instanceof GraphQL))
-    throw new Error('ssr() argument 1 must be a GraphQL instance.');
+    throw new TypeError('ssr() argument 1 must be a GraphQL instance.');
   if (arguments.length < 2)
-    throw new Error('ssr() argument 2 must be a React node.');
+    throw new TypeError('ssr() argument 2 must be a React node.');
   if (typeof render !== 'function')
-    throw new Error('ssr() argument 3 must be a function.');
+    throw new TypeError('ssr() argument 3 must be a function.');
   graphql.ssr = true;
@@ -20,0 +20,0 @@

universal/GraphQL.js

@@ -9,6 +9,6 @@ 'use strict';
 
+var hashObject = require('./hashObject');
+
 var graphqlFetchOptions = require('./private/graphqlFetchOptions');
 
-var hashObject = require('./private/hashObject');
-
 module.exports =
@@ -53,3 +53,3 @@ ((_temp = function GraphQL(_temp2) {
               return Promise.reject(
-                new Error('Global fetch API or polyfill unavailable.')
+                new TypeError('Global fetch API or polyfill unavailable.')
               );
@@ -112,6 +112,13 @@ };
         fetchOptionsOverride = _ref6.fetchOptionsOverride,
+        _ref6$cacheKeyCreator = _ref6.cacheKeyCreator,
+        cacheKeyCreator =
+          _ref6$cacheKeyCreator === void 0 ? hashObject : _ref6$cacheKeyCreator,
         reloadOnLoad = _ref6.reloadOnLoad,
         resetOnLoad = _ref6.resetOnLoad;
+      if (typeof cacheKeyCreator !== 'function')
+        throw new TypeError(
+          'operate() option “cacheKeyCreator” must be a function.'
+        );
       if (reloadOnLoad && resetOnLoad)
-        throw new Error(
+        throw new TypeError(
           'operate() options “reloadOnLoad” and “resetOnLoad” can’t both be true.'
@@ -121,3 +128,3 @@ );
       if (fetchOptionsOverride) fetchOptionsOverride(fetchOptions);
-      var cacheKey = hashObject(fetchOptions);
+      var cacheKey = cacheKeyCreator(fetchOptions);
 
@@ -124,0 +131,0 @@ var cacheValuePromise =

universal/index.js

@@ -6,3 +6,4 @@ 'use strict';
 exports.GraphQLProvider = require('./GraphQLProvider');
+exports.hashObject = require('./hashObject');
 exports.reportCacheErrors = require('./reportCacheErrors');
 exports.useGraphQL = require('./useGraphQL');

universal/useGraphQL.js

@@ -11,2 +11,4 @@ 'use strict';
 
+var hashObject = require('./hashObject');
+
 var FirstRenderDateContext = require('./private/FirstRenderDateContext');
@@ -16,7 +18,8 @@
 
-var hashObject = require('./private/hashObject');
-
 module.exports = function useGraphQL(_ref) {
   var operation = _ref.operation,
     fetchOptionsOverride = _ref.fetchOptionsOverride,
+    _ref$cacheKeyCreator = _ref.cacheKeyCreator,
+    cacheKeyCreator =
+      _ref$cacheKeyCreator === void 0 ? hashObject : _ref$cacheKeyCreator,
     loadOnMount = _ref.loadOnMount,
@@ -27,4 +30,8 @@ loadOnReload = _ref.loadOnReload,
     resetOnLoad = _ref.resetOnLoad;
+  if (typeof cacheKeyCreator !== 'function')
+    throw new TypeError(
+      'useGraphQL() option “cacheKeyCreator” must be a function.'
+    );
   if (reloadOnLoad && resetOnLoad)
-    throw new Error(
+    throw new TypeError(
       'useGraphQL() options “reloadOnLoad” and “resetOnLoad” can’t both be true.'
@@ -34,23 +41,23 @@ );
   if (typeof graphql === 'undefined')
-    throw new Error('GraphQL context missing.');
+    throw new TypeError('GraphQL context missing.');
   if (!(graphql instanceof GraphQL))
-    throw new Error('GraphQL context must be a GraphQL instance.');
-  var fetchOptionsHash = React.useMemo(
+    throw new TypeError('GraphQL context must be a GraphQL instance.');
+  var freshCacheKey = React.useMemo(
     function () {
       var fetchOptions = graphqlFetchOptions(operation);
       if (fetchOptionsOverride) fetchOptionsOverride(fetchOptions);
-      return hashObject(fetchOptions);
+      return cacheKeyCreator(fetchOptions);
     },
-    [fetchOptionsOverride, operation]
+    [cacheKeyCreator, fetchOptionsOverride, operation]
   );
 
-  var _React$useState = React.useState(fetchOptionsHash in graphql.operations),
+  var _React$useState = React.useState(freshCacheKey in graphql.operations),
     loading = _React$useState[0],
     setLoading = _React$useState[1];
 
-  var _React$useState2 = React.useState(fetchOptionsHash),
+  var _React$useState2 = React.useState(freshCacheKey),
     cacheKey = _React$useState2[0],
     setCacheKey = _React$useState2[1];
 
-  var _React$useState3 = React.useState(graphql.cache[fetchOptionsHash]),
+  var _React$useState3 = React.useState(graphql.cache[freshCacheKey]),
     cacheValue = _React$useState3[0],
@@ -63,6 +70,6 @@ setCacheValue = _React$useState3[1];
 
-  if (cacheKey !== fetchOptionsHash) {
-    setLoading((loading = fetchOptionsHash in graphql.operations));
-    setCacheKey((cacheKey = fetchOptionsHash));
-    setCacheValue((cacheValue = graphql.cache[fetchOptionsHash]));
+  if (cacheKey !== freshCacheKey) {
+    setLoading((loading = freshCacheKey in graphql.operations));
+    setCacheKey((cacheKey = freshCacheKey));
+    setCacheValue((cacheValue = graphql.cache[freshCacheKey]));
     if (cacheValue) setLoadedCacheValue((loadedCacheValue = cacheValue));
@@ -76,2 +83,3 @@ }
           fetchOptionsOverride: fetchOptionsOverride,
+          cacheKeyCreator: cacheKeyCreator,
           reloadOnLoad: reloadOnLoad,
@@ -85,3 +93,10 @@ resetOnLoad: resetOnLoad,
     },
-    [fetchOptionsOverride, graphql, operation, reloadOnLoad, resetOnLoad]
+    [
+      cacheKeyCreator,
+      fetchOptionsOverride,
+      graphql,
+      operation,
+      reloadOnLoad,
+      resetOnLoad,
+    ]
   );
@@ -207,4 +222,5 @@ var isMountedRef = React.useRef(false);
     graphql.operate({
+      operation: operation,
       fetchOptionsOverride: fetchOptionsOverride,
-      operation: operation,
+      cacheKeyCreator: cacheKeyCreator,
       reloadOnLoad: reloadOnLoad,
@@ -211,0 +227,0 @@ resetOnLoad: resetOnLoad,

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

94831

increased by4.6%

Lines of code

527

increased by4.98%

Number of lines in readme file

1046

increased by6.19%

No dependency changes