Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to have multi clients ? #90

Open
brightchip opened this issue Apr 25, 2021 · 2 comments
Open

How to have multi clients ? #90

brightchip opened this issue Apr 25, 2021 · 2 comments

Comments

@brightchip
Copy link

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

@unlocomqx
Copy link

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

@t-lock
Copy link

t-lock commented Nov 17, 2022

@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!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants