How to use the subscriptions-transport-ws.Client function in subscriptions-transport-ws

ngOnInit() {
    const queryObservable = this.apollo.watchQuery({
      query: AllPostsQuery
    })
    this.allPostsSub = queryObservable.subscribe(({data, loading}) => {
      this.allPosts = data.allPosts.reverse();
      this.loading = loading;
    });

    // __SUBSCRIPTIONS_API_ENDPOINT_ looks similar to: `wss://subscriptions.graph.cool/v1/`
    const wsClient = new Client('__SUBSCRIPTIONS_API_ENDPOINT_', {
      timeout: 10000,
      reconnect: true
    })

    wsClient.subscribe({
      query: `subscription {
        Post(filter: {
          mutation_in: [CREATED, UPDATED, DELETED]
        }) {
          node {
            id
            imageUrl
            description
          }
        }
      }`,

/* eslint-disable react/jsx-filename-extension */

import ApolloClient, { createNetworkInterface } from 'apollo-client';
import { Client } from 'subscriptions-transport-ws';
import addGraphQLSubscriptions from '../subscriptions';

const wsClient = new Client('ws://localhost:3010', {
  reconnect: true,
});

const networkInterface = createNetworkInterface({ uri: '/graphql' });

const networkInterfaceWithSubscriptions = addGraphQLSubscriptions(
  networkInterface,
  wsClient
);

export default new ApolloClient({
  networkInterface: networkInterfaceWithSubscriptions,
});

return wsClient.subscribe({
      query: print(request.query),
      variables: request.variables,
    }, handler);
  },
  unsubscribe: (id) => {
    wsClient.unsubscribe(id);
  },
});
const networkInterface = createNetworkInterface({
  uri: 'http://localhost:4000/graphql',
  opts: {
    credentials: 'same-origin',
  },
});
const wsClient = new Client('ws://localhost:4000');
const networkInterfaceWithSubscriptions = addGraphQLSubscriptions(
  networkInterface,
  wsClient
);
const client = new ApolloClient({
  networkInterface: networkInterfaceWithSubscriptions
});

const store = configureStore(initialState, client);
const history = syncHistoryWithStore(browserHistory, store)

ReactDOM.render(

},
  transportBatching: true,
});

networkInterface.use([{
  applyMiddleware(req, next) {
    if (!req.options.headers) {
      req.options.headers = {};
    }
    req.options.headers.authorization = localStorage.getItem(config.authTokenName);
    next();
  }
}]);

const host = location.origin.replace(/^http/, 'ws');
const wsClient = new Client(host);
const networkInterfaceWithSubscriptions = addGraphQLSubscriptions(networkInterface, wsClient);

const client = new ApolloClient({
  networkInterface: networkInterfaceWithSubscriptions,
  dataIdFromObject: (result) => {
    if (result.id && result.__typename) {
      return result.__typename + result.id;
    }
    return null;
  },
  shouldBatch: true,
  initialState: window.__APOLLO_STATE__,
  ssrForceFetchDelay: 100,
});

const initialState = window.__INITIAL_STATE__;

constructor(props) {
    super(props);

    const wsClient = new Client(location.origin.replace(/^http/, 'ws'));

    this.client = new ApolloClient({
      networkInterface: addGraphQLSubscriptions(
        createNetworkInterface('/graphql'),
        wsClient,
      ),
      dataIdFromObject: r => r.id,
    });
  }

import ApolloClient, { createNetworkInterface } from 'apollo-client'
import { getLoginToken } from 'meteor-apollo-accounts'
import { Client } from 'subscriptions-transport-ws';
import { addGraphQLSubscriptions } from './index';

const wsClient = new Client('ws://localhost:8080');

const networkInterface = createNetworkInterface({ uri: '/graphql' })
networkInterface.use([{
  applyMiddleware(req, next) {
    if (!req.options.headers) {
      req.options.headers = {}
    }
    req.options.headers.authorization = getLoginToken() || null
    next()
  }
}]);

const networkInterfaceWithSubscriptions = addGraphQLSubscriptions(
  networkInterface,
  wsClient,
);

import gql from 'graphql-tag';
import { ApolloProvider } from 'react-apollo';
import {Socket} from 'phoenix';
import { Client } from 'subscriptions-transport-ws';
import addGraphQLSubscriptions from './subscription';


//Set a clientId for the client
let clientId = localStorage.getItem('thorium_clientId');
if (!clientId) {
  clientId = guid();
  //Just to test out the webpack
  localStorage.setItem('thorium_clientId',clientId);
}

const wsClient = new Client('ws://localhost:4000/socket/websocket?vsn=1.0.0&otherClient=true&client_id=' + clientId);

const networkInterface = createNetworkInterface({
  uri: '/graphql',
  opts: {
    credentials: 'same-origin',
  }
});

const networkInterfaceWithSubscriptions = addGraphQLSubscriptions(
  networkInterface,
  wsClient,
  );

const client = new ApolloClient({
  networkInterface: networkInterfaceWithSubscriptions,
  queryTransformer: addTypenameToSelectionSet,