Repository: FormidableLabs/urql
Pull request #924 (2020-07-28 11:37:00)

(react/preact/svelte) - add operation to the result
## Summary

closes: https://github.com/FormidableLabs/urql/pull/918
closes: https://github.com/FormidableLabs/urql/issues/917

## Set of changes

- Adds `operation` to the result of a query/mutation/subscription


changeset-bot[bot]: ###  🦋  Changeset is good to go

Latest commit: 6b01a6a15b1d037cbd42f53a3cbff063c266ca1b

**We got this.**

<details><summary>This PR includes changesets to release 3 packages</summary>

  | Name         | Type  |
| ------------ | ----- |
| @urql/preact | Minor |
| urql         | Minor |
| @urql/svelte | Minor |

</details>

Not sure what this means? [Click here  to learn what changesets are](https://github.com/changesets/changesets/blob/master/docs/adding-a-changeset.md).

[Click here if you're a maintainer who wants to add another changeset to this PR](https://github.com/FormidableLabs/urql/new/operation-in-result?filename=.changeset/wise-cycles-melt.md&value=---%0A%22%40urql%2Fpreact%22%3A%20patch%0A%22urql%22%3A%20patch%0A%22%40urql%2Fsvelte%22%3A%20patch%0A---%0A%0A(react%2Fpreact%2Fsvelte)%20-%20add%20operation%20to%20the%20result%0A)



Patch:
diff --git a/.changeset/hot-turkeys-deliver.md b/.changeset/hot-turkeys-deliver.md
new file mode 100644
index 00000000..4c6eb0db
--- /dev/null
+++ b/.changeset/hot-turkeys-deliver.md
@@ -0,0 +1,7 @@
+---
+'@urql/preact': minor
+'urql': minor
+'@urql/svelte': minor
+---
+
+Add the operation to the query, mutation and subscription result.
diff --git a/exchanges/graphcache/default-storage/package.json b/exchanges/graphcache/default-storage/package.json
index 959545a0..a861803f 100644
--- a/exchanges/graphcache/default-storage/package.json
+++ b/exchanges/graphcache/default-storage/package.json
@@ -15,7 +15,7 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@urql/core": ">=1.12.0",
+    "@urql/core": ">=1.12.1",
     "wonka": "^4.0.14"
   }
 }
diff --git a/packages/preact-urql/src/hooks/useMutation.ts b/packages/preact-urql/src/hooks/useMutation.ts
index fc7d5eb1..84159640 100644
--- a/packages/preact-urql/src/hooks/useMutation.ts
+++ b/packages/preact-urql/src/hooks/useMutation.ts
@@ -2,10 +2,11 @@ import { useCallback } from 'preact/hooks';
 import { DocumentNode } from 'graphql';
 import { pipe, toPromise } from 'wonka';
 import {
-  OperationResult,
+  Operation,
   OperationContext,
   CombinedError,
   createRequest,
+  OperationResult,
 } from '@urql/core';
 import { useClient } from '../context';
 import { useImmediateState } from './useImmediateState';
@@ -17,6 +18,7 @@ export interface UseMutationState<T> {
   data?: T;
   error?: CombinedError;
   extensions?: Record<string, any>;
+  operation?: Operation;
 }
 
 export type UseMutationResponse<T, V> = [
@@ -56,6 +58,7 @@ export const useMutation = <T = any, V = object>(
           data: result.data,
           error: result.error,
           extensions: result.extensions,
+          operation: result.operation,
         });
         return result;
       });
diff --git a/packages/preact-urql/src/hooks/useQuery.ts b/packages/preact-urql/src/hooks/useQuery.ts
index 7d7d8fe1..4d1c1a34 100644
--- a/packages/preact-urql/src/hooks/useQuery.ts
+++ b/packages/preact-urql/src/hooks/useQuery.ts
@@ -1,7 +1,12 @@
 import { DocumentNode } from 'graphql';
 import { pipe, subscribe, onEnd } from 'wonka';
 import { useRef, useCallback } from 'preact/hooks';
