1) Refactored Apollo Client's @client directive support into general support for directives. Initially, this supports a single directive with no additional arguments per key in an object.

2) In tandem with this refactor, moved code into core jsonToGraphQLQuery file and tests file, away from the extensions/apollo directory structure.
3) Refactor of filterNonConfigFields(), which now utilizes external array configFields, which has also been exported for use by other modules (i.e. tests).

Author: joeflack4

src/__tests__/jsonToGraphQLQuery.tests.ts

@@ -1,6 +1,6 @@
 
 import { expect } from 'chai';
-import { jsonToGraphQLQuery } from '../';
+import { jsonToGraphQLQuery, filterNonConfigFields } from '../';
 
 describe('jsonToGraphQL()', () => {
 
@@ -146,6 +146,65 @@ describe('jsonToGraphQL()', () => {
 }`);
     });
 
+    it('Converts a JavaScript object into a valid Apollo query, including single directives with no arguments.', () => {
+        interface ILooseObject { [key: string]: any; }
+        let input: ILooseObject = {
+            __typename: 'everyday-health-focuses',
+            diet: {
+                __typename: 'diet',
+                id: 'diet',
+                options: {
+                    // tslint:disable-next-line:object-literal-key-quotes
+                    __typename: 'diet-options',
+                    'calorie-count': {
+                        __typename: 'calorie-count',
+                        category: 'Diet',
+                        icon: 'fa fa-question-circle',
+                        id: 'calorie-count',
+                        selected: false,
+                        text: 'Calorie Count'
+                    },
+                    // tslint:disable-next-line:object-literal-key-quotes
+                    mood: {
+                        __typename: 'mood',
+                        category: 'Diet',
+                        icon: 'fa fa-question-circle',
+                        id: 'mood',
+                        selected: false,
+                        text: 'Mood'
+                    },
+                    // tslint:disable-next-line:object-literal-key-quotes
+                    weight: {
+                        __typename: 'weight',
+                        category: 'Diet',
+                        icon: 'fa fa-question-circle',
+                        id: 'weight',
+                        selected: false,
+                        text: 'Weight'
+                    },
+                },
+                title: 'Diet'
+            },
+            someOtherAbritraryKey: {
+                __typename: 'someArbitraryObjType',
+                arb1: 'arbitrary value',
+                arb2: 'some other arbitrary value'
+            }
+        };
+        Object.keys(input)
+        .filter(filterNonConfigFields)
+        .forEach((key) => {
+            input[key]['__directives'] = { client: true, };
+        });
+        input = {query: input};
+        // Do I want to add some keysToStrip functionality separately?
+        // - const input = jsonToGraphqlQuery(preInput, { keysToStrip: ['__typename'] });
+        const expected = 'query { diet @client { id options { calorie-count { category ' +
+        'icon id text } mood { category icon id text } weight { category icon id text } } ' +
+        'title } someOtherAbritraryKey @client { arb1 arb2 } }';
+        expect(jsonToGraphQLQuery(input)).to.equal(expected);
+    });
+
     it('converts a query with nested objects', () => {
         const query = {
             query: {

src/extensions/apollo/__tests__/apollo.tests.ts

@@ -2,4 +2,3 @@
 export * from './jsonToGraphQLQuery';
 export {EnumType} from './types/EnumType';
 export {VariableType} from './types/VariableType';
-export * from './extensions/index';

src/extensions/apollo/index.ts

@@ -1,6 +1,8 @@
 import { EnumType } from './types/EnumType';
 import { VariableType } from './types/VariableType';
 
+export const configFields = ['__args', '__alias', '__variables', '__directives', '__typename'];
+
 function stringify(obj_from_json: any): string {
     if (obj_from_json instanceof EnumType) {
         return obj_from_json.value;
@@ -43,12 +45,26 @@ function buildVariables(varsObj: any): string {
     return args.join(', ');
 }
 
+function buildDirectives(dirsObj: any): string {
+    const numDirectives = Object.keys(dirsObj).length;
+    if (numDirectives > 1) {
+        throw new Error(numDirectives.toString());
+    }
+    // const args = [];
+    // for (const varName in dirsObj) {
+    //     args.push(`@${varName}: ${dirsObj[varName]}`);
+    // }
+    // return args.join(', ');
+    return '@' + Object.keys(dirsObj)[0];
+}
+
 function getIndent(level: number): string {
     return Array((level * 4) + 1).join(' ');
 }
 
-function filterNonConfigFields(fieldName: string) {
-    return fieldName !== '__args' && fieldName !== '__alias' && fieldName !== '__variables';
+export function filterNonConfigFields(fieldName: string) {
+    // Returns true if fieldName is not a 'configField'.
+    return configFields.indexOf(fieldName) === -1;  // Equivalent to: return !configFields.includes(fieldName);
 }
 
 function convertQuery(node: any, level: number, output: Array<[ string, number ]>) {
@@ -66,6 +82,17 @@ function convertQuery(node: any, level: number, output: Array<[ string, number ]
             else if (typeof node[key].__variables === 'object') {
                 token = `${key} (${buildVariables(node[key].__variables)})`;
             }
+            else if (typeof node[key].__directives === 'object') {
+                // TODO: Add support for multiple directives on one node, if that's a thing.
+                try {
+                    token = `${key} ${buildDirectives(node[key].__directives)}`;
+                } catch (e) {
+                    e = e.toString().replace(/Error: /, '');
+                    throw new Error(`Too many directives. The object/key ` +
+                    `'${Object.keys(node[key])[0]}' had ${e} directives, ` +
+                    `but only 1 directive per object/key is supported at this time.`);
+                }
+            }
             else {
                 token = `${key}`;
             }