graphql-friendly/dist/client.js

An easy and friendly graphql client, alternative to apollo-client

import axios from 'axios';
import { print } from 'graphql/language/printer';
import { createClient } from 'graphql-ws';
export default class GraphqlClient {
    url;
    headers;
    subscriptionClient;
    constructor(url, headers) {
        if (!url) {
            throw new Error('[graphql-friendly] - options.url is required');
        }
        this.url = url;
        this.headers = headers ?? {};
        let wsUrl = url.replace(/http:\/\//, 'ws://').replace(/https:\/\//, 'wss://');
        this.subscriptionClient = createClient({
            url: wsUrl,
            connectionParams: {
                headers: {
                    ...this.headers,
                }
            }
        });
    }
    async query(args, { headers } = { headers: undefined }) {
        const currentHeaders = {
            ...this.headers,
            ...headers
        };
        if (Array.isArray(args)) {
            let finalQuery = '';
            for (let i = 0; i < args.length; i++) {
                if (!args[i].query) {
                    throw new Error(`Query at index ${i} is incorrect`);
                }
                if (i === 0) {
                    finalQuery += print(args[i].query).slice(0, -3);
                }
                else {
                    finalQuery += print(args[i].query).slice(1);
                }
            }
            return axios({
                url: this.url,
                method: 'POST',
                data: { query: finalQuery },
                headers: currentHeaders
            })
                .then(({ data }) => data);
        }
        const { query, variables } = args;
        let queryString = query;
        if (typeof query === 'object' && query.kind === 'Document') {
            queryString = print(query);
        }
        return axios({
            url: this.url,
            method: 'POST',
            data: { query: queryString, variables },
            headers: currentHeaders
        })
            .then(({ data }) => data);
    }
    mutation({ query, variables }, opts) {
        return this.query({ query, variables }, opts);
    }
    subscribe({ query, variables }) {
        let queryString = query;
        if (typeof query === 'object' && query.kind === 'Document') {
            queryString = print(query);
        }
        return this.subscriptionClient.iterate({ query: queryString, variables });
    }
}