···

       
1
       
1
       
+
       
---

     

       
2
       
2
       
+
       
'@urql/preact': minor

     

       
3
       
3
       
+
       
'@urql/svelte': minor

     

       
4
       
4
       
+
       
'urql': minor

     

       
5
       
5
       
+
       
'@urql/vue': minor

     

       
6
       
6
       
+
       
---

     

       
7
       
7
       
+
       


     

       
8
       
8
       
+
       
Allow mutations to update their results in bindings when `hasNext: true` is set, which indicates deferred or streamed results.

     

···

       
1
       
1
       
 
       
import { useState, useCallback, useRef, useEffect } from 'preact/hooks';

     

       
2
       
2
       
-
       
import { pipe, toPromise } from 'wonka';

     

       
2
       
2
       
+
       
import { pipe, onPush, filter, toPromise, take } from 'wonka';

     

       
3
       
3
       
 
       


     

       
4
       
4
       
 
       
import {

     

       
5
       
5
       
 
       
  AnyVariables,

     
···

       
153
       
153
       
 
       
  const executeMutation = useCallback(

     

       
154
       
154
       
 
       
    (variables: Variables, context?: Partial<OperationContext>) => {

     

       
155
       
155
       
 
       
      setState({ ...initialState, fetching: true });

     

       
156
       
156
       
-
       


     

       
157
       
156
       
 
       
      return pipe(

     

       
158
       
157
       
 
       
        client.executeMutation<Data, Variables>(

     

       
159
       
158
       
 
       
          createRequest<Data, Variables>(query, variables),

     

       
160
       
159
       
 
       
          context || {}

     

       
161
       
160
       
 
       
        ),

     

       
161
       
161
       
+
       
        onPush(result => {

     

       
162
       
162
       
+
       
          if (isMounted.current) {

     

       
163
       
163
       
+
       
            setState({

     

       
164
       
164
       
+
       
              fetching: false,

     

       
165
       
165
       
+
       
              stale: result.stale,

     

       
166
       
166
       
+
       
              data: result.data,

     

       
167
       
167
       
+
       
              error: result.error,

     

       
168
       
168
       
+
       
              extensions: result.extensions,

     

       
169
       
169
       
+
       
              operation: result.operation,

     

       
170
       
170
       
+
       
            });

     

       
171
       
171
       
+
       
          }

     

       
172
       
172
       
+
       
        }),

     

       
173
       
173
       
+
       
        filter(result => !result.hasNext),

     

       
174
       
174
       
+
       
        take(1),

     

       
162
       
175
       
 
       
        toPromise

     

       
163
       
163
       
-
       
      ).then(result => {

     

       
164
       
164
       
-
       
        if (isMounted.current) {

     

       
165
       
165
       
-
       
          setState({

     

       
166
       
166
       
-
       
            fetching: false,

     

       
167
       
167
       
-
       
            stale: !!result.stale,

     

       
168
       
168
       
-
       
            data: result.data,

     

       
169
       
169
       
-
       
            error: result.error,

     

       
170
       
170
       
-
       
            extensions: result.extensions,

     

       
171
       
171
       
-
       
            operation: result.operation,

     

       
172
       
172
       
-
       
          });

     

       
173
       
173
       
-
       
        }

     

       
174
       
174
       
-
       
        return result;

     

       
175
       
175
       
-
       
      });

     

       
176
       
176
       
+
       
      );

     

       
176
       
177
       
 
       
    },

     

       
177
       
178
       
 
       
    // eslint-disable-next-line react-hooks/exhaustive-deps

     

       
178
       
179
       
 
       
    [client, query, setState]

     

···

       
1
       
1
       
 
       
import { useState, useCallback, useRef, useEffect } from 'react';

     

       
2
       
2
       
-
       
import { pipe, toPromise } from 'wonka';

     

       
2
       
2
       
+
       
import { pipe, onPush, filter, toPromise, take } from 'wonka';

     

       
3
       
3
       
 
       


     

       
4
       
4
       
 
       
import {

     

       
5
       
5
       
 
       
  AnyVariables,

     
···

       
153
       
153
       
 
       
  const executeMutation = useCallback(

     

       
154
       
154
       
 
       
    (variables: Variables, context?: Partial<OperationContext>) => {

     

       
155
       
155
       
 
       
      deferDispatch(setState, { ...initialState, fetching: true });

     

       
156
       
156
       
-
       


     

       
157
       
156
       
 
       
      return pipe(

     

       
158
       
157
       
 
       
        client.executeMutation<Data, Variables>(

     

       
159
       
158
       
 
       
          createRequest<Data, Variables>(query, variables),

     

       
160
       
159
       
 
       
          context || {}

     

       
161
       
160
       
 
       
        ),

     

       
161
       
161
       
+
       
        onPush(result => {

     

       
162
       
162
       
+
       
          if (isMounted.current) {

     

       
163
       
163
       
+
       
            deferDispatch(setState, {

     

       
164
       
164
       
+
       
              fetching: false,

     

       
165
       
165
       
+
       
              stale: result.stale,

     

       
166
       
166
       
+
       
              data: result.data,

     

       
167
       
167
       
+
       
              error: result.error,

     

       
168
       
168
       
+
       
              extensions: result.extensions,

     

       
169
       
169
       
+
       
              operation: result.operation,

     

       
170
       
170
       
+
       
            });

     

       
171
       
171
       
+
       
          }

     

       
172
       
172
       
+
       
        }),

     

       
173
       
173
       
+
       
        filter(result => !result.hasNext),

     

       
174
       
174
       
+
       
        take(1),

     

       
162
       
175
       
 
       
        toPromise

     

       
163
       
163
       
-
       
      ).then(result => {

     

       
164
       
164
       
-
       
        if (isMounted.current) {

     

       
165
       
165
       
-
       
          deferDispatch(setState, {

     

       
166
       
166
       
-
       
            fetching: false,

     

       
167
       
167
       
-
       
            stale: !!result.stale,

     

       
168
       
168
       
-
       
            data: result.data,

     

       
169
       
169
       
-
       
            error: result.error,

     

       
170
       
170
       
-
       
            extensions: result.extensions,

     

       
171
       
171
       
-
       
            operation: result.operation,

     

       
172
       
172
       
-
       
          });

     

       
173
       
173
       
-
       
        }

     

       
174
       
174
       
-
       
        return result;

     

       
175
       
175
       
-
       
      });

     

       
176
       
176
       
+
       
      );

     

       
176
       
177
       
 
       
    },

     

       
177
       
178
       
 
       
    // eslint-disable-next-line react-hooks/exhaustive-deps

     

       
178
       
179
       
 
       
    [client, query, setState]

     

···

       
112
       
112
       
 
       
      args.client.executeRequestOperation(operation),

     

       
113
       
113
       
 
       
      map(({ stale, data, error, extensions, operation }) => ({

     

       
114
       
114
       
 
       
        fetching: false,

     

       
115
       
115
       
-
       
        stale: !!stale,

     

       
115
       
115
       
+
       
        stale,

     

       
116
       
116
       
 
       
        data,

     

       
117
       
117
       
 
       
        error,

     

       
118
       
118
       
 
       
        operation,

     

···

       
58
       
58
       
 
       


     

       
59
       
59
       
 
       
    expect(clientMutation).toHaveBeenCalledTimes(1);

     

       
60
       
60
       
 
       


     

       
61
       
61
       
-
       
    subject.next({ data: { test: true } });

     

       
61
       
61
       
+
       
    subject.next({ data: { test: true }, stale: false });

     

       
62
       
62
       
 
       
    await promise.then(function () {

     

       
63
       
63
       
 
       
      expect(mutation.fetching).toBe(false);

     

       
64
       
64
       
 
       
      expect(mutation.stale).toBe(false);

     

···

       
2
       
2
       
 
       


     

       
3
       
3
       
 
       
import { ref, Ref } from 'vue';

     

       
4
       
4
       
 
       
import { DocumentNode } from 'graphql';

     

       
5
       
5
       
-
       
import { pipe, toPromise, take } from 'wonka';

     

       
5
       
5
       
+
       
import { pipe, onPush, filter, toPromise, take } from 'wonka';

     

       
6
       
6
       
 
       


     

       
7
       
7
       
 
       
import {

     

       
8
       
8
       
 
       
  Client,

     
···

       
158
       
158
       
 
       
          createRequest<T, V>(query, unwrapPossibleProxy(variables)),

     

       
159
       
159
       
 
       
          context || {}

     

       
160
       
160
       
 
       
        ),

     

       
161
       
161
       
+
       
        onPush(result => {

     

       
162
       
162
       
+
       
          data.value = result.data;

     

       
163
       
163
       
+
       
          stale.value = result.stale;

     

       
164
       
164
       
+
       
          fetching.value = false;

     

       
165
       
165
       
+
       
          error.value = result.error;

     

       
166
       
166
       
+
       
          operation.value = result.operation;

     

       
167
       
167
       
+
       
          extensions.value = result.extensions;

     

       
168
       
168
       
+
       
        }),

     

       
169
       
169
       
+
       
        filter(result => !result.hasNext),

     

       
161
       
170
       
 
       
        take(1),

     

       
162
       
171
       
 
       
        toPromise

     

       
163
       
163
       
-
       
      ).then((res: OperationResult<T, V>) => {

     

       
164
       
164
       
-
       
        data.value = res.data;

     

       
165
       
165
       
-
       
        stale.value = !!res.stale;

     

       
166
       
166
       
-
       
        fetching.value = false;

     

       
167
       
167
       
-
       
        error.value = res.error;

     

       
168
       
168
       
-
       
        operation.value = res.operation;

     

       
169
       
169
       
-
       
        extensions.value = res.extensions;

     

       
170
       
170
       
-
       
        return res;

     

       
171
       
171
       
-
       
      });

     

       
172
       
172
       
+
       
      );

     

       
172
       
173
       
 
       
    },

     

       
173
       
174
       
 
       
  };

     

       
174
       
175
       
 
       
}