Mirror: The highly customizable and versatile GraphQL client with which you add on features like normalized caching as you grow.
fix(svelte): Move Client subscription to writable start (#3331)
authored by
Phil Pluckthun
and committed by
GitHub
a0741aad
45d686ec
+87
-82
+5
.changeset/many-rabbits-wave.md
+5
.changeset/many-rabbits-wave.md
···
1
+
---
2
+
'@urql/svelte': patch
3
+
---
4
+
5
+
Fix `queryStore` and `subscriptionStore` not subscribing when `writable` calls its `StartStopNotifier`. This caused both stores to be inactive and become unresponsive when they’ve been unsubscribed from once, as they wouldn’t be able to restart their subscriptions to the `Client`.
+38
-38
packages/svelte-urql/src/queryStore.ts
+38
-38
packages/svelte-urql/src/queryStore.ts
···
138
138
...initialResult,
139
139
operation,
140
140
};
141
-
const result$ = writable(initialState, () => {
142
-
return subscription.unsubscribe;
143
-
});
141
+
144
142
const isPaused$ = writable(!!args.pause);
145
143
146
-
const subscription = pipe(
147
-
fromStore(isPaused$),
148
-
switchMap(
149
-
(isPaused): Source<Partial<OperationResultState<Data, Variables>>> => {
150
-
if (isPaused) {
151
-
return never as any;
152
-
}
144
+
const result$ = writable(initialState, () => {
145
+
return pipe(
146
+
fromStore(isPaused$),
147
+
switchMap(
148
+
(isPaused): Source<Partial<OperationResultState<Data, Variables>>> => {
149
+
if (isPaused) {
150
+
return never as any;
151
+
}
153
152
154
-
return concat<Partial<OperationResultState<Data, Variables>>>([
155
-
fromValue({ fetching: true, stale: false }),
156
-
pipe(
157
-
args.client.executeRequestOperation(operation),
158
-
map(({ stale, data, error, extensions, operation }) => ({
159
-
fetching: false,
160
-
stale: !!stale,
161
-
data,
162
-
error,
163
-
operation,
164
-
extensions,
165
-
}))
166
-
),
167
-
fromValue({ fetching: false }),
168
-
]);
169
-
}
170
-
),
171
-
scan(
172
-
(result: OperationResultState<Data, Variables>, partial) => ({
173
-
...result,
174
-
...partial,
175
-
}),
176
-
initialState
177
-
),
178
-
subscribe(result => {
179
-
result$.set(result);
180
-
})
181
-
);
153
+
return concat<Partial<OperationResultState<Data, Variables>>>([
154
+
fromValue({ fetching: true, stale: false }),
155
+
pipe(
156
+
args.client.executeRequestOperation(operation),
157
+
map(({ stale, data, error, extensions, operation }) => ({
158
+
fetching: false,
159
+
stale: !!stale,
160
+
data,
161
+
error,
162
+
operation,
163
+
extensions,
164
+
}))
165
+
),
166
+
fromValue({ fetching: false }),
167
+
]);
168
+
}
169
+
),
170
+
scan(
171
+
(result: OperationResultState<Data, Variables>, partial) => ({
172
+
...result,
173
+
...partial,
174
+
}),
175
+
initialState
176
+
),
177
+
subscribe(result => {
178
+
result$.set(result);
179
+
})
180
+
).unsubscribe;
181
+
});
182
182
183
183
return {
184
184
...derived(result$, (result, set) => {
+44
-44
packages/svelte-urql/src/subscriptionStore.ts
+44
-44
packages/svelte-urql/src/subscriptionStore.ts
···
154
154
operation,
155
155
fetching: true,
156
156
};
157
-
const result$ = writable(initialState, () => {
158
-
return subscription.unsubscribe;
159
-
});
157
+
160
158
const isPaused$ = writable(!!args.pause);
161
159
162
-
const subscription = pipe(
163
-
fromStore(isPaused$),
164
-
switchMap(
165
-
(isPaused): Source<Partial<OperationResultState<Data, Variables>>> => {
166
-
if (isPaused) {
167
-
return never as any;
168
-
}
160
+
const result$ = writable(initialState, () => {
161
+
return pipe(
162
+
fromStore(isPaused$),
163
+
switchMap(
164
+
(isPaused): Source<Partial<OperationResultState<Data, Variables>>> => {
165
+
if (isPaused) {
166
+
return never as any;
167
+
}
169
168
170
-
return concat<Partial<OperationResultState<Data, Variables>>>([
171
-
fromValue({ fetching: true, stale: false }),
172
-
pipe(
173
-
args.client.executeRequestOperation(operation),
174
-
map(({ stale, data, error, extensions, operation }) => ({
175
-
fetching: true,
176
-
stale: !!stale,
177
-
data,
178
-
error,
179
-
operation,
180
-
extensions,
181
-
}))
182
-
),
183
-
fromValue({ fetching: false }),
184
-
]);
185
-
}
186
-
),
187
-
scan((result: OperationResultState<Result, Variables>, partial) => {
188
-
const data =
189
-
partial.data !== undefined
190
-
? typeof handler === 'function'
191
-
? handler(result.data, partial.data)
192
-
: partial.data
193
-
: result.data;
194
-
return {
195
-
...result,
196
-
...partial,
197
-
data,
198
-
} as OperationResultState<Result, Variables>;
199
-
}, initialState),
200
-
subscribe(result => {
201
-
result$.set(result);
202
-
})
203
-
);
169
+
return concat<Partial<OperationResultState<Data, Variables>>>([
170
+
fromValue({ fetching: true, stale: false }),
171
+
pipe(
172
+
args.client.executeRequestOperation(operation),
173
+
map(({ stale, data, error, extensions, operation }) => ({
174
+
fetching: true,
175
+
stale: !!stale,
176
+
data,
177
+
error,
178
+
operation,
179
+
extensions,
180
+
}))
181
+
),
182
+
fromValue({ fetching: false }),
183
+
]);
184
+
}
185
+
),
186
+
scan((result: OperationResultState<Result, Variables>, partial) => {
187
+
const data =
188
+
partial.data !== undefined
189
+
? typeof handler === 'function'
190
+
? handler(result.data, partial.data)
191
+
: partial.data
192
+
: result.data;
193
+
return {
194
+
...result,
195
+
...partial,
196
+
data,
197
+
} as OperationResultState<Result, Variables>;
198
+
}, initialState),
199
+
subscribe(result => {
200
+
result$.set(result);
201
+
})
202
+
).unsubscribe;
203
+
});
204
204
205
205
return {
206
206
...derived(result$, (result, set) => {