-import { OperationContext, RequestPolicy, CombinedError } from '@urql/core';
+import {
+  OperationContext,
+  RequestPolicy,
+  CombinedError,
+  Operation,
+} from '@urql/core';
 
 import { useClient } from '../context';
 import { useRequest } from './useRequest';
@@ -13,6 +18,7 @@ export const initialState: UseQueryState<any> = {
   stale: false,
   data: undefined,
   error: undefined,
+  operation: undefined,
   extensions: undefined,
 };
 
@@ -31,6 +37,7 @@ export interface UseQueryState<T> {
   data?: T;
   error?: CombinedError;
   extensions?: Record<string, any>;
+  operation?: Operation;
 }
 
 export type UseQueryResponse<T> = [
@@ -75,6 +82,7 @@ export const useQuery = <T = any, V = object>(
             error: result.error,
             extensions: result.extensions,
             stale: !!result.stale,
+            operation: result.operation,
           });
         })
       );
diff --git a/packages/preact-urql/src/hooks/useSubscription.ts b/packages/preact-urql/src/hooks/useSubscription.ts
index 34c0203c..ac24fc61 100644
--- a/packages/preact-urql/src/hooks/useSubscription.ts
+++ b/packages/preact-urql/src/hooks/useSubscription.ts
@@ -1,7 +1,7 @@
 import { DocumentNode } from 'graphql';
 import { useCallback, useRef } from 'preact/hooks';
 import { pipe, onEnd, subscribe } from 'wonka';
-import { CombinedError, OperationContext } from '@urql/core';
+import { CombinedError, OperationContext, Operation } from '@urql/core';
 import { useClient } from '../context';
 import { useRequest } from './useRequest';
 import { noop, initialState } from './useQuery';
@@ -23,6 +23,7 @@ export interface UseSubscriptionState<T> {
   data?: T;
   error?: CombinedError;
   extensions?: Record<string, any>;
+  operation?: Operation;
 }
 
 export type UseSubscriptionResponse<T> = [
@@ -72,6 +73,7 @@ export const useSubscription = <T = any, R = T, V = object>(
             error: result.error,
             extensions: result.extensions,
             stale: !!result.stale,
+            operation: result.operation,
           }));
         })
       );
diff --git a/packages/react-urql/src/hooks/constants.ts b/packages/react-urql/src/hooks/constants.ts
index 258490cb..1852afcd 100644
--- a/packages/react-urql/src/hooks/constants.ts
+++ b/packages/react-urql/src/hooks/constants.ts
@@ -4,4 +4,5 @@ export const initialState = {
   error: undefined,
   data: undefined,
   extensions: undefined,
+  operation: undefined,
 };
diff --git a/packages/react-urql/src/hooks/useMutation.ts b/packages/react-urql/src/hooks/useMutation.ts
index bfd543b2..77f16b09 100644
--- a/packages/react-urql/src/hooks/useMutation.ts
+++ b/packages/react-urql/src/hooks/useMutation.ts
@@ -7,6 +7,7 @@ import {
   OperationContext,
   CombinedError,
   createRequest,
+  Operation,
 } from '@urql/core';
 
 import { useClient } from '../context';
@@ -18,6 +19,7 @@ export interface UseMutationState<T> {
   data?: T;
   error?: CombinedError;
   extensions?: Record<string, any>;
+  operation?: Operation;
 }
 
 export type UseMutationResponse<T, V> = [
@@ -54,6 +56,7 @@ export function useMutation<T = any, V = object>(
             data: result.data,
             error: result.error,
             extensions: result.extensions,
+            operation: result.operation,
           });
         }
         return result;
