Correct object handling in altair-static render function

altair-graphql · Sep 3, 2020 · 3d87caf · 3d87caf
1 parent 6a07424
commit 3d87caf
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 8 deletions.
diff --git a/packages/altair-static/src/__snapshots__/index.test.ts.snap b/packages/altair-static/src/__snapshots__/index.test.ts.snap
@@ -50,6 +50,7 @@ exports[`renderAltair should return expected string 1`] = `
             
             
             
+            
         };
         AltairGraphQL.init(altairOpts);
     </script></body>
@@ -68,9 +69,10 @@ exports[`renderInitialOptions should return expected string 1`] = `
       }\`,
             
             
+            initialHeaders: {\\"X-GraphQL-Token\\":\\"asd7-237s-2bdk-nsdk4\\"},
             
             
-            
+            initialSettings: {\\"theme\\":\\"dark\\"},
         };
         AltairGraphQL.init(altairOpts);
     "

diff --git a/packages/altair-static/src/index.test.ts b/packages/altair-static/src/index.test.ts
@@ -10,7 +10,13 @@ describe('renderInitialOptions', () => {
       initialQuery: `query {
         Hello
       }`,
-      endpointURL: 'https://example.com/graphql'
+      endpointURL: 'https://example.com/graphql',
+      initialHeaders: {
+        'X-GraphQL-Token': 'asd7-237s-2bdk-nsdk4'
+      },
+      initialSettings: {
+        theme: 'dark'
+      }
     });
     expect(result).toMatchSnapshot();
   });

diff --git a/packages/altair-static/src/index.ts b/packages/altair-static/src/index.ts
@@ -49,7 +49,7 @@ export interface RenderOptions {
      *  'X-GraphQL-Token': 'asd7-237s-2bdk-nsdk4'
      * }
      */
-    initialHeaders?: Object;
+    initialHeaders?: {[key: string]: string};
 
     /**
      * Whether to render the initial options in a seperate javascript file or not.
@@ -86,8 +86,12 @@ export interface RenderOptions {
 
     /**
      * Initial app settings to use
+     * @example
+     * {
+     *   theme: 'dark'
+     * }
      */
-    initialSettings?: any;
+    initialSettings?: {[key: string]: any};
 }
 
 /**
@@ -102,7 +106,8 @@ export const renderInitialOptions = ({
     initialHeaders,
     initialPreRequestScript,
     initialEnvironments,
-    instanceStorageNamespace
+    instanceStorageNamespace,
+    initialSettings
 }: RenderOptions = {}) => {
     return `
         const altairOpts = {
@@ -114,6 +119,7 @@ export const renderInitialOptions = ({
             ${getObjectPropertyForOption(initialHeaders, 'initialHeaders')}
             ${getObjectPropertyForOption(initialEnvironments, 'initialEnvironments')}
             ${getObjectPropertyForOption(instanceStorageNamespace, 'instanceStorageNamespace')}
+            ${getObjectPropertyForOption(initialSettings, 'initialSettings')}
         };
         AltairGraphQL.init(altairOpts);
     `;
@@ -140,12 +146,11 @@ export const renderAltair = (options: RenderOptions = {}) => {
 
 function getObjectPropertyForOption(option: any, propertyName: string) {
     if (option) {
-        let optionString = option;
         switch (typeof option) {
             case 'object':
-                optionString = JSON.stringify(option);
+              return `${propertyName}: ${JSON.stringify(option)},`;
         }
-        return `${propertyName}: \`${optionString}\`,`;
+        return `${propertyName}: \`${option}\`,`;
     }
     return '';
 }