From e0b5e054b888dd5bcde1de291cd30a0e573bf060 Mon Sep 17 00:00:00 2001
From: Amen Souissi <amen.souissi@pricemoov.com>
Date: Sat, 22 Jan 2022 22:24:18 +0100
Subject: [PATCH] chore(Queries): add typing example

---
 .../broadcastQueryClient-experimental/index.ts         |  5 +++--
 storybook/stories/queries/Queries.svelte               | 10 +++++++++-
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/queryCore/broadcastQueryClient-experimental/index.ts b/src/queryCore/broadcastQueryClient-experimental/index.ts
index 6bc9029..8f5f9f1 100644
--- a/src/queryCore/broadcastQueryClient-experimental/index.ts
+++ b/src/queryCore/broadcastQueryClient-experimental/index.ts
@@ -1,4 +1,3 @@
-import { BroadcastChannel } from 'broadcast-channel'
 import { QueryClient } from '../core'
 
 interface BroadcastQueryClientOptions {
@@ -6,10 +5,12 @@ interface BroadcastQueryClientOptions {
   broadcastChannel?: string
 }
 
-export function broadcastQueryClient({
+export async function broadcastQueryClient({
   queryClient,
   broadcastChannel = 'svelte-query',
 }: BroadcastQueryClientOptions) {
+  const { BroadcastChannel } = await import('broadcast-channel')
+
   let transaction = false
   const tx = (cb: () => void) => {
     transaction = true
diff --git a/storybook/stories/queries/Queries.svelte b/storybook/stories/queries/Queries.svelte
index d9e6014..eee0f35 100644
--- a/storybook/stories/queries/Queries.svelte
+++ b/storybook/stories/queries/Queries.svelte
@@ -20,7 +20,15 @@
     { queryKey: 'myQuery3', queryFn: queryFn3 },
   ] as const
 
-  const queriesStore = useQueries(queries)
+  const queriesStore = useQueries<
+    [{ queryFnData: string }, { queryFnData: string }, { queryFnData: boolean }]
+  >(queries)
+  // TS Error
+  // const queriesStore = useQueries<
+  //   [{ queryFnData: string }, { queryFnData: string }, { queryFnData: string }]
+  // >(queries)
+  // can pass only TData (data prop) although TQueryFnData will be left unknown
+  // Please see QueriesOptions for more details
 </script>
 
 <main>