@spoosh/plugin-refetch 0.1.7 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +59 -36
- package/dist/index.mjs +59 -36
- package/package.json +4 -4
package/README.md
CHANGED
|
@@ -16,7 +16,7 @@ npm install @spoosh/plugin-refetch
|
|
|
16
16
|
import { Spoosh } from "@spoosh/core";
|
|
17
17
|
import { refetchPlugin } from "@spoosh/plugin-refetch";
|
|
18
18
|
|
|
19
|
-
const
|
|
19
|
+
const spoosh = new Spoosh<ApiSchema, Error>("/api").use([
|
|
20
20
|
refetchPlugin({
|
|
21
21
|
refetchOnFocus: true,
|
|
22
22
|
refetchOnReconnect: true,
|
package/dist/index.d.mts
CHANGED
|
@@ -30,7 +30,7 @@ type RefetchWriteResult = object;
|
|
|
30
30
|
* ```ts
|
|
31
31
|
* import { Spoosh } from "@spoosh/core";
|
|
32
32
|
*
|
|
33
|
-
* const
|
|
33
|
+
* const spoosh = new Spoosh<ApiSchema, Error>("/api")
|
|
34
34
|
* .use([
|
|
35
35
|
* // ... other plugins
|
|
36
36
|
* refetchPlugin({ refetchOnFocus: true, refetchOnReconnect: true }),
|
package/dist/index.d.ts
CHANGED
|
@@ -30,7 +30,7 @@ type RefetchWriteResult = object;
|
|
|
30
30
|
* ```ts
|
|
31
31
|
* import { Spoosh } from "@spoosh/core";
|
|
32
32
|
*
|
|
33
|
-
* const
|
|
33
|
+
* const spoosh = new Spoosh<ApiSchema, Error>("/api")
|
|
34
34
|
* .use([
|
|
35
35
|
* // ... other plugins
|
|
36
36
|
* refetchPlugin({ refetchOnFocus: true, refetchOnReconnect: true }),
|
package/dist/index.js
CHANGED
|
@@ -25,14 +25,19 @@ __export(src_exports, {
|
|
|
25
25
|
module.exports = __toCommonJS(src_exports);
|
|
26
26
|
|
|
27
27
|
// src/plugin.ts
|
|
28
|
+
var PLUGIN_NAME = "spoosh:refetch";
|
|
28
29
|
function refetchPlugin(config = {}) {
|
|
29
30
|
const { refetchOnFocus = false, refetchOnReconnect = false } = config;
|
|
30
31
|
const listenersByHook = /* @__PURE__ */ new Map();
|
|
31
32
|
const isBrowser = typeof window !== "undefined";
|
|
32
|
-
const setupFocusListener = (
|
|
33
|
+
const setupFocusListener = (instanceId, queryKey, eventEmitter, eventTracer) => {
|
|
33
34
|
if (!isBrowser) return;
|
|
34
35
|
const visibilityHandler = () => {
|
|
35
36
|
if (document.visibilityState === "visible") {
|
|
37
|
+
eventTracer?.emit("Triggered on visibility", {
|
|
38
|
+
queryKey,
|
|
39
|
+
color: "success"
|
|
40
|
+
});
|
|
36
41
|
eventEmitter.emit("refetch", {
|
|
37
42
|
queryKey,
|
|
38
43
|
reason: "focus"
|
|
@@ -40,6 +45,10 @@ function refetchPlugin(config = {}) {
|
|
|
40
45
|
}
|
|
41
46
|
};
|
|
42
47
|
const focusHandler = () => {
|
|
48
|
+
eventTracer?.emit("Triggered on focus", {
|
|
49
|
+
queryKey,
|
|
50
|
+
color: "success"
|
|
51
|
+
});
|
|
43
52
|
eventEmitter.emit("refetch", {
|
|
44
53
|
queryKey,
|
|
45
54
|
reason: "focus"
|
|
@@ -47,100 +56,114 @@ function refetchPlugin(config = {}) {
|
|
|
47
56
|
};
|
|
48
57
|
document.addEventListener("visibilitychange", visibilityHandler);
|
|
49
58
|
window.addEventListener("focus", focusHandler);
|
|
50
|
-
|
|
59
|
+
eventTracer?.emit("Focus listener setup", {
|
|
60
|
+
queryKey,
|
|
61
|
+
color: "info"
|
|
62
|
+
});
|
|
63
|
+
const entry = listenersByHook.get(instanceId) ?? { queryKey };
|
|
51
64
|
entry.queryKey = queryKey;
|
|
52
65
|
entry.focusCleanup = () => {
|
|
53
66
|
document.removeEventListener("visibilitychange", visibilityHandler);
|
|
54
67
|
window.removeEventListener("focus", focusHandler);
|
|
55
68
|
};
|
|
56
|
-
listenersByHook.set(
|
|
69
|
+
listenersByHook.set(instanceId, entry);
|
|
57
70
|
};
|
|
58
|
-
const setupReconnectListener = (
|
|
71
|
+
const setupReconnectListener = (instanceId, queryKey, eventEmitter, eventTracer) => {
|
|
59
72
|
if (!isBrowser) return;
|
|
60
73
|
const handler = () => {
|
|
74
|
+
eventTracer?.emit("Triggered on reconnect", {
|
|
75
|
+
queryKey,
|
|
76
|
+
color: "success"
|
|
77
|
+
});
|
|
61
78
|
eventEmitter.emit("refetch", {
|
|
62
79
|
queryKey,
|
|
63
80
|
reason: "reconnect"
|
|
64
81
|
});
|
|
65
82
|
};
|
|
66
83
|
window.addEventListener("online", handler);
|
|
67
|
-
|
|
84
|
+
eventTracer?.emit("Reconnect listener setup", {
|
|
85
|
+
queryKey,
|
|
86
|
+
color: "info"
|
|
87
|
+
});
|
|
88
|
+
const entry = listenersByHook.get(instanceId) ?? { queryKey };
|
|
68
89
|
entry.queryKey = queryKey;
|
|
69
90
|
entry.reconnectCleanup = () => {
|
|
70
91
|
window.removeEventListener("online", handler);
|
|
71
92
|
};
|
|
72
|
-
listenersByHook.set(
|
|
93
|
+
listenersByHook.set(instanceId, entry);
|
|
73
94
|
};
|
|
74
|
-
const cleanupHook = (
|
|
75
|
-
const entry = listenersByHook.get(
|
|
95
|
+
const cleanupHook = (instanceId) => {
|
|
96
|
+
const entry = listenersByHook.get(instanceId);
|
|
76
97
|
if (entry) {
|
|
77
98
|
entry.focusCleanup?.();
|
|
78
99
|
entry.reconnectCleanup?.();
|
|
79
|
-
listenersByHook.delete(
|
|
100
|
+
listenersByHook.delete(instanceId);
|
|
80
101
|
}
|
|
81
102
|
};
|
|
82
|
-
const hasFocusListener = (
|
|
83
|
-
return listenersByHook.get(
|
|
103
|
+
const hasFocusListener = (instanceId) => {
|
|
104
|
+
return listenersByHook.get(instanceId)?.focusCleanup !== void 0;
|
|
84
105
|
};
|
|
85
|
-
const hasReconnectListener = (
|
|
86
|
-
return listenersByHook.get(
|
|
106
|
+
const hasReconnectListener = (instanceId) => {
|
|
107
|
+
return listenersByHook.get(instanceId)?.reconnectCleanup !== void 0;
|
|
87
108
|
};
|
|
88
|
-
const removeFocusListener = (
|
|
89
|
-
const entry = listenersByHook.get(
|
|
109
|
+
const removeFocusListener = (instanceId) => {
|
|
110
|
+
const entry = listenersByHook.get(instanceId);
|
|
90
111
|
if (entry?.focusCleanup) {
|
|
91
112
|
entry.focusCleanup();
|
|
92
113
|
entry.focusCleanup = void 0;
|
|
93
114
|
}
|
|
94
115
|
};
|
|
95
|
-
const removeReconnectListener = (
|
|
96
|
-
const entry = listenersByHook.get(
|
|
116
|
+
const removeReconnectListener = (instanceId) => {
|
|
117
|
+
const entry = listenersByHook.get(instanceId);
|
|
97
118
|
if (entry?.reconnectCleanup) {
|
|
98
119
|
entry.reconnectCleanup();
|
|
99
120
|
entry.reconnectCleanup = void 0;
|
|
100
121
|
}
|
|
101
122
|
};
|
|
102
123
|
return {
|
|
103
|
-
name:
|
|
124
|
+
name: PLUGIN_NAME,
|
|
104
125
|
operations: ["read", "infiniteRead"],
|
|
105
126
|
lifecycle: {
|
|
106
127
|
onMount(context) {
|
|
107
|
-
const { queryKey, eventEmitter,
|
|
108
|
-
|
|
128
|
+
const { queryKey, eventEmitter, instanceId } = context;
|
|
129
|
+
const et = context.eventTracer?.(PLUGIN_NAME);
|
|
130
|
+
if (!instanceId) return;
|
|
109
131
|
const pluginOptions = context.pluginOptions;
|
|
110
132
|
const shouldRefetchOnFocus = pluginOptions?.refetchOnFocus ?? refetchOnFocus;
|
|
111
133
|
const shouldRefetchOnReconnect = pluginOptions?.refetchOnReconnect ?? refetchOnReconnect;
|
|
112
134
|
if (shouldRefetchOnFocus) {
|
|
113
|
-
setupFocusListener(
|
|
135
|
+
setupFocusListener(instanceId, queryKey, eventEmitter, et);
|
|
114
136
|
}
|
|
115
137
|
if (shouldRefetchOnReconnect) {
|
|
116
|
-
setupReconnectListener(
|
|
138
|
+
setupReconnectListener(instanceId, queryKey, eventEmitter, et);
|
|
117
139
|
}
|
|
118
140
|
},
|
|
119
141
|
onUpdate(context) {
|
|
120
|
-
const { queryKey, eventEmitter,
|
|
121
|
-
|
|
142
|
+
const { queryKey, eventEmitter, instanceId } = context;
|
|
143
|
+
const et = context.eventTracer?.(PLUGIN_NAME);
|
|
144
|
+
if (!instanceId) return;
|
|
122
145
|
const pluginOptions = context.pluginOptions;
|
|
123
146
|
const shouldRefetchOnFocus = pluginOptions?.refetchOnFocus ?? refetchOnFocus;
|
|
124
147
|
const shouldRefetchOnReconnect = pluginOptions?.refetchOnReconnect ?? refetchOnReconnect;
|
|
125
|
-
const entry = listenersByHook.get(
|
|
148
|
+
const entry = listenersByHook.get(instanceId);
|
|
126
149
|
const queryKeyChanged = entry && entry.queryKey !== queryKey;
|
|
127
150
|
if (queryKeyChanged) {
|
|
128
|
-
cleanupHook(
|
|
151
|
+
cleanupHook(instanceId);
|
|
129
152
|
}
|
|
130
|
-
if (shouldRefetchOnFocus && !hasFocusListener(
|
|
131
|
-
setupFocusListener(
|
|
132
|
-
} else if (!shouldRefetchOnFocus && hasFocusListener(
|
|
133
|
-
removeFocusListener(
|
|
153
|
+
if (shouldRefetchOnFocus && !hasFocusListener(instanceId)) {
|
|
154
|
+
setupFocusListener(instanceId, queryKey, eventEmitter, et);
|
|
155
|
+
} else if (!shouldRefetchOnFocus && hasFocusListener(instanceId)) {
|
|
156
|
+
removeFocusListener(instanceId);
|
|
134
157
|
}
|
|
135
|
-
if (shouldRefetchOnReconnect && !hasReconnectListener(
|
|
136
|
-
setupReconnectListener(
|
|
137
|
-
} else if (!shouldRefetchOnReconnect && hasReconnectListener(
|
|
138
|
-
removeReconnectListener(
|
|
158
|
+
if (shouldRefetchOnReconnect && !hasReconnectListener(instanceId)) {
|
|
159
|
+
setupReconnectListener(instanceId, queryKey, eventEmitter, et);
|
|
160
|
+
} else if (!shouldRefetchOnReconnect && hasReconnectListener(instanceId)) {
|
|
161
|
+
removeReconnectListener(instanceId);
|
|
139
162
|
}
|
|
140
163
|
},
|
|
141
164
|
onUnmount(context) {
|
|
142
|
-
if (context.
|
|
143
|
-
cleanupHook(context.
|
|
165
|
+
if (context.instanceId) {
|
|
166
|
+
cleanupHook(context.instanceId);
|
|
144
167
|
}
|
|
145
168
|
}
|
|
146
169
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -1,12 +1,17 @@
|
|
|
1
1
|
// src/plugin.ts
|
|
2
|
+
var PLUGIN_NAME = "spoosh:refetch";
|
|
2
3
|
function refetchPlugin(config = {}) {
|
|
3
4
|
const { refetchOnFocus = false, refetchOnReconnect = false } = config;
|
|
4
5
|
const listenersByHook = /* @__PURE__ */ new Map();
|
|
5
6
|
const isBrowser = typeof window !== "undefined";
|
|
6
|
-
const setupFocusListener = (
|
|
7
|
+
const setupFocusListener = (instanceId, queryKey, eventEmitter, eventTracer) => {
|
|
7
8
|
if (!isBrowser) return;
|
|
8
9
|
const visibilityHandler = () => {
|
|
9
10
|
if (document.visibilityState === "visible") {
|
|
11
|
+
eventTracer?.emit("Triggered on visibility", {
|
|
12
|
+
queryKey,
|
|
13
|
+
color: "success"
|
|
14
|
+
});
|
|
10
15
|
eventEmitter.emit("refetch", {
|
|
11
16
|
queryKey,
|
|
12
17
|
reason: "focus"
|
|
@@ -14,6 +19,10 @@ function refetchPlugin(config = {}) {
|
|
|
14
19
|
}
|
|
15
20
|
};
|
|
16
21
|
const focusHandler = () => {
|
|
22
|
+
eventTracer?.emit("Triggered on focus", {
|
|
23
|
+
queryKey,
|
|
24
|
+
color: "success"
|
|
25
|
+
});
|
|
17
26
|
eventEmitter.emit("refetch", {
|
|
18
27
|
queryKey,
|
|
19
28
|
reason: "focus"
|
|
@@ -21,100 +30,114 @@ function refetchPlugin(config = {}) {
|
|
|
21
30
|
};
|
|
22
31
|
document.addEventListener("visibilitychange", visibilityHandler);
|
|
23
32
|
window.addEventListener("focus", focusHandler);
|
|
24
|
-
|
|
33
|
+
eventTracer?.emit("Focus listener setup", {
|
|
34
|
+
queryKey,
|
|
35
|
+
color: "info"
|
|
36
|
+
});
|
|
37
|
+
const entry = listenersByHook.get(instanceId) ?? { queryKey };
|
|
25
38
|
entry.queryKey = queryKey;
|
|
26
39
|
entry.focusCleanup = () => {
|
|
27
40
|
document.removeEventListener("visibilitychange", visibilityHandler);
|
|
28
41
|
window.removeEventListener("focus", focusHandler);
|
|
29
42
|
};
|
|
30
|
-
listenersByHook.set(
|
|
43
|
+
listenersByHook.set(instanceId, entry);
|
|
31
44
|
};
|
|
32
|
-
const setupReconnectListener = (
|
|
45
|
+
const setupReconnectListener = (instanceId, queryKey, eventEmitter, eventTracer) => {
|
|
33
46
|
if (!isBrowser) return;
|
|
34
47
|
const handler = () => {
|
|
48
|
+
eventTracer?.emit("Triggered on reconnect", {
|
|
49
|
+
queryKey,
|
|
50
|
+
color: "success"
|
|
51
|
+
});
|
|
35
52
|
eventEmitter.emit("refetch", {
|
|
36
53
|
queryKey,
|
|
37
54
|
reason: "reconnect"
|
|
38
55
|
});
|
|
39
56
|
};
|
|
40
57
|
window.addEventListener("online", handler);
|
|
41
|
-
|
|
58
|
+
eventTracer?.emit("Reconnect listener setup", {
|
|
59
|
+
queryKey,
|
|
60
|
+
color: "info"
|
|
61
|
+
});
|
|
62
|
+
const entry = listenersByHook.get(instanceId) ?? { queryKey };
|
|
42
63
|
entry.queryKey = queryKey;
|
|
43
64
|
entry.reconnectCleanup = () => {
|
|
44
65
|
window.removeEventListener("online", handler);
|
|
45
66
|
};
|
|
46
|
-
listenersByHook.set(
|
|
67
|
+
listenersByHook.set(instanceId, entry);
|
|
47
68
|
};
|
|
48
|
-
const cleanupHook = (
|
|
49
|
-
const entry = listenersByHook.get(
|
|
69
|
+
const cleanupHook = (instanceId) => {
|
|
70
|
+
const entry = listenersByHook.get(instanceId);
|
|
50
71
|
if (entry) {
|
|
51
72
|
entry.focusCleanup?.();
|
|
52
73
|
entry.reconnectCleanup?.();
|
|
53
|
-
listenersByHook.delete(
|
|
74
|
+
listenersByHook.delete(instanceId);
|
|
54
75
|
}
|
|
55
76
|
};
|
|
56
|
-
const hasFocusListener = (
|
|
57
|
-
return listenersByHook.get(
|
|
77
|
+
const hasFocusListener = (instanceId) => {
|
|
78
|
+
return listenersByHook.get(instanceId)?.focusCleanup !== void 0;
|
|
58
79
|
};
|
|
59
|
-
const hasReconnectListener = (
|
|
60
|
-
return listenersByHook.get(
|
|
80
|
+
const hasReconnectListener = (instanceId) => {
|
|
81
|
+
return listenersByHook.get(instanceId)?.reconnectCleanup !== void 0;
|
|
61
82
|
};
|
|
62
|
-
const removeFocusListener = (
|
|
63
|
-
const entry = listenersByHook.get(
|
|
83
|
+
const removeFocusListener = (instanceId) => {
|
|
84
|
+
const entry = listenersByHook.get(instanceId);
|
|
64
85
|
if (entry?.focusCleanup) {
|
|
65
86
|
entry.focusCleanup();
|
|
66
87
|
entry.focusCleanup = void 0;
|
|
67
88
|
}
|
|
68
89
|
};
|
|
69
|
-
const removeReconnectListener = (
|
|
70
|
-
const entry = listenersByHook.get(
|
|
90
|
+
const removeReconnectListener = (instanceId) => {
|
|
91
|
+
const entry = listenersByHook.get(instanceId);
|
|
71
92
|
if (entry?.reconnectCleanup) {
|
|
72
93
|
entry.reconnectCleanup();
|
|
73
94
|
entry.reconnectCleanup = void 0;
|
|
74
95
|
}
|
|
75
96
|
};
|
|
76
97
|
return {
|
|
77
|
-
name:
|
|
98
|
+
name: PLUGIN_NAME,
|
|
78
99
|
operations: ["read", "infiniteRead"],
|
|
79
100
|
lifecycle: {
|
|
80
101
|
onMount(context) {
|
|
81
|
-
const { queryKey, eventEmitter,
|
|
82
|
-
|
|
102
|
+
const { queryKey, eventEmitter, instanceId } = context;
|
|
103
|
+
const et = context.eventTracer?.(PLUGIN_NAME);
|
|
104
|
+
if (!instanceId) return;
|
|
83
105
|
const pluginOptions = context.pluginOptions;
|
|
84
106
|
const shouldRefetchOnFocus = pluginOptions?.refetchOnFocus ?? refetchOnFocus;
|
|
85
107
|
const shouldRefetchOnReconnect = pluginOptions?.refetchOnReconnect ?? refetchOnReconnect;
|
|
86
108
|
if (shouldRefetchOnFocus) {
|
|
87
|
-
setupFocusListener(
|
|
109
|
+
setupFocusListener(instanceId, queryKey, eventEmitter, et);
|
|
88
110
|
}
|
|
89
111
|
if (shouldRefetchOnReconnect) {
|
|
90
|
-
setupReconnectListener(
|
|
112
|
+
setupReconnectListener(instanceId, queryKey, eventEmitter, et);
|
|
91
113
|
}
|
|
92
114
|
},
|
|
93
115
|
onUpdate(context) {
|
|
94
|
-
const { queryKey, eventEmitter,
|
|
95
|
-
|
|
116
|
+
const { queryKey, eventEmitter, instanceId } = context;
|
|
117
|
+
const et = context.eventTracer?.(PLUGIN_NAME);
|
|
118
|
+
if (!instanceId) return;
|
|
96
119
|
const pluginOptions = context.pluginOptions;
|
|
97
120
|
const shouldRefetchOnFocus = pluginOptions?.refetchOnFocus ?? refetchOnFocus;
|
|
98
121
|
const shouldRefetchOnReconnect = pluginOptions?.refetchOnReconnect ?? refetchOnReconnect;
|
|
99
|
-
const entry = listenersByHook.get(
|
|
122
|
+
const entry = listenersByHook.get(instanceId);
|
|
100
123
|
const queryKeyChanged = entry && entry.queryKey !== queryKey;
|
|
101
124
|
if (queryKeyChanged) {
|
|
102
|
-
cleanupHook(
|
|
125
|
+
cleanupHook(instanceId);
|
|
103
126
|
}
|
|
104
|
-
if (shouldRefetchOnFocus && !hasFocusListener(
|
|
105
|
-
setupFocusListener(
|
|
106
|
-
} else if (!shouldRefetchOnFocus && hasFocusListener(
|
|
107
|
-
removeFocusListener(
|
|
127
|
+
if (shouldRefetchOnFocus && !hasFocusListener(instanceId)) {
|
|
128
|
+
setupFocusListener(instanceId, queryKey, eventEmitter, et);
|
|
129
|
+
} else if (!shouldRefetchOnFocus && hasFocusListener(instanceId)) {
|
|
130
|
+
removeFocusListener(instanceId);
|
|
108
131
|
}
|
|
109
|
-
if (shouldRefetchOnReconnect && !hasReconnectListener(
|
|
110
|
-
setupReconnectListener(
|
|
111
|
-
} else if (!shouldRefetchOnReconnect && hasReconnectListener(
|
|
112
|
-
removeReconnectListener(
|
|
132
|
+
if (shouldRefetchOnReconnect && !hasReconnectListener(instanceId)) {
|
|
133
|
+
setupReconnectListener(instanceId, queryKey, eventEmitter, et);
|
|
134
|
+
} else if (!shouldRefetchOnReconnect && hasReconnectListener(instanceId)) {
|
|
135
|
+
removeReconnectListener(instanceId);
|
|
113
136
|
}
|
|
114
137
|
},
|
|
115
138
|
onUnmount(context) {
|
|
116
|
-
if (context.
|
|
117
|
-
cleanupHook(context.
|
|
139
|
+
if (context.instanceId) {
|
|
140
|
+
cleanupHook(context.instanceId);
|
|
118
141
|
}
|
|
119
142
|
}
|
|
120
143
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spoosh/plugin-refetch",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.2.0",
|
|
4
4
|
"description": "Auto-refetch plugin for Spoosh - refetch on focus and reconnect",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -34,11 +34,11 @@
|
|
|
34
34
|
}
|
|
35
35
|
},
|
|
36
36
|
"peerDependencies": {
|
|
37
|
-
"@spoosh/core": ">=0.
|
|
37
|
+
"@spoosh/core": ">=0.13.0"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
|
-
"@spoosh/core": "0.
|
|
41
|
-
"@spoosh/test-utils": "0.
|
|
40
|
+
"@spoosh/core": "0.13.0",
|
|
41
|
+
"@spoosh/test-utils": "0.2.0"
|
|
42
42
|
},
|
|
43
43
|
"scripts": {
|
|
44
44
|
"dev": "tsup --watch",
|