@shopify/react-graphql - npm Package Compare versions

Comparing version 8.0.0-wp5-beta.1 to 8.0.0

build/cjs/async/query.js

@@ -5,3 +5,2 @@ 'use strict';
 
-var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.js');
 var async = require('@shopify/async');
@@ -33,5 +32,6 @@ var reactAsync = require('@shopify/react-async');
     const load = usePreload();
-    return backgroundQuery.useBackgroundQuery(load, _rollupPluginBabelHelpers.objectSpread2({
-      pollInterval: 10000
-    }, options));
+    return backgroundQuery.useBackgroundQuery(load, {
+      pollInterval: 10000,
+      ...options
+    });
   }
@@ -38,0 +38,0 @@

build/cjs/hooks/background-query.js

@@ -5,3 +5,2 @@ 'use strict';
 
-var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
@@ -33,3 +32,3 @@ var apolloClient = require('./apollo-client.js');
   }, []);
-  return React.useCallback( /*#__PURE__*/_rollupPluginBabelHelpers.asyncToGenerator(function* () {
+  return React.useCallback(async () => {
     if (subscription.current) {
@@ -39,3 +38,3 @@ return;
 
-    const query = yield load();
+    const query = await load();
 
@@ -46,6 +45,7 @@ if (query == null || query instanceof Error) {
 
-    const observableQuery = lastClient.current.watchQuery(_rollupPluginBabelHelpers.objectSpread2({
+    const observableQuery = lastClient.current.watchQuery({
       query,
-      fetchPolicy: 'network-only'
-    }, lastOptions.current));
+      fetchPolicy: 'network-only',
+      ...lastOptions.current
+    });
 
@@ -62,5 +62,5 @@ const unsubscribe = () => {
     subscription.current = observableQuery.subscribe(unsubscribe, unsubscribe);
-  }), [load]);
+  }, [load]);
 }
 
 exports.useBackgroundQuery = useBackgroundQuery;

build/cjs/hooks/graphql-document.js

@@ -5,3 +5,2 @@ 'use strict';
 
-var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
@@ -20,6 +19,6 @@ var reactHooks = require('@shopify/react-hooks');
   const mounted = reactHooks.useMountedRef();
-  const loadDocument = React.useCallback( /*#__PURE__*/_rollupPluginBabelHelpers.asyncToGenerator(function* () {
+  const loadDocument = React.useCallback(async () => {
     if (!isDocumentNode(documentOrAsyncDocument)) {
       try {
-        const resolved = yield documentOrAsyncDocument.resolver.resolve();
+        const resolved = await documentOrAsyncDocument.resolver.resolve();
 
@@ -33,3 +32,3 @@ if (mounted.current) {
     }
-  }), [documentOrAsyncDocument, mounted]);
+  }, [documentOrAsyncDocument, mounted]);
   React.useEffect(() => {
@@ -36,0 +35,0 @@ if (!document) {

build/cjs/hooks/mutation.js

@@ -5,3 +5,2 @@ 'use strict';
 
-var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
@@ -23,6 +22,7 @@ var apolloClient = require('./apollo-client.js');
   const runMutation = React.useCallback((perMutationOptions = {}) => {
-    const mutateVariables = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, variables || {}), perMutationOptions.variables || {});
-
+    const mutateVariables = { ...(variables || {}),
+      ...(perMutationOptions.variables || {})
+    };
     delete perMutationOptions.variables;
-    return client.mutate(_rollupPluginBabelHelpers.objectSpread2({
+    return client.mutate({
       mutation,
@@ -35,4 +35,5 @@ variables: mutateVariables,
       context,
-      fetchPolicy
-    }, perMutationOptions));
+      fetchPolicy,
+      ...perMutationOptions
+    });
   }, // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -39,0 +40,0 @@ [client, mutation, refetchQueries, awaitRefetchQueries, update, context, fetchPolicy, // eslint-disable-next-line react-hooks/exhaustive-deps

build/cjs/hooks/query.js

@@ -5,3 +5,2 @@ 'use strict';
 
-var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
@@ -13,2 +12,3 @@ var apolloClient$1 = require('apollo-client');
 
+/* eslint react-hooks/rules-of-hooks: off */
 function useQuery(queryOrAsyncQuery, ...optionsPart) {
@@ -93,6 +93,6 @@ const [options = {}] = optionsPart;
     if (!queryObservable) {
-      return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, defaultResult), {}, {
+      return { ...defaultResult,
         // while documentNode is loading
         loading: true
-      });
+      };
     }
@@ -108,3 +108,5 @@
     if (result.loading) {
-      data = previousData.current || result && result.data ? _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, previousData.current || {}), result && result.data || {}) : undefined;
+      data = previousData.current || result && result.data ? { ...(previousData.current || {}),
+        ...(result && result.data || {})
+      } : undefined;
     } else if (hasError) {
@@ -118,3 +120,3 @@ data = (queryObservable.getLastResult() || {}).data;
 
-    return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, defaultResult), {}, {
+    return { ...defaultResult,
       data,
@@ -126,3 +128,3 @@ error: hasError ? new apolloClient$1.ApolloError({
       loading: result.loading
-    }); // eslint-disable-next-line react-hooks/exhaustive-deps
+    }; // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [responseId, skip, queryObservable, defaultResult, previousData]);
@@ -129,0 +131,0 @@ return currentResult;

build/cjs/Prefetch.js

@@ -5,3 +5,2 @@ 'use strict';
 
-var _rollupPluginBabelHelpers = require('./_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
@@ -14,9 +13,6 @@ var Query = require('./Query.js');
 
-const _excluded = ["ignoreCache"];
-function Prefetch(_ref) {
-  let {
-    ignoreCache
-  } = _ref,
-      props = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
+function Prefetch({
+  ignoreCache,
+  ...props
+}) {
   const fetchPolicy = ignoreCache ? 'network-only' : undefined;
@@ -23,0 +19,0 @@ return /*#__PURE__*/React__default["default"].createElement(Query.Query, Object.assign({}, props, {

build/cjs/Query.js

@@ -5,13 +5,9 @@ 'use strict';
 
-var _rollupPluginBabelHelpers = require('./_virtual/_rollupPluginBabelHelpers.js');
 var query = require('./hooks/query.js');
 
-const _excluded = ["children", "query"];
-function Query(_ref) {
-  let {
-    children,
-    query: query$1
-  } = _ref,
-      options = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
+function Query({
+  children,
+  query: query$1,
+  ...options
+}) {
   const opts = [options];
@@ -18,0 +14,0 @@ const result = query["default"](query$1, ...opts);

build/ts/hooks/background-query.d.ts

 import { DocumentNode } from 'graphql-typed';
 import { WatchQueryOptions } from 'apollo-client';
-import { Omit } from '@shopify/useful-types';
 export declare function useBackgroundQuery(load: () => Promise<DocumentNode | null | Error>, options?: Omit<WatchQueryOptions, 'query'>): () => Promise<void>;
 //# sourceMappingURL=background-query.d.ts.map

build/ts/hooks/types.d.ts

 import { ApolloClient, MutationOptions as ClientMutationOptions } from 'apollo-client';
 import { QueryResult, ExecutionResult, OperationVariables } from '@apollo/react-common';
 import { QueryOptions, MutationOptions } from '@apollo/react-hooks';
-import { Omit, IfAllNullableKeys } from '@shopify/useful-types';
+import { IfAllNullableKeys } from '@shopify/useful-types';
 import { VariableOptions } from '../types';
@@ -6,0 +6,0 @@ export declare type QueryHookOptions<Data = any, Variables = OperationVariables> = Omit<QueryOptions<Data, Variables>, 'query' | 'partialRefetch' | 'children' | 'variables'> & VariableOptions<Variables> & {

build/ts/index.d.ts

@@ -6,3 +6,3 @@ export { DeferTiming } from '@shopify/async';
 export { createAsyncQueryComponent, createAsyncQuery } from './async';
-export type { AsyncQueryComponentType, GraphQLData, GraphQLVariables, GraphQLDeepPartial, QueryProps, } from './types';
+export type { AsyncQueryComponentType, GraphQLData, GraphQLVariables, GraphQLDeepPartial, QueryProps, NetworkStatus, } from './types';
 export { ApolloProvider } from './ApolloProvider';
@@ -9,0 +9,0 @@ export { createSsrExtractableLink, SsrExtractableLink } from './links';

build/ts/types.d.ts

 import React from 'react';
 import { DocumentNode, GraphQLOperation, GraphQLData, GraphQLVariables, GraphQLDeepPartial } from 'graphql-typed';
 import { QueryResult } from '@apollo/react-common';
-import { ErrorPolicy, OperationVariables, ApolloError, ApolloClient, WatchQueryFetchPolicy } from 'apollo-client';
+import { ErrorPolicy, OperationVariables, ApolloError, ApolloClient, WatchQueryFetchPolicy, NetworkStatus } from 'apollo-client';
 import { IfEmptyObject, IfAllNullableKeys } from '@shopify/useful-types';
 import { AsyncComponentType, AsyncHookTarget } from '@shopify/react-async';
 import { QueryHookOptions } from './hooks';
-export type { GraphQLData, GraphQLVariables, GraphQLDeepPartial, GraphQLOperation, };
+export type { GraphQLData, GraphQLVariables, GraphQLDeepPartial, GraphQLOperation, NetworkStatus, };
 export declare type VariableOptions<Variables> = IfEmptyObject<Variables, {
@@ -10,0 +10,0 @@ variables?: never;

index.js

@@ -1,4 +0,1 @@
-function interopRequireDefault(obj) {
-  return obj && obj.__esModule ? obj : {default: obj};
-}
-module.exports = interopRequireDefault(require("./build/cjs/index.js"));
+module.exports = require("./build/cjs/index.js");

package.json

 {
   "name": "@shopify/react-graphql",
-  "version": "8.0.0-wp5-beta.1",
+  "version": "8.0.0",
   "license": "MIT",
@@ -24,3 +24,3 @@ "description": "Tools for creating type-safe and asynchronous GraphQL components for React",
   "engines": {
-    "node": ">=12.14.0"
+    "node": "^14.17.0 || >=16.0.0"
   },
@@ -30,15 +30,15 @@ "dependencies": {
     "@apollo/react-hooks": ">=3.0.0 <4.0.0",
-    "@shopify/async": "^4.0.0-wp5-beta.1",
-    "@shopify/react-async": "^5.0.0-wp5-beta.1",
-    "@shopify/react-effect": "^4.1.7",
-    "@shopify/react-hooks": "^2.1.8",
-    "@shopify/react-idle": "^3.0.0-wp5-beta.1",
-    "@shopify/useful-types": "^3.0.5",
+    "@shopify/async": "^4.0.0",
+    "@shopify/react-async": "^5.0.0",
+    "@shopify/react-effect": "^5.0.0",
+    "@shopify/react-hooks": "^3.0.0",
+    "@shopify/react-idle": "^3.0.0",
+    "@shopify/useful-types": "^5.0.0",
     "apollo-cache-inmemory": ">=1.0.0 <2.0.0",
     "apollo-client": ">=2.0.0 <3.0.0",
     "apollo-link": ">=1.0.0 <2.0.0",
-    "graphql-typed": "^1.1.1"
+    "graphql-typed": "^2.0.0"
   },
   "devDependencies": {
-    "@shopify/react-testing": "^3.2.9"
+    "@shopify/react-testing": "^4.0.0"
   },
@@ -59,10 +59,9 @@ "files": [
   "exports": {
-    "./": "./",
     ".": {
+      "esnext": "./index.esnext",
       "import": "./index.mjs",
-      "require": "./index.js",
-      "esnext": "./index.esnext"
+      "require": "./index.js"
     }
   },
-  "gitHead": "3d18c950fedaa4f622f4177887b3ea297eb7d0d3"
+  "gitHead": "ef9afc562672dcda9d7800753dc6b777ecd2d751"
 }

README.md

@@ -17,3 +17,3 @@ # `@shopify/react-graphql`
 
-This library builds on top of [react-apollo](https://github.com/apollographql/react-apollo). It provides alternatives to many of Apollo’s APIs, including `useQuery` and `useMutation`, to provide seamless and thorough type checking for query components whose types are generated by [`graphql-typescript-definitions`](https://github.com/Shopify/graphql-tools-web/tree/main/packages/graphql-typescript-definitions). Additionally, it provides techniques for creating asynchronously loaded GraphQL queries that seamlessly interoperate with [`@shopify/react-async`’s](../react-async) `usePreload`, `usePrefetch`, and `useKeepFresh` APIs.
+This library builds on top of [react-apollo](https://github.com/apollographql/react-apollo). It provides alternatives to many of Apollo’s APIs, including `useQuery` and `useMutation`, to provide seamless and thorough type checking for query components whose types are generated by [`graphql-typescript-definitions`](https://github.com/Shopify/quilt/tree/main/packages/graphql-typescript-definitions). Additionally, it provides techniques for creating asynchronously loaded GraphQL queries that seamlessly interoperate with [`@shopify/react-async`’s](../react-async) `usePreload`, `usePrefetch`, and `useKeepFresh` APIs.
 
@@ -20,0 +20,0 @@ ### Prerequisites

Fixed alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Number of low quality alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

83784

decreased by-9.73%

Number of package files

79

decreased by-2.47%

Lines of code

1113

decreased by-16.44%

Dependency changes

• + Added@shopify/react-hooks@3.2.0(transitive)

• + Addedgraphql-typed@2.3.0(transitive)

• - Removed@shopify/react-effect@4.1.12(transitive)

• - Removed@shopify/react-hooks@2.1.19(transitive)

• - Removed@shopify/useful-types@3.1.0(transitive)

• - Removedgraphql-typed@1.1.5(transitive)

• Updated@shopify/async@^4.0.0

• Updated@shopify/react-async@^5.0.0

• Updated@shopify/react-effect@^5.0.0

• Updated@shopify/react-hooks@^3.0.0

• Updated@shopify/react-idle@^3.0.0

• Updated@shopify/useful-types@^5.0.0

• Updatedgraphql-typed@^2.0.0