diff --git a/packages/react-urql/src/hooks/useQuery.ts b/packages/react-urql/src/hooks/useQuery.ts
index e2410ce4..2aa4f404 100644
--- a/packages/react-urql/src/hooks/useQuery.ts
+++ b/packages/react-urql/src/hooks/useQuery.ts
@@ -1,7 +1,12 @@
 import { DocumentNode } from 'graphql';
 import { useCallback, useMemo } from 'react';
 import { pipe, concat, fromValue, switchMap, map, scan } from 'wonka';
-import { CombinedError, OperationContext, RequestPolicy } from '@urql/core';
+import {
+  CombinedError,
+  OperationContext,
+  RequestPolicy,
+  Operation,
+} from '@urql/core';
 
 import { useClient } from '../context';
 import { useSource, useBehaviourSubject } from './useSource';
@@ -23,6 +28,7 @@ export interface UseQueryState<T> {
   data?: T;
   error?: CombinedError;
   extensions?: Record<string, any>;
+  operation?: Operation;
 }
 
 export type UseQueryResponse<T> = [
@@ -68,11 +74,12 @@ export function useQuery<T = any, V = object>(
             fromValue({ fetching: true, stale: false }),
             pipe(
               query$,
-              map(({ stale, data, error, extensions }) => ({
+              map(({ stale, data, error, extensions, operation }) => ({
                 fetching: false,
                 stale: !!stale,
                 data,
                 error,
+                operation,
                 extensions,
               }))
             ),
diff --git a/packages/react-urql/src/hooks/useSubscription.ts b/packages/react-urql/src/hooks/useSubscription.ts
index be42d67f..20726b4b 100644
--- a/packages/react-urql/src/hooks/useSubscription.ts
+++ b/packages/react-urql/src/hooks/useSubscription.ts
@@ -1,7 +1,7 @@
 import { DocumentNode } from 'graphql';
 import { useCallback, useRef, useMemo } from 'react';
 import { pipe, concat, fromValue, switchMap, map, scan } from 'wonka';
-import { CombinedError, OperationContext } from '@urql/core';
+import { CombinedError, OperationContext, Operation } from '@urql/core';
 
 import { useClient } from '../context';
 import { useSource, useBehaviourSubject } from './useSource';
@@ -23,6 +23,7 @@ export interface UseSubscriptionState<T> {
   data?: T;
   error?: CombinedError;
   extensions?: Record<string, any>;
+  operation?: Operation;
 }
 
 export type UseSubscriptionResponse<T> = [
@@ -72,12 +73,13 @@ export function useSubscription<T = any, R = T, V = object>(
             fromValue({ fetching: true, stale: false }),
             pipe(
               subscription$,
-              map(({ stale, data, error, extensions }) => ({
+              map(({ stale, data, error, extensions, operation }) => ({
                 fetching: true,
                 stale: !!stale,
                 data,
                 error,
                 extensions,
+                operation,
               }))
             ),
             // When the source proactively closes, fetching is set to false
diff --git a/packages/svelte-urql/src/operations/constants.ts b/packages/svelte-urql/src/operations/constants.ts
index 258490cb..2a3c57f4 100644
--- a/packages/svelte-urql/src/operations/constants.ts
+++ b/packages/svelte-urql/src/operations/constants.ts
@@ -3,5 +3,6 @@ export const initialState = {
   stale: false,
   error: undefined,
   data: undefined,
+  operation: undefined,
   extensions: undefined,
 };
diff --git a/packages/svelte-urql/src/operations/query.ts b/packages/svelte-urql/src/operations/query.ts
index 24e8fbed..47a01dda 100644
--- a/packages/svelte-urql/src/operations/query.ts
+++ b/packages/svelte-urql/src/operations/query.ts
@@ -14,7 +14,12 @@ import {
   toPromise,
 } from 'wonka';
 
-import { RequestPolicy, OperationContext, CombinedError } from '@urql/core';
+import {
+  RequestPolicy,
+  OperationContext,
+  CombinedError,
+  Operation,
+} from '@urql/core';
 
 import { Readable } from 'svelte/store';
 import { DocumentNode } from 'graphql';
@@ -37,6 +42,7 @@ export interface QueryResult<T> {
   data?: T;
   error?: CombinedError;
   extensions?: Record<string, any>;
+  operation?: Operation;
 }
 
 export interface QueryStore<T = any, V = object>
@@ -67,12 +73,13 @@ export const query = <T = any, V = object>(
             pollInterval: args.pollInterval,
             ...args.context,
           }),
-          map(({ stale, data, error, extensions }) => ({
+          map(({ stale, data, error, extensions, operation }) => ({
             fetching: false,
             stale: !!stale,
             data,
             error,
             extensions,
+            operation,
           }))
         ),
         // When the source proactively closes, fetching is set to false
diff --git a/packages/svelte-urql/src/operations/subscription.ts b/packages/svelte-urql/src/operations/subscription.ts
index 29746997..972e2ea8 100644
--- a/packages/svelte-urql/src/operations/subscription.ts
+++ b/packages/svelte-urql/src/operations/subscription.ts
@@ -12,7 +12,7 @@ import {
   publish,
 } from 'wonka';
 
-import { OperationContext, CombinedError } from '@urql/core';
+import { OperationContext, CombinedError, Operation } from '@urql/core';
 import { Readable } from 'svelte/store';
 import { DocumentNode } from 'graphql';
 
@@ -24,6 +24,7 @@ export interface SubscriptionArguments<V> {
   variables?: V;
   pause?: boolean;
   context?: Partial<OperationContext>;
+  operation?: Operation;
 }
 
 export type SubscriptionHandler<T, R> = (prev: R | undefined, data: T) => R;
@@ -62,12 +63,13 @@ export const subscription = <T = any, R = T, V = object>(
         fromValue({ fetching: true, stale: false }),
         pipe(
           client.subscription<T>(args.query, args.variables, args.context),
-          map(({ stale, data, error, extensions }) => ({
+          map(({ stale, data, error, extensions, operation }) => ({
             fetching: false,
             stale: !!stale,
             data,
             error,
             extensions,
+            operation,
           }))
         ),
         // When the source proactively closes, fetching is set to false


Test patch:
diff --git a/packages/react-urql/src/hooks/__snapshots__/useMutation.test.tsx.snap b/packages/react-urql/src/hooks/__snapshots__/useMutation.test.tsx.snap
index e51218fe..2da6d2de 100644
--- a/packages/react-urql/src/hooks/__snapshots__/useMutation.test.tsx.snap
+++ b/packages/react-urql/src/hooks/__snapshots__/useMutation.test.tsx.snap
@@ -6,6 +6,7 @@ Object {
   "error": undefined,
   "extensions": undefined,
   "fetching": false,
+  "operation": undefined,
   "stale": false,
 }
 `;
diff --git a/packages/react-urql/src/hooks/__snapshots__/useQuery.test.tsx.snap b/packages/react-urql/src/hooks/__snapshots__/useQuery.test.tsx.snap
index 8e42fcf5..353e67e3 100644
--- a/packages/react-urql/src/hooks/__snapshots__/useQuery.test.tsx.snap
+++ b/packages/react-urql/src/hooks/__snapshots__/useQuery.test.tsx.snap
@@ -6,6 +6,7 @@ Object {
   "error": undefined,
   "extensions": undefined,
   "fetching": true,
+  "operation": undefined,
   "stale": false,
 }
 `;
diff --git a/packages/react-urql/src/hooks/__snapshots__/useSubscription.test.tsx.snap b/packages/react-urql/src/hooks/__snapshots__/useSubscription.test.tsx.snap
index bfca60e1..ac601240 100644
--- a/packages/react-urql/src/hooks/__snapshots__/useSubscription.test.tsx.snap
+++ b/packages/react-urql/src/hooks/__snapshots__/useSubscription.test.tsx.snap
@@ -6,6 +6,7 @@ Object {
   "error": 5678,
   "extensions": undefined,
   "fetching": true,
+  "operation": undefined,
   "stale": false,
 }
 `;