Reformat code with 4 spaces

Author: Floriferous

README.md

@@ -19,16 +19,16 @@ The first function needs to return a valid `Query` or `NamedQuery` from Grapher.
 ```js
 // This is a query
 const query = createQuery({
-  users: {
-    emails: 1
-  }
+    users: {
+        emails: 1,
+    },
 });
 
 // This is a named query
 const query = createQuery('usersWithEmails', {
-  users: {
-    emails: 1
-  }
+    users: {
+        emails: 1,
+    },
 });
 ```
 
@@ -100,25 +100,25 @@ import React from 'react';
 import { withQuery } from 'meteor/cultofcoders:grapher-react';
 
 const PostList = ({ data, isLoading, error }) => {
-  if (isLoading) {
-    return <div>Loading</div>;
-  }
-
-  if (error) {
-    return <div>{error.reason}</div>;
-  }
-
-  return (
-    <div>
-      {data.map(post => (
-        <li key={post._id}>{post.title}</li>
-      ))}
-    </div>
-  );
+    if (isLoading) {
+        return <div>Loading</div>;
+    }
+
+    if (error) {
+        return <div>{error.reason}</div>;
+    }
+
+    return (
+        <div>
+            {data.map(post => (
+                <li key={post._id}>{post.title}</li>
+            ))}
+        </div>
+    );
 };
 
 export default withQuery(props => {
-  return getPostLists.clone();
+    return getPostLists.clone();
 })(PostList);
 ```
 
@@ -168,29 +168,29 @@ The first example uses the query non-reactively (because that is the default). B
 ```jsx harmony
 // ...
 export default withQuery(
-  props => {
-    return getPostLists.clone();
-  },
-  { reactive: true }
+    props => {
+        return getPostLists.clone();
+    },
+    { reactive: true },
 )(PostList);
 ```
 
 As mentioned above, the props received are passed down to the component we wrap, meaning:
 
 ```jsx harmony
 const PostList = ({ data, something }) => {
-  return <div>Something is true!</div>;
+    return <div>Something is true!</div>;
 };
 
 const Container = withQuery(
-  props => {
-    return getPostLists.clone();
-  },
-  { reactive: true }
+    props => {
+        return getPostLists.clone();
+    },
+    { reactive: true },
 )(PostList);
 
 export default function() {
-  return <Container something={true} />;
+    return <Container something={true} />;
 }
 ```
 
@@ -204,63 +204,63 @@ import React from 'react';
 import { withQuery } from 'meteor/cultofcoders:grapher-react';
 
 const PostList = ({ data, isLoading, error, refetch }) => {
-  return (
-    <div>
-      <a onClick={refetch}>Reload the data</a>
-      {/* Rest of the component */}
-    </div>
-  );
+    return (
+        <div>
+            <a onClick={refetch}>Reload the data</a>
+            {/* Rest of the component */}
+        </div>
+    );
 };
 
 export default withQuery(
-  props => {
-    return getPostLists.clone();
-  },
-  { reactive: false }
+    props => {
+        return getPostLists.clone();
+    },
+    { reactive: false },
 )(PostList);
 ```
 
 If you container wraps a single object, and not a list of objects, you can configure your query like this:
 
 ```jsx harmony
 const UserProfile = ({ data, isLoading, error }) => {
-  return <div>{data.email}</div>;
+    return <div>{data.email}</div>;
 };
 
 export default withQuery(
-  props => {
-    return getUserProfile.clone({ userId: props.userId });
-  },
-  {
-    single: true
-  }
+    props => {
+        return getUserProfile.clone({ userId: props.userId });
+    },
+    {
+        single: true,
+    },
 )(UserProfile);
 ```
 
 You will find yourself repeating the same code over and over again for when the query is loading or it has an error. For this you can do:
 
 ```jsx harmony
 function ErrorComponent({ error }) {
-  return <div>{error.reason}</div>;
+    return <div>{error.reason}</div>;
 }
 
 function LoadingComponent() {
-  return <div>Please wait...</div>;
+    return <div>Please wait...</div>;
 }
 
 const UserProfile = ({ data }) => {
-  return <div>{data.email}</div>;
+    return <div>{data.email}</div>;
 };
 
 export default withQuery(
-  props => {
-    return getUserProfile.clone({ userId: props.userId });
-  },
-  {
-    single: true,
-    errorComponent: ErrorComponent,
-    loadingComponent: LoadingComponent
-  }
+    props => {
+        return getUserProfile.clone({ userId: props.userId });
+    },
+    {
+        single: true,
+        errorComponent: ErrorComponent,
+        loadingComponent: LoadingComponent,
+    },
 )(UserProfile);
 ```
 
