fix: update typings (#447)

* add clients and defaultClient property to ApolloProvider

* remove client property from DollerApollo

* enable to specity client name to query

Author: joe-re

docs/api/dollar-apollo.md

@@ -7,7 +7,6 @@ This is the Apollo manager added to any component that uses Apollo. It can be ac
 - `vm`: related component
 - `queries`: array of the component's Smart Queries.
 - `subscriptions`: array of the component's Smart Subscriptions.
-- `client`: current Apollo client for the component.
 - `provider`: injected [Apollo Provider](./apollo-provider.md).
 - `loading`: whether at least one query is loading.
 - `skipAllQueries`: (setter) boolean to pause or unpause all Smart Queries.

types/apollo-provider.d.ts

@@ -1,11 +1,22 @@
 /* eslint no-unused-vars: 0 */
 
-import { ApolloClient, ApolloQueryResult } from 'apollo-client'
-import Vue, { PluginFunction, AsyncComponent } from 'vue'
+import Vue, { AsyncComponent } from 'vue'
 import { VueApolloComponentOption } from './options'
+import { ApolloClient } from 'apollo-client';
+import { WatchLoading, ErrorHandler, VueApolloOptions } from './options'
 
 export type VueApolloComponent<V extends Vue = Vue> = VueApolloComponentOption<V> | typeof Vue | AsyncComponent;
 
-export class ApolloProvider {
+export class ApolloProvider<TCacheShape=any> {
   provide: (key?: string) => this
+  constructor (options: {
+    defaultClient: ApolloClient<TCacheShape>,
+    defaultOptions?: VueApolloOptions<any>,
+    clients?: { [key: string]: ApolloClient<TCacheShape> },
+    watchLoading?: WatchLoading<any>,
+    errorHandler?: ErrorHandler<any>
+  })
+  clients: { [key: string]: ApolloClient<TCacheShape> }
+  defaultClient: ApolloClient<TCacheShape>
+  prefetchQueries: any
 }

types/options.d.ts

@@ -41,6 +41,7 @@ interface ExtendableVueApolloQueryOptions<V, R> extends _WatchQueryOptions {
 export interface VueApolloQueryOptions<V, R> extends ExtendableVueApolloQueryOptions<V, R> {
   query: ((this: ApolloVueThisType<V>) => DocumentNode) | DocumentNode;
   variables?: VariableFn<V>;
+  client?: String
 }
 
 export interface VueApolloMutationOptions<V, R> extends MutationOptions<R> {

types/test/App.ts

@@ -193,5 +193,8 @@ export default Vue.extend({
         console.log('this.$apollo.subscribe', data);
       },
     });
+
+    // enable to specify client when execute request
+    this.$apollo.query({ query: gql`query mockQuery { id }`, client: 'test' })
   }, 
 });

types/test/index.ts

@@ -25,7 +25,6 @@ const apolloProvider = new VueApollo({
 })
 
 Vue.use(VueApollo)
-
 /* eslint no-new: 0 */
 new Vue({
   el: '#app',
@@ -34,3 +33,7 @@ new Vue({
     h(Decorator)
   ])
 })
+
+// test to able to call below methods
+console.log(apolloProvider.defaultClient.query)
+console.log(apolloProvider.clients['key'].query)

types/vue-apollo.d.ts

@@ -15,13 +15,7 @@ import { GraphQLError } from 'graphql';
 export class VueApollo extends ApolloProvider implements PluginObject<{}>{
   [key: string]: any;
   install: PluginFunction<{}>;
-  constructor (options: {
-    defaultClient: ApolloClient<{}>,
-    defaultOptions?: VueApolloOptions<{}>,
-    clients?: { [key: string]: ApolloClient<{}> },
-    watchLoading?: WatchLoading<{}>,
-    errorHandler?: ErrorHandler<{}>
-  });
+
   static install(pVue: typeof Vue, options?:{} | undefined): void;
 }
 
@@ -55,7 +49,6 @@ export interface DollarApollo<V> {
   vm: V;
   queries: Record<string, SmartQuery<V>>;
   subscriptions: Record<string, SmartSubscription<V>>;
-  client: ApolloClient<{}>;
   readonly provider: ApolloProvider;
   readonly loading: boolean;