@tanstack/query-broadcast-client-experimental 5.75.0 → 5.75.2

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.
Files changed (14) hide show
  1. package/build/legacy/index.cjs +28 -5
  2. package/build/legacy/index.cjs.map +1 -1
  3. package/build/legacy/index.d.cts +1 -1
  4. package/build/legacy/index.d.ts +1 -1
  5. package/build/legacy/index.js +28 -5
  6. package/build/legacy/index.js.map +1 -1
  7. package/build/modern/index.cjs +28 -5
  8. package/build/modern/index.cjs.map +1 -1
  9. package/build/modern/index.d.cts +1 -1
  10. package/build/modern/index.d.ts +1 -1
  11. package/build/modern/index.js +28 -5
  12. package/build/modern/index.js.map +1 -1
  13. package/package.json +3 -1
  14. package/src/index.ts +31 -8
package/build/legacy/index.cjs CHANGED
@@ -40,12 +40,12 @@ function broadcastQueryClient({
40
40
  ...options
41
41
  });
42
42
  const queryCache = queryClient.getQueryCache();
43
- queryClient.getQueryCache().subscribe((queryEvent) => {
43
+ const unsubscribe = queryClient.getQueryCache().subscribe((queryEvent) => {
44
44
  if (transaction) {
45
45
  return;
46
46
  }
47
47
  const {
48
- query: { queryHash, queryKey, state }
48
+ query: { queryHash, queryKey, state, observers }
49
49
  } = queryEvent;
50
50
  if (queryEvent.type === "updated" && queryEvent.action.type === "success") {
51
51
  channel.postMessage({
@@ -55,13 +55,20 @@ function broadcastQueryClient({
55
55
  state
56
56
  });
57
57
  }
58
- if (queryEvent.type === "removed") {
58
+ if (queryEvent.type === "removed" && observers.length > 0) {
59
59
  channel.postMessage({
60
60
  type: "removed",
61
61
  queryHash,
62
62
  queryKey
63
63
  });
64
64
  }
65
+ if (queryEvent.type === "added") {
66
+ channel.postMessage({
67
+ type: "added",
68
+ queryHash,
69
+ queryKey
70
+ });
71
+ }
65
72
  });
66
73
  channel.onmessage = (action) => {
67
74
  if (!(action == null ? void 0 : action.type)) {
@@ -69,8 +76,8 @@ function broadcastQueryClient({
69
76
  }
70
77
  tx(() => {
71
78
  const { type, queryHash, queryKey, state } = action;
79
+ const query = queryCache.get(queryHash);
72
80
  if (type === "updated") {
73
- const query = queryCache.get(queryHash);
74
81
  if (query) {
75
82
  query.setState(state);
76
83
  return;
@@ -84,13 +91,29 @@ function broadcastQueryClient({
84
91
  state
85
92
  );
86
93
  } else if (type === "removed") {
87
- const query = queryCache.get(queryHash);
88
94
  if (query) {
89
95
  queryCache.remove(query);
90
96
  }
97
+ } else if (type === "added") {
98
+ if (query) {
99
+ query.setState(state);
100
+ return;
101
+ }
102
+ queryCache.build(
103
+ queryClient,
104
+ {
105
+ queryKey,
106
+ queryHash
107
+ },
108
+ state
109
+ );
91
110
  }
92
111
  });
93
112
  };
113
+ return () => {
114
+ unsubscribe();
115
+ channel.close();
116
+ };
94
117
  }
95
118
  // Annotate the CommonJS export names for ESM import in node:
96
119
  0 && (module.exports = {
package/build/legacy/index.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import { BroadcastChannel } from 'broadcast-channel'\nimport type { BroadcastChannelOptions } from 'broadcast-channel'\nimport type { QueryClient } from '@tanstack/query-core'\n\ninterface BroadcastQueryClientOptions {\n queryClient: QueryClient\n broadcastChannel?: string\n options?: BroadcastChannelOptions\n}\n\nexport function broadcastQueryClient({\n queryClient,\n broadcastChannel = 'tanstack-query',\n options,\n}: BroadcastQueryClientOptions) {\n let transaction = false\n const tx = (cb: () => void) => {\n transaction = true\n cb()\n transaction = false\n }\n\n const channel = new BroadcastChannel(broadcastChannel, {\n webWorkerSupport: false,\n ...options,\n })\n\n const queryCache = queryClient.getQueryCache()\n\n queryClient.getQueryCache().subscribe((queryEvent) => {\n if (transaction) {\n return\n }\n\n const {\n query: { queryHash, queryKey, state },\n } = queryEvent\n\n if (queryEvent.type === 'updated' && queryEvent.action.type === 'success') {\n channel.postMessage({\n type: 'updated',\n queryHash,\n queryKey,\n state,\n })\n }\n\n if (queryEvent.type === 'removed') {\n channel.postMessage({\n type: 'removed',\n queryHash,\n queryKey,\n })\n }\n })\n\n channel.onmessage = (action) => {\n if (!action?.type) {\n return\n }\n\n tx(() => {\n const { type, queryHash, queryKey, state } = action\n\n if (type === 'updated') {\n const query = queryCache.get(queryHash)\n\n if (query) {\n query.setState(state)\n return\n }\n\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n } else if (type === 'removed') {\n const query = queryCache.get(queryHash)\n\n if (query) {\n queryCache.remove(query)\n }\n }\n })\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,+BAAiC;AAU1B,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,GAAgC;AAC9B,MAAI,cAAc;AAClB,QAAM,KAAK,CAAC,OAAmB;AAC7B,kBAAc;AACd,OAAG;AACH,kBAAc;AAAA,EAChB;AAEA,QAAM,UAAU,IAAI,0CAAiB,kBAAkB;AAAA,IACrD,kBAAkB;AAAA,IAClB,GAAG;AAAA,EACL,CAAC;AAED,QAAM,aAAa,YAAY,cAAc;AAE7C,cAAY,cAAc,EAAE,UAAU,CAAC,eAAe;AACpD,QAAI,aAAa;AACf;AAAA,IACF;AAEA,UAAM;AAAA,MACJ,OAAO,EAAE,WAAW,UAAU,MAAM;AAAA,IACtC,IAAI;AAEJ,QAAI,WAAW,SAAS,aAAa,WAAW,OAAO,SAAS,WAAW;AACzE,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,WAAW;AACjC,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,UAAQ,YAAY,CAAC,WAAW;AAC9B,QAAI,EAAC,iCAAQ,OAAM;AACjB;AAAA,IACF;AAEA,OAAG,MAAM;AACP,YAAM,EAAE,MAAM,WAAW,UAAU,MAAM,IAAI;AAE7C,UAAI,SAAS,WAAW;AACtB,cAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AAEA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF,WAAW,SAAS,WAAW;AAC7B,cAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,YAAI,OAAO;AACT,qBAAW,OAAO,KAAK;AAAA,QACzB;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACF;","names":[]}
1
+ {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import { BroadcastChannel } from 'broadcast-channel'\nimport type { BroadcastChannelOptions } from 'broadcast-channel'\nimport type { QueryClient } from '@tanstack/query-core'\n\ninterface BroadcastQueryClientOptions {\n queryClient: QueryClient\n broadcastChannel?: string\n options?: BroadcastChannelOptions\n}\n\nexport function broadcastQueryClient({\n queryClient,\n broadcastChannel = 'tanstack-query',\n options,\n}: BroadcastQueryClientOptions): () => void {\n let transaction = false\n const tx = (cb: () => void) => {\n transaction = true\n cb()\n transaction = false\n }\n\n const channel = new BroadcastChannel(broadcastChannel, {\n webWorkerSupport: false,\n ...options,\n })\n\n const queryCache = queryClient.getQueryCache()\n\n const unsubscribe = queryClient.getQueryCache().subscribe((queryEvent) => {\n if (transaction) {\n return\n }\n\n const {\n query: { queryHash, queryKey, state, observers },\n } = queryEvent\n\n if (queryEvent.type === 'updated' && queryEvent.action.type === 'success') {\n channel.postMessage({\n type: 'updated',\n queryHash,\n queryKey,\n state,\n })\n }\n\n if (queryEvent.type === 'removed' && observers.length > 0) {\n channel.postMessage({\n type: 'removed',\n queryHash,\n queryKey,\n })\n }\n\n if (queryEvent.type === 'added') {\n channel.postMessage({\n type: 'added',\n queryHash,\n queryKey,\n })\n }\n })\n\n channel.onmessage = (action) => {\n if (!action?.type) {\n return\n }\n\n tx(() => {\n const { type, queryHash, queryKey, state } = action\n\n const query = queryCache.get(queryHash)\n\n if (type === 'updated') {\n if (query) {\n query.setState(state)\n return\n }\n\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n } else if (type === 'removed') {\n if (query) {\n queryCache.remove(query)\n }\n } else if (type === 'added') {\n if (query) {\n query.setState(state)\n return\n }\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n }\n })\n }\n return () => {\n unsubscribe()\n channel.close()\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,+BAAiC;AAU1B,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,GAA4C;AAC1C,MAAI,cAAc;AAClB,QAAM,KAAK,CAAC,OAAmB;AAC7B,kBAAc;AACd,OAAG;AACH,kBAAc;AAAA,EAChB;AAEA,QAAM,UAAU,IAAI,0CAAiB,kBAAkB;AAAA,IACrD,kBAAkB;AAAA,IAClB,GAAG;AAAA,EACL,CAAC;AAED,QAAM,aAAa,YAAY,cAAc;AAE7C,QAAM,cAAc,YAAY,cAAc,EAAE,UAAU,CAAC,eAAe;AACxE,QAAI,aAAa;AACf;AAAA,IACF;AAEA,UAAM;AAAA,MACJ,OAAO,EAAE,WAAW,UAAU,OAAO,UAAU;AAAA,IACjD,IAAI;AAEJ,QAAI,WAAW,SAAS,aAAa,WAAW,OAAO,SAAS,WAAW;AACzE,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,aAAa,UAAU,SAAS,GAAG;AACzD,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,SAAS;AAC/B,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,UAAQ,YAAY,CAAC,WAAW;AAC9B,QAAI,EAAC,iCAAQ,OAAM;AACjB;AAAA,IACF;AAEA,OAAG,MAAM;AACP,YAAM,EAAE,MAAM,WAAW,UAAU,MAAM,IAAI;AAE7C,YAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,UAAI,SAAS,WAAW;AACtB,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AAEA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF,WAAW,SAAS,WAAW;AAC7B,YAAI,OAAO;AACT,qBAAW,OAAO,KAAK;AAAA,QACzB;AAAA,MACF,WAAW,SAAS,SAAS;AAC3B,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AACA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACA,SAAO,MAAM;AACX,gBAAY;AACZ,YAAQ,MAAM;AAAA,EAChB;AACF;","names":[]}
package/build/legacy/index.d.cts CHANGED
@@ -6,6 +6,6 @@ interface BroadcastQueryClientOptions {
6
6
  broadcastChannel?: string;
7
7
  options?: BroadcastChannelOptions;
8
8
  }
9
- declare function broadcastQueryClient({ queryClient, broadcastChannel, options, }: BroadcastQueryClientOptions): void;
9
+ declare function broadcastQueryClient({ queryClient, broadcastChannel, options, }: BroadcastQueryClientOptions): () => void;
10
10
 
11
11
  export { broadcastQueryClient };
package/build/legacy/index.d.ts CHANGED
@@ -6,6 +6,6 @@ interface BroadcastQueryClientOptions {
6
6
  broadcastChannel?: string;
7
7
  options?: BroadcastChannelOptions;
8
8
  }
9
- declare function broadcastQueryClient({ queryClient, broadcastChannel, options, }: BroadcastQueryClientOptions): void;
9
+ declare function broadcastQueryClient({ queryClient, broadcastChannel, options, }: BroadcastQueryClientOptions): () => void;
10
10
 
11
11
  export { broadcastQueryClient };
package/build/legacy/index.js CHANGED
@@ -16,12 +16,12 @@ function broadcastQueryClient({
16
16
  ...options
17
17
  });
18
18
  const queryCache = queryClient.getQueryCache();
19
- queryClient.getQueryCache().subscribe((queryEvent) => {
19
+ const unsubscribe = queryClient.getQueryCache().subscribe((queryEvent) => {
20
20
  if (transaction) {
21
21
  return;
22
22
  }
23
23
  const {
24
- query: { queryHash, queryKey, state }
24
+ query: { queryHash, queryKey, state, observers }
25
25
  } = queryEvent;
26
26
  if (queryEvent.type === "updated" && queryEvent.action.type === "success") {
27
27
  channel.postMessage({
@@ -31,13 +31,20 @@ function broadcastQueryClient({
31
31
  state
32
32
  });
33
33
  }
34
- if (queryEvent.type === "removed") {
34
+ if (queryEvent.type === "removed" && observers.length > 0) {
35
35
  channel.postMessage({
36
36
  type: "removed",
37
37
  queryHash,
38
38
  queryKey
39
39
  });
40
40
  }
41
+ if (queryEvent.type === "added") {
42
+ channel.postMessage({
43
+ type: "added",
44
+ queryHash,
45
+ queryKey
46
+ });
47
+ }
41
48
  });
42
49
  channel.onmessage = (action) => {
43
50
  if (!(action == null ? void 0 : action.type)) {
@@ -45,8 +52,8 @@ function broadcastQueryClient({
45
52
  }
46
53
  tx(() => {
47
54
  const { type, queryHash, queryKey, state } = action;
55
+ const query = queryCache.get(queryHash);
48
56
  if (type === "updated") {
49
- const query = queryCache.get(queryHash);
50
57
  if (query) {
51
58
  query.setState(state);
52
59
  return;
@@ -60,13 +67,29 @@ function broadcastQueryClient({
60
67
  state
61
68
  );
62
69
  } else if (type === "removed") {
63
- const query = queryCache.get(queryHash);
64
70
  if (query) {
65
71
  queryCache.remove(query);
66
72
  }
73
+ } else if (type === "added") {
74
+ if (query) {
75
+ query.setState(state);
76
+ return;
77
+ }
78
+ queryCache.build(
79
+ queryClient,
80
+ {
81
+ queryKey,
82
+ queryHash
83
+ },
84
+ state
85
+ );
67
86
  }
68
87
  });
69
88
  };
89
+ return () => {
90
+ unsubscribe();
91
+ channel.close();
92
+ };
70
93
  }
71
94
  export {
72
95
  broadcastQueryClient
package/build/legacy/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import { BroadcastChannel } from 'broadcast-channel'\nimport type { BroadcastChannelOptions } from 'broadcast-channel'\nimport type { QueryClient } from '@tanstack/query-core'\n\ninterface BroadcastQueryClientOptions {\n queryClient: QueryClient\n broadcastChannel?: string\n options?: BroadcastChannelOptions\n}\n\nexport function broadcastQueryClient({\n queryClient,\n broadcastChannel = 'tanstack-query',\n options,\n}: BroadcastQueryClientOptions) {\n let transaction = false\n const tx = (cb: () => void) => {\n transaction = true\n cb()\n transaction = false\n }\n\n const channel = new BroadcastChannel(broadcastChannel, {\n webWorkerSupport: false,\n ...options,\n })\n\n const queryCache = queryClient.getQueryCache()\n\n queryClient.getQueryCache().subscribe((queryEvent) => {\n if (transaction) {\n return\n }\n\n const {\n query: { queryHash, queryKey, state },\n } = queryEvent\n\n if (queryEvent.type === 'updated' && queryEvent.action.type === 'success') {\n channel.postMessage({\n type: 'updated',\n queryHash,\n queryKey,\n state,\n })\n }\n\n if (queryEvent.type === 'removed') {\n channel.postMessage({\n type: 'removed',\n queryHash,\n queryKey,\n })\n }\n })\n\n channel.onmessage = (action) => {\n if (!action?.type) {\n return\n }\n\n tx(() => {\n const { type, queryHash, queryKey, state } = action\n\n if (type === 'updated') {\n const query = queryCache.get(queryHash)\n\n if (query) {\n query.setState(state)\n return\n }\n\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n } else if (type === 'removed') {\n const query = queryCache.get(queryHash)\n\n if (query) {\n queryCache.remove(query)\n }\n }\n })\n }\n}\n"],"mappings":";AAAA,SAAS,wBAAwB;AAU1B,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,GAAgC;AAC9B,MAAI,cAAc;AAClB,QAAM,KAAK,CAAC,OAAmB;AAC7B,kBAAc;AACd,OAAG;AACH,kBAAc;AAAA,EAChB;AAEA,QAAM,UAAU,IAAI,iBAAiB,kBAAkB;AAAA,IACrD,kBAAkB;AAAA,IAClB,GAAG;AAAA,EACL,CAAC;AAED,QAAM,aAAa,YAAY,cAAc;AAE7C,cAAY,cAAc,EAAE,UAAU,CAAC,eAAe;AACpD,QAAI,aAAa;AACf;AAAA,IACF;AAEA,UAAM;AAAA,MACJ,OAAO,EAAE,WAAW,UAAU,MAAM;AAAA,IACtC,IAAI;AAEJ,QAAI,WAAW,SAAS,aAAa,WAAW,OAAO,SAAS,WAAW;AACzE,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,WAAW;AACjC,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,UAAQ,YAAY,CAAC,WAAW;AAC9B,QAAI,EAAC,iCAAQ,OAAM;AACjB;AAAA,IACF;AAEA,OAAG,MAAM;AACP,YAAM,EAAE,MAAM,WAAW,UAAU,MAAM,IAAI;AAE7C,UAAI,SAAS,WAAW;AACtB,cAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AAEA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF,WAAW,SAAS,WAAW;AAC7B,cAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,YAAI,OAAO;AACT,qBAAW,OAAO,KAAK;AAAA,QACzB;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACF;","names":[]}
1
+ {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import { BroadcastChannel } from 'broadcast-channel'\nimport type { BroadcastChannelOptions } from 'broadcast-channel'\nimport type { QueryClient } from '@tanstack/query-core'\n\ninterface BroadcastQueryClientOptions {\n queryClient: QueryClient\n broadcastChannel?: string\n options?: BroadcastChannelOptions\n}\n\nexport function broadcastQueryClient({\n queryClient,\n broadcastChannel = 'tanstack-query',\n options,\n}: BroadcastQueryClientOptions): () => void {\n let transaction = false\n const tx = (cb: () => void) => {\n transaction = true\n cb()\n transaction = false\n }\n\n const channel = new BroadcastChannel(broadcastChannel, {\n webWorkerSupport: false,\n ...options,\n })\n\n const queryCache = queryClient.getQueryCache()\n\n const unsubscribe = queryClient.getQueryCache().subscribe((queryEvent) => {\n if (transaction) {\n return\n }\n\n const {\n query: { queryHash, queryKey, state, observers },\n } = queryEvent\n\n if (queryEvent.type === 'updated' && queryEvent.action.type === 'success') {\n channel.postMessage({\n type: 'updated',\n queryHash,\n queryKey,\n state,\n })\n }\n\n if (queryEvent.type === 'removed' && observers.length > 0) {\n channel.postMessage({\n type: 'removed',\n queryHash,\n queryKey,\n })\n }\n\n if (queryEvent.type === 'added') {\n channel.postMessage({\n type: 'added',\n queryHash,\n queryKey,\n })\n }\n })\n\n channel.onmessage = (action) => {\n if (!action?.type) {\n return\n }\n\n tx(() => {\n const { type, queryHash, queryKey, state } = action\n\n const query = queryCache.get(queryHash)\n\n if (type === 'updated') {\n if (query) {\n query.setState(state)\n return\n }\n\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n } else if (type === 'removed') {\n if (query) {\n queryCache.remove(query)\n }\n } else if (type === 'added') {\n if (query) {\n query.setState(state)\n return\n }\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n }\n })\n }\n return () => {\n unsubscribe()\n channel.close()\n }\n}\n"],"mappings":";AAAA,SAAS,wBAAwB;AAU1B,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,GAA4C;AAC1C,MAAI,cAAc;AAClB,QAAM,KAAK,CAAC,OAAmB;AAC7B,kBAAc;AACd,OAAG;AACH,kBAAc;AAAA,EAChB;AAEA,QAAM,UAAU,IAAI,iBAAiB,kBAAkB;AAAA,IACrD,kBAAkB;AAAA,IAClB,GAAG;AAAA,EACL,CAAC;AAED,QAAM,aAAa,YAAY,cAAc;AAE7C,QAAM,cAAc,YAAY,cAAc,EAAE,UAAU,CAAC,eAAe;AACxE,QAAI,aAAa;AACf;AAAA,IACF;AAEA,UAAM;AAAA,MACJ,OAAO,EAAE,WAAW,UAAU,OAAO,UAAU;AAAA,IACjD,IAAI;AAEJ,QAAI,WAAW,SAAS,aAAa,WAAW,OAAO,SAAS,WAAW;AACzE,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,aAAa,UAAU,SAAS,GAAG;AACzD,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,SAAS;AAC/B,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,UAAQ,YAAY,CAAC,WAAW;AAC9B,QAAI,EAAC,iCAAQ,OAAM;AACjB;AAAA,IACF;AAEA,OAAG,MAAM;AACP,YAAM,EAAE,MAAM,WAAW,UAAU,MAAM,IAAI;AAE7C,YAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,UAAI,SAAS,WAAW;AACtB,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AAEA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF,WAAW,SAAS,WAAW;AAC7B,YAAI,OAAO;AACT,qBAAW,OAAO,KAAK;AAAA,QACzB;AAAA,MACF,WAAW,SAAS,SAAS;AAC3B,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AACA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACA,SAAO,MAAM;AACX,gBAAY;AACZ,YAAQ,MAAM;AAAA,EAChB;AACF;","names":[]}
package/build/modern/index.cjs CHANGED
@@ -40,12 +40,12 @@ function broadcastQueryClient({
40
40
  ...options
41
41
  });
42
42
  const queryCache = queryClient.getQueryCache();
43
- queryClient.getQueryCache().subscribe((queryEvent) => {
43
+ const unsubscribe = queryClient.getQueryCache().subscribe((queryEvent) => {
44
44
  if (transaction) {
45
45
  return;
46
46
  }
47
47
  const {
48
- query: { queryHash, queryKey, state }
48
+ query: { queryHash, queryKey, state, observers }
49
49
  } = queryEvent;
50
50
  if (queryEvent.type === "updated" && queryEvent.action.type === "success") {
51
51
  channel.postMessage({
@@ -55,13 +55,20 @@ function broadcastQueryClient({
55
55
  state
56
56
  });
57
57
  }
58
- if (queryEvent.type === "removed") {
58
+ if (queryEvent.type === "removed" && observers.length > 0) {
59
59
  channel.postMessage({
60
60
  type: "removed",
61
61
  queryHash,
62
62
  queryKey
63
63
  });
64
64
  }
65
+ if (queryEvent.type === "added") {
66
+ channel.postMessage({
67
+ type: "added",
68
+ queryHash,
69
+ queryKey
70
+ });
71
+ }
65
72
  });
66
73
  channel.onmessage = (action) => {
67
74
  if (!action?.type) {
@@ -69,8 +76,8 @@ function broadcastQueryClient({
69
76
  }
70
77
  tx(() => {
71
78
  const { type, queryHash, queryKey, state } = action;
79
+ const query = queryCache.get(queryHash);
72
80
  if (type === "updated") {
73
- const query = queryCache.get(queryHash);
74
81
  if (query) {
75
82
  query.setState(state);
76
83
  return;
@@ -84,13 +91,29 @@ function broadcastQueryClient({
84
91
  state
85
92
  );
86
93
  } else if (type === "removed") {
87
- const query = queryCache.get(queryHash);
88
94
  if (query) {
89
95
  queryCache.remove(query);
90
96
  }
97
+ } else if (type === "added") {
98
+ if (query) {
99
+ query.setState(state);
100
+ return;
101
+ }
102
+ queryCache.build(
103
+ queryClient,
104
+ {
105
+ queryKey,
106
+ queryHash
107
+ },
108
+ state
109
+ );
91
110
  }
92
111
  });
93
112
  };
113
+ return () => {
114
+ unsubscribe();
115
+ channel.close();
116
+ };
94
117
  }
95
118
  // Annotate the CommonJS export names for ESM import in node:
96
119
  0 && (module.exports = {
package/build/modern/index.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import { BroadcastChannel } from 'broadcast-channel'\nimport type { BroadcastChannelOptions } from 'broadcast-channel'\nimport type { QueryClient } from '@tanstack/query-core'\n\ninterface BroadcastQueryClientOptions {\n queryClient: QueryClient\n broadcastChannel?: string\n options?: BroadcastChannelOptions\n}\n\nexport function broadcastQueryClient({\n queryClient,\n broadcastChannel = 'tanstack-query',\n options,\n}: BroadcastQueryClientOptions) {\n let transaction = false\n const tx = (cb: () => void) => {\n transaction = true\n cb()\n transaction = false\n }\n\n const channel = new BroadcastChannel(broadcastChannel, {\n webWorkerSupport: false,\n ...options,\n })\n\n const queryCache = queryClient.getQueryCache()\n\n queryClient.getQueryCache().subscribe((queryEvent) => {\n if (transaction) {\n return\n }\n\n const {\n query: { queryHash, queryKey, state },\n } = queryEvent\n\n if (queryEvent.type === 'updated' && queryEvent.action.type === 'success') {\n channel.postMessage({\n type: 'updated',\n queryHash,\n queryKey,\n state,\n })\n }\n\n if (queryEvent.type === 'removed') {\n channel.postMessage({\n type: 'removed',\n queryHash,\n queryKey,\n })\n }\n })\n\n channel.onmessage = (action) => {\n if (!action?.type) {\n return\n }\n\n tx(() => {\n const { type, queryHash, queryKey, state } = action\n\n if (type === 'updated') {\n const query = queryCache.get(queryHash)\n\n if (query) {\n query.setState(state)\n return\n }\n\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n } else if (type === 'removed') {\n const query = queryCache.get(queryHash)\n\n if (query) {\n queryCache.remove(query)\n }\n }\n })\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,+BAAiC;AAU1B,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,GAAgC;AAC9B,MAAI,cAAc;AAClB,QAAM,KAAK,CAAC,OAAmB;AAC7B,kBAAc;AACd,OAAG;AACH,kBAAc;AAAA,EAChB;AAEA,QAAM,UAAU,IAAI,0CAAiB,kBAAkB;AAAA,IACrD,kBAAkB;AAAA,IAClB,GAAG;AAAA,EACL,CAAC;AAED,QAAM,aAAa,YAAY,cAAc;AAE7C,cAAY,cAAc,EAAE,UAAU,CAAC,eAAe;AACpD,QAAI,aAAa;AACf;AAAA,IACF;AAEA,UAAM;AAAA,MACJ,OAAO,EAAE,WAAW,UAAU,MAAM;AAAA,IACtC,IAAI;AAEJ,QAAI,WAAW,SAAS,aAAa,WAAW,OAAO,SAAS,WAAW;AACzE,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,WAAW;AACjC,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,UAAQ,YAAY,CAAC,WAAW;AAC9B,QAAI,CAAC,QAAQ,MAAM;AACjB;AAAA,IACF;AAEA,OAAG,MAAM;AACP,YAAM,EAAE,MAAM,WAAW,UAAU,MAAM,IAAI;AAE7C,UAAI,SAAS,WAAW;AACtB,cAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AAEA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF,WAAW,SAAS,WAAW;AAC7B,cAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,YAAI,OAAO;AACT,qBAAW,OAAO,KAAK;AAAA,QACzB;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACF;","names":[]}
1
+ {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import { BroadcastChannel } from 'broadcast-channel'\nimport type { BroadcastChannelOptions } from 'broadcast-channel'\nimport type { QueryClient } from '@tanstack/query-core'\n\ninterface BroadcastQueryClientOptions {\n queryClient: QueryClient\n broadcastChannel?: string\n options?: BroadcastChannelOptions\n}\n\nexport function broadcastQueryClient({\n queryClient,\n broadcastChannel = 'tanstack-query',\n options,\n}: BroadcastQueryClientOptions): () => void {\n let transaction = false\n const tx = (cb: () => void) => {\n transaction = true\n cb()\n transaction = false\n }\n\n const channel = new BroadcastChannel(broadcastChannel, {\n webWorkerSupport: false,\n ...options,\n })\n\n const queryCache = queryClient.getQueryCache()\n\n const unsubscribe = queryClient.getQueryCache().subscribe((queryEvent) => {\n if (transaction) {\n return\n }\n\n const {\n query: { queryHash, queryKey, state, observers },\n } = queryEvent\n\n if (queryEvent.type === 'updated' && queryEvent.action.type === 'success') {\n channel.postMessage({\n type: 'updated',\n queryHash,\n queryKey,\n state,\n })\n }\n\n if (queryEvent.type === 'removed' && observers.length > 0) {\n channel.postMessage({\n type: 'removed',\n queryHash,\n queryKey,\n })\n }\n\n if (queryEvent.type === 'added') {\n channel.postMessage({\n type: 'added',\n queryHash,\n queryKey,\n })\n }\n })\n\n channel.onmessage = (action) => {\n if (!action?.type) {\n return\n }\n\n tx(() => {\n const { type, queryHash, queryKey, state } = action\n\n const query = queryCache.get(queryHash)\n\n if (type === 'updated') {\n if (query) {\n query.setState(state)\n return\n }\n\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n } else if (type === 'removed') {\n if (query) {\n queryCache.remove(query)\n }\n } else if (type === 'added') {\n if (query) {\n query.setState(state)\n return\n }\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n }\n })\n }\n return () => {\n unsubscribe()\n channel.close()\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,+BAAiC;AAU1B,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,GAA4C;AAC1C,MAAI,cAAc;AAClB,QAAM,KAAK,CAAC,OAAmB;AAC7B,kBAAc;AACd,OAAG;AACH,kBAAc;AAAA,EAChB;AAEA,QAAM,UAAU,IAAI,0CAAiB,kBAAkB;AAAA,IACrD,kBAAkB;AAAA,IAClB,GAAG;AAAA,EACL,CAAC;AAED,QAAM,aAAa,YAAY,cAAc;AAE7C,QAAM,cAAc,YAAY,cAAc,EAAE,UAAU,CAAC,eAAe;AACxE,QAAI,aAAa;AACf;AAAA,IACF;AAEA,UAAM;AAAA,MACJ,OAAO,EAAE,WAAW,UAAU,OAAO,UAAU;AAAA,IACjD,IAAI;AAEJ,QAAI,WAAW,SAAS,aAAa,WAAW,OAAO,SAAS,WAAW;AACzE,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,aAAa,UAAU,SAAS,GAAG;AACzD,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,SAAS;AAC/B,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,UAAQ,YAAY,CAAC,WAAW;AAC9B,QAAI,CAAC,QAAQ,MAAM;AACjB;AAAA,IACF;AAEA,OAAG,MAAM;AACP,YAAM,EAAE,MAAM,WAAW,UAAU,MAAM,IAAI;AAE7C,YAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,UAAI,SAAS,WAAW;AACtB,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AAEA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF,WAAW,SAAS,WAAW;AAC7B,YAAI,OAAO;AACT,qBAAW,OAAO,KAAK;AAAA,QACzB;AAAA,MACF,WAAW,SAAS,SAAS;AAC3B,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AACA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACA,SAAO,MAAM;AACX,gBAAY;AACZ,YAAQ,MAAM;AAAA,EAChB;AACF;","names":[]}
package/build/modern/index.d.cts CHANGED
@@ -6,6 +6,6 @@ interface BroadcastQueryClientOptions {
6
6
  broadcastChannel?: string;
7
7
  options?: BroadcastChannelOptions;
8
8
  }
9
- declare function broadcastQueryClient({ queryClient, broadcastChannel, options, }: BroadcastQueryClientOptions): void;
9
+ declare function broadcastQueryClient({ queryClient, broadcastChannel, options, }: BroadcastQueryClientOptions): () => void;
10
10
 
11
11
  export { broadcastQueryClient };
package/build/modern/index.d.ts CHANGED
@@ -6,6 +6,6 @@ interface BroadcastQueryClientOptions {
6
6
  broadcastChannel?: string;
7
7
  options?: BroadcastChannelOptions;
8
8
  }
9
- declare function broadcastQueryClient({ queryClient, broadcastChannel, options, }: BroadcastQueryClientOptions): void;
9
+ declare function broadcastQueryClient({ queryClient, broadcastChannel, options, }: BroadcastQueryClientOptions): () => void;
10
10
 
11
11
  export { broadcastQueryClient };
package/build/modern/index.js CHANGED
@@ -16,12 +16,12 @@ function broadcastQueryClient({
16
16
  ...options
17
17
  });
18
18
  const queryCache = queryClient.getQueryCache();
19
- queryClient.getQueryCache().subscribe((queryEvent) => {
19
+ const unsubscribe = queryClient.getQueryCache().subscribe((queryEvent) => {
20
20
  if (transaction) {
21
21
  return;
22
22
  }
23
23
  const {
24
- query: { queryHash, queryKey, state }
24
+ query: { queryHash, queryKey, state, observers }
25
25
  } = queryEvent;
26
26
  if (queryEvent.type === "updated" && queryEvent.action.type === "success") {
27
27
  channel.postMessage({
@@ -31,13 +31,20 @@ function broadcastQueryClient({
31
31
  state
32
32
  });
33
33
  }
34
- if (queryEvent.type === "removed") {
34
+ if (queryEvent.type === "removed" && observers.length > 0) {
35
35
  channel.postMessage({
36
36
  type: "removed",
37
37
  queryHash,
38
38
  queryKey
39
39
  });
40
40
  }
41
+ if (queryEvent.type === "added") {
42
+ channel.postMessage({
43
+ type: "added",
44
+ queryHash,
45
+ queryKey
46
+ });
47
+ }
41
48
  });
42
49
  channel.onmessage = (action) => {
43
50
  if (!action?.type) {
@@ -45,8 +52,8 @@ function broadcastQueryClient({
45
52
  }
46
53
  tx(() => {
47
54
  const { type, queryHash, queryKey, state } = action;
55
+ const query = queryCache.get(queryHash);
48
56
  if (type === "updated") {
49
- const query = queryCache.get(queryHash);
50
57
  if (query) {
51
58
  query.setState(state);
52
59
  return;
@@ -60,13 +67,29 @@ function broadcastQueryClient({
60
67
  state
61
68
  );
62
69
  } else if (type === "removed") {
63
- const query = queryCache.get(queryHash);
64
70
  if (query) {
65
71
  queryCache.remove(query);
66
72
  }
73
+ } else if (type === "added") {
74
+ if (query) {
75
+ query.setState(state);
76
+ return;
77
+ }
78
+ queryCache.build(
79
+ queryClient,
80
+ {
81
+ queryKey,
82
+ queryHash
83
+ },
84
+ state
85
+ );
67
86
  }
68
87
  });
69
88
  };
89
+ return () => {
90
+ unsubscribe();
91
+ channel.close();
92
+ };
70
93
  }
71
94
  export {
72
95
  broadcastQueryClient
package/build/modern/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import { BroadcastChannel } from 'broadcast-channel'\nimport type { BroadcastChannelOptions } from 'broadcast-channel'\nimport type { QueryClient } from '@tanstack/query-core'\n\ninterface BroadcastQueryClientOptions {\n queryClient: QueryClient\n broadcastChannel?: string\n options?: BroadcastChannelOptions\n}\n\nexport function broadcastQueryClient({\n queryClient,\n broadcastChannel = 'tanstack-query',\n options,\n}: BroadcastQueryClientOptions) {\n let transaction = false\n const tx = (cb: () => void) => {\n transaction = true\n cb()\n transaction = false\n }\n\n const channel = new BroadcastChannel(broadcastChannel, {\n webWorkerSupport: false,\n ...options,\n })\n\n const queryCache = queryClient.getQueryCache()\n\n queryClient.getQueryCache().subscribe((queryEvent) => {\n if (transaction) {\n return\n }\n\n const {\n query: { queryHash, queryKey, state },\n } = queryEvent\n\n if (queryEvent.type === 'updated' && queryEvent.action.type === 'success') {\n channel.postMessage({\n type: 'updated',\n queryHash,\n queryKey,\n state,\n })\n }\n\n if (queryEvent.type === 'removed') {\n channel.postMessage({\n type: 'removed',\n queryHash,\n queryKey,\n })\n }\n })\n\n channel.onmessage = (action) => {\n if (!action?.type) {\n return\n }\n\n tx(() => {\n const { type, queryHash, queryKey, state } = action\n\n if (type === 'updated') {\n const query = queryCache.get(queryHash)\n\n if (query) {\n query.setState(state)\n return\n }\n\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n } else if (type === 'removed') {\n const query = queryCache.get(queryHash)\n\n if (query) {\n queryCache.remove(query)\n }\n }\n })\n }\n}\n"],"mappings":";AAAA,SAAS,wBAAwB;AAU1B,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,GAAgC;AAC9B,MAAI,cAAc;AAClB,QAAM,KAAK,CAAC,OAAmB;AAC7B,kBAAc;AACd,OAAG;AACH,kBAAc;AAAA,EAChB;AAEA,QAAM,UAAU,IAAI,iBAAiB,kBAAkB;AAAA,IACrD,kBAAkB;AAAA,IAClB,GAAG;AAAA,EACL,CAAC;AAED,QAAM,aAAa,YAAY,cAAc;AAE7C,cAAY,cAAc,EAAE,UAAU,CAAC,eAAe;AACpD,QAAI,aAAa;AACf;AAAA,IACF;AAEA,UAAM;AAAA,MACJ,OAAO,EAAE,WAAW,UAAU,MAAM;AAAA,IACtC,IAAI;AAEJ,QAAI,WAAW,SAAS,aAAa,WAAW,OAAO,SAAS,WAAW;AACzE,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,WAAW;AACjC,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,UAAQ,YAAY,CAAC,WAAW;AAC9B,QAAI,CAAC,QAAQ,MAAM;AACjB;AAAA,IACF;AAEA,OAAG,MAAM;AACP,YAAM,EAAE,MAAM,WAAW,UAAU,MAAM,IAAI;AAE7C,UAAI,SAAS,WAAW;AACtB,cAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AAEA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF,WAAW,SAAS,WAAW;AAC7B,cAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,YAAI,OAAO;AACT,qBAAW,OAAO,KAAK;AAAA,QACzB;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACF;","names":[]}
1
+ {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import { BroadcastChannel } from 'broadcast-channel'\nimport type { BroadcastChannelOptions } from 'broadcast-channel'\nimport type { QueryClient } from '@tanstack/query-core'\n\ninterface BroadcastQueryClientOptions {\n queryClient: QueryClient\n broadcastChannel?: string\n options?: BroadcastChannelOptions\n}\n\nexport function broadcastQueryClient({\n queryClient,\n broadcastChannel = 'tanstack-query',\n options,\n}: BroadcastQueryClientOptions): () => void {\n let transaction = false\n const tx = (cb: () => void) => {\n transaction = true\n cb()\n transaction = false\n }\n\n const channel = new BroadcastChannel(broadcastChannel, {\n webWorkerSupport: false,\n ...options,\n })\n\n const queryCache = queryClient.getQueryCache()\n\n const unsubscribe = queryClient.getQueryCache().subscribe((queryEvent) => {\n if (transaction) {\n return\n }\n\n const {\n query: { queryHash, queryKey, state, observers },\n } = queryEvent\n\n if (queryEvent.type === 'updated' && queryEvent.action.type === 'success') {\n channel.postMessage({\n type: 'updated',\n queryHash,\n queryKey,\n state,\n })\n }\n\n if (queryEvent.type === 'removed' && observers.length > 0) {\n channel.postMessage({\n type: 'removed',\n queryHash,\n queryKey,\n })\n }\n\n if (queryEvent.type === 'added') {\n channel.postMessage({\n type: 'added',\n queryHash,\n queryKey,\n })\n }\n })\n\n channel.onmessage = (action) => {\n if (!action?.type) {\n return\n }\n\n tx(() => {\n const { type, queryHash, queryKey, state } = action\n\n const query = queryCache.get(queryHash)\n\n if (type === 'updated') {\n if (query) {\n query.setState(state)\n return\n }\n\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n } else if (type === 'removed') {\n if (query) {\n queryCache.remove(query)\n }\n } else if (type === 'added') {\n if (query) {\n query.setState(state)\n return\n }\n queryCache.build(\n queryClient,\n {\n queryKey,\n queryHash,\n },\n state,\n )\n }\n })\n }\n return () => {\n unsubscribe()\n channel.close()\n }\n}\n"],"mappings":";AAAA,SAAS,wBAAwB;AAU1B,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,GAA4C;AAC1C,MAAI,cAAc;AAClB,QAAM,KAAK,CAAC,OAAmB;AAC7B,kBAAc;AACd,OAAG;AACH,kBAAc;AAAA,EAChB;AAEA,QAAM,UAAU,IAAI,iBAAiB,kBAAkB;AAAA,IACrD,kBAAkB;AAAA,IAClB,GAAG;AAAA,EACL,CAAC;AAED,QAAM,aAAa,YAAY,cAAc;AAE7C,QAAM,cAAc,YAAY,cAAc,EAAE,UAAU,CAAC,eAAe;AACxE,QAAI,aAAa;AACf;AAAA,IACF;AAEA,UAAM;AAAA,MACJ,OAAO,EAAE,WAAW,UAAU,OAAO,UAAU;AAAA,IACjD,IAAI;AAEJ,QAAI,WAAW,SAAS,aAAa,WAAW,OAAO,SAAS,WAAW;AACzE,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,aAAa,UAAU,SAAS,GAAG;AACzD,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,WAAW,SAAS,SAAS;AAC/B,cAAQ,YAAY;AAAA,QAClB,MAAM;AAAA,QACN;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,UAAQ,YAAY,CAAC,WAAW;AAC9B,QAAI,CAAC,QAAQ,MAAM;AACjB;AAAA,IACF;AAEA,OAAG,MAAM;AACP,YAAM,EAAE,MAAM,WAAW,UAAU,MAAM,IAAI;AAE7C,YAAM,QAAQ,WAAW,IAAI,SAAS;AAEtC,UAAI,SAAS,WAAW;AACtB,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AAEA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF,WAAW,SAAS,WAAW;AAC7B,YAAI,OAAO;AACT,qBAAW,OAAO,KAAK;AAAA,QACzB;AAAA,MACF,WAAW,SAAS,SAAS;AAC3B,YAAI,OAAO;AACT,gBAAM,SAAS,KAAK;AACpB;AAAA,QACF;AACA,mBAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE;AAAA,YACA;AAAA,UACF;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACA,SAAO,MAAM;AACX,gBAAY;AACZ,YAAQ,MAAM;AAAA,EAChB;AACF;","names":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tanstack/query-broadcast-client-experimental",
3
- "version": "5.75.0",
3
+ "version": "5.75.2",
4
4
  "description": "An experimental plugin to for broadcasting the state of your queryClient between browser tabs/windows",
5
5
  "author": "tannerlinsley",
6
6
  "license": "MIT",
@@ -43,6 +43,8 @@
43
43
  "@tanstack/query-core": "5.75.0"
44
44
  },
45
45
  "devDependencies": {
46
+ "@testing-library/react": "^16.1.0",
47
+ "@vitejs/plugin-react": "^4.3.4",
46
48
  "npm-run-all2": "^5.0.0"
47
49
  },
48
50
  "scripts": {}
package/src/index.ts CHANGED
@@ -12,7 +12,7 @@ export function broadcastQueryClient({
12
12
  queryClient,
13
13
  broadcastChannel = 'tanstack-query',
14
14
  options,
15
- }: BroadcastQueryClientOptions) {
15
+ }: BroadcastQueryClientOptions): () => void {
16
16
  let transaction = false
17
17
  const tx = (cb: () => void) => {
18
18
  transaction = true
@@ -27,13 +27,13 @@ export function broadcastQueryClient({
27
27
 
28
28
  const queryCache = queryClient.getQueryCache()
29
29
 
30
- queryClient.getQueryCache().subscribe((queryEvent) => {
30
+ const unsubscribe = queryClient.getQueryCache().subscribe((queryEvent) => {
31
31
  if (transaction) {
32
32
  return
33
33
  }
34
34
 
35
35
  const {
36
- query: { queryHash, queryKey, state },
36
+ query: { queryHash, queryKey, state, observers },
37
37
  } = queryEvent
38
38
 
39
39
  if (queryEvent.type === 'updated' && queryEvent.action.type === 'success') {
@@ -45,13 +45,21 @@ export function broadcastQueryClient({
45
45
  })
46
46
  }
47
47
 
48
- if (queryEvent.type === 'removed') {
48
+ if (queryEvent.type === 'removed' && observers.length > 0) {
49
49
  channel.postMessage({
50
50
  type: 'removed',
51
51
  queryHash,
52
52
  queryKey,
53
53
  })
54
54
  }
55
+
56
+ if (queryEvent.type === 'added') {
57
+ channel.postMessage({
58
+ type: 'added',
59
+ queryHash,
60
+ queryKey,
61
+ })
62
+ }
55
63
  })
56
64
 
57
65
  channel.onmessage = (action) => {
@@ -62,9 +70,9 @@ export function broadcastQueryClient({
62
70
  tx(() => {
63
71
  const { type, queryHash, queryKey, state } = action
64
72
 
65
- if (type === 'updated') {
66
- const query = queryCache.get(queryHash)
73
+ const query = queryCache.get(queryHash)
67
74
 
75
+ if (type === 'updated') {
68
76
  if (query) {
69
77
  query.setState(state)
70
78
  return
@@ -79,12 +87,27 @@ export function broadcastQueryClient({
79
87
  state,
80
88
  )
81
89
  } else if (type === 'removed') {
82
- const query = queryCache.get(queryHash)
83
-
84
90
  if (query) {
85
91
  queryCache.remove(query)
86
92
  }
93
+ } else if (type === 'added') {
94
+ if (query) {
95
+ query.setState(state)
96
+ return
97
+ }
98
+ queryCache.build(
99
+ queryClient,
100
+ {
101
+ queryKey,
102
+ queryHash,
103
+ },
104
+ state,
105
+ )
87
106
  }
88
107
  })
89
108
  }
109
+ return () => {
110
+ unsubscribe()
111
+ channel.close()
112
+ }
90
113
  }