@@ -272,23 +272,23 @@ To make things even more simple, you can globally define these rules, and all th
 import { setDefaults } from 'meteor/cultofcoders:grapher-react';
 
 setDefaults({
-  reactive: false, // you can default it to true
-  single: false, // doesn't make sense to default this to true
-  errorComponent: ErrorComponent,
-  loadingComponent: LoadingComponent
+    reactive: false, // you can default it to true
+    single: false, // doesn't make sense to default this to true
+    errorComponent: ErrorComponent,
+    loadingComponent: LoadingComponent,
 });
 ```
 
 You can override the defaults at the `withQuery` level, for example you want different `error` and `loading` components, you can simply do:
 
 ```jsx harmony
 export default withQuery(
-  props => {
-    return getUserProfile.clone({ userId: props.userId });
-  },
-  {
-    errorComponent: null,
-    loadingComponent: AnotherLoadingComponent
-  }
+    props => {
+        return getUserProfile.clone({ userId: props.userId });
+    },
+    {
+        errorComponent: null,
+        loadingComponent: AnotherLoadingComponent,
+    },
 )(UserProfile);
 ```

lib/withStaticQuery.js

@@ -2,7 +2,7 @@ import React from 'react';
 import getDisplayName from './getDisplayName';
 
 export default function withStaticQueryContainer(config) {
-    return function (WrappedComponent) {
+    return function(WrappedComponent) {
         /**
          * We use it like this so we can have naming inside React Dev Tools
          * This is a standard pattern in HOCs
@@ -26,7 +26,7 @@ export default function withStaticQueryContainer(config) {
                 if (config.pollingMs) {
                     this.pollingInterval = setInterval(() => {
                         this.fetch(query);
-                    }, config.pollingMs)
+                    }, config.pollingMs);
                 }
             }
 
@@ -41,7 +41,7 @@ export default function withStaticQueryContainer(config) {
                             error,
                             data: [],
                             isLoading: false,
-                        })
+                        });
                     } else {
                         this.setState({
                             error: null,
@@ -77,8 +77,10 @@ export default function withStaticQueryContainer(config) {
             }
         }
 
-        GrapherStaticQueryContainer.displayName = `StaticQuery(${getDisplayName(WrappedComponent)})`;
+        GrapherStaticQueryContainer.displayName = `StaticQuery(${getDisplayName(
+            WrappedComponent,
+        )})`;
 
         return GrapherStaticQueryContainer;
-    }
-}
+    };
+}

withQuery.js

@@ -9,20 +9,22 @@ import checkOptions from './lib/checkOptions';
 export default function(handler, _config = {}) {
     checkOptions(_config);
     const config = Object.assign({}, defaults, _config);
-    
+
     return function(component) {
         const queryContainer = withQueryContainer(component);
-        
+
         if (!config.reactive) {
-            const staticQueryContainer = withStaticQuery(config)(queryContainer);
-            
+            const staticQueryContainer = withStaticQuery(config)(
+                queryContainer,
+            );
+
             return function(props) {
                 const query = handler(props);
-                
+
                 return React.createElement(staticQueryContainer, {
                     query,
                     props,
-                    config
+                    config,
                 });
             };
         } else {