kamilkisiela / loona

🌕 Application State Management done with GraphQL
https://loonajs.com
MIT License
265 stars 13 forks source link

how to support subscriptions and sync with server #211

Open agborkowski opened 6 years ago

agborkowski commented 6 years ago

good to have small eg. of usage mixin @client/server types and subscriptions

agborkowski commented 6 years ago

ok i found something about mutations

https://loonajs.com/docs/angular/essentials/updates#updates-of-remote-mutations

there is need configuration http link:

export function apolloFactory(
  loonaLink: LoonaLink,
  cache: ApolloCache<any>,
  httpLink: HttpLink
): ApolloClientOptions<any> {
  return {
    link: ApolloLink.from([loonaLink, httpLink.create({ uri: 'http://localhost:3000/graphql' })]),
    cache,
  };
}

subscriptions w8 for r&d

updates:

import { NgModule } from '@angular/core';
import { ApolloModule, APOLLO_OPTIONS } from 'apollo-angular';
import { HttpLinkModule, HttpLink } from 'apollo-angular-link-http';
import { InMemoryCache } from 'apollo-cache-inmemory';

import {
  LoonaModule,
  LoonaLink,
  LOONA_CACHE,
} from '@loona/angular';

import { ApolloCache } from 'apollo-cache';
import { ApolloLink, split } from 'apollo-link';

import { WebSocketLink } from 'apollo-link-ws';
import { getMainDefinition } from 'apollo-utilities';

import { environment } from '../environments/environment';

const uri = environment.httpLink; // <-- add the URL of the GraphQL server here
export function createApollo(
  httpLink: HttpLink,
  loonaLink: LoonaLink,
  cache: ApolloCache<any>
) {
  return {
    link: split(
      ({ query }) => {
        const { kind, operation } = getMainDefinition(query);
        return kind === 'OperationDefinition' && operation === 'subscription';
      },
      new WebSocketLink({
        uri: environment.wsLink,
        options: {
          reconnect: true
        }
      }),
      ApolloLink.from([loonaLink, httpLink.create({ uri })]),
    ),
    cache,
  };
}

@NgModule({
  imports: [
    LoonaModule.forRoot()
  ],
  exports: [ApolloModule, HttpLinkModule],
  providers: [
    {
      provide: APOLLO_OPTIONS,
      useFactory: createApollo,
      deps: [HttpLink, LoonaLink, LOONA_CACHE],
    },
    {
      provide: LOONA_CACHE,
      useFactory() {
        return new InMemoryCache();
      },
    },
  ],
})
export class GraphQLModule { }

works well but wont compile in prod mode (-aot)

lterfloth commented 5 years ago

any comments on this? I'm struggling with the same problems.