Open brightchip opened 3 years ago
This lib saves the client to the svelte context so you can have multiple wrapper components and each one can have a different client
Example
<script lang='ts'>
import { ApolloClient, InMemoryCache } from '@apollo/client/core';
import { setClient } from 'svelte-apollo';
const client = new ApolloClient({
cache: new InMemoryCache()
});
setClient(client);
</script>
<slot />
<ApolloProvider>
Components...
</ApolloProvider>
You can probably even pass the options to ApolloProvider to configure the client
@unlocomqx I don't think you have answered the question. Your example shows one client. I can read between the lines though when you say "you can have multiple wrapper components and each one can have a different client", you mean sibling components. So half your app's components that are children of one provider can use that client, while the other half that are children of the second provider can use that client. You apparently cannot use multiple clients in a single child component, precisely because the library chose to implement as a single key on context.
What I mean is, you cannot wrap your app as follows
<ApolloProvider1>
<ApolloProvider2>
<ChildComponent>
</ApolloProvider2>
</ApolloProvider1>
With the expectation that ChildComponent
could make queries with one client or the other.
You also couldn't use setClient
multiple times with multiple clients in a single <ApolloProvider>
component.
In order to "support multi client" the library would need to allow you to pass in the keyname for context so that you could have "client1" and "client2" both be consumable context simultaneously on a child component. Or pass an object with multiple keys, etc.
If you can come up with an example where one child component can make queries from more than one provider, please do share and prove me wrong!
How to pass more than 1 Apollo clients ? I haven't tried this package but went through the document and wondering how to pass multi clients