Format code with prettier

app/__tests__/app-spec.js

@@ -1,22 +1,31 @@
-const path = require('path')
-const assert = require('yeoman-assert')
-const helpers = require('yeoman-test')
+const path = require("path");
+const assert = require("yeoman-assert");
+const helpers = require("yeoman-test");
 
-describe('react-zeal', () => {
+describe("react-zeal", () => {
   beforeEach(() => {
-    return helpers.run(path.join(__dirname, '../../app'))
-      .withPrompts({ name: 'apples' })
-  })
+    return helpers
+      .run(path.join(__dirname, "../../app"))
+      .withPrompts({ name: "apples" });
+  });
 
-  test('creates root level files', () => {
-    assert.file(['.gitignore', 'package.json'])
-  })
+  test("creates root level files", () => {
+    assert.file([".gitignore", "package.json"]);
+  });
 
   test('generated package.json has "apples" as the package name', () => {
-    assert.jsonFileContent('package.json', { "name": "apples" })
-  })
+    assert.jsonFileContent("package.json", { name: "apples" });
+  });
 
-  test('copies .eslintrc.js file', () => {
-    assert.fileContent('.eslintrc.js', 'path.resolve')
-  })
-})
+  test("generated package.json does not have lint-staged gitDir option", () => {
+    assert.noJsonFileContent("package.json", {
+      "lint-staged": {
+        gitDir: "../.."
+      }
+    });
+  });
+
+  test("copies .eslintrc.js file", () => {
+    assert.fileContent(".eslintrc.js", "path.resolve");
+  });
+});

app/index.js

@@ -1,74 +1,79 @@
-const Generator = require('yeoman-generator')
-const commandExists = require('command-exists')
-const humps = require('humps')
+const Generator = require("yeoman-generator");
+const commandExists = require("command-exists");
+const humps = require("humps");
 
 module.exports = class ReactZeal extends Generator {
   prompting() {
     return this.prompt([
       {
-        type: 'input',
-        name: 'name',
-        message: 'Your project name',
+        type: "input",
+        name: "name",
+        message: "Your project name",
         default: kabob(this.appname)
       }
-    ]).then(function(answers) {
-      this.appName = kabob(answers.name)
-    }.bind(this))
+    ]).then(
+      function(answers) {
+        this.appName = kabob(answers.name);
+      }.bind(this)
+    );
   }
 
   writing() {
-    this.fs.copyTpl(
-      this.templatePath('package.json'),
-      this.destinationPath('package.json'),
-      { appName: this.appName }
-    )
+    this._installPackageJson();
 
-    this.fs.copy(
-      this.templatePath('client'),
-      this.destinationPath('client'),
-      { globOptions: { dot: true } }
-    )
+    this.fs.copy(this.templatePath("client"), this.destinationPath("client"), {
+      globOptions: { dot: true }
+    });
 
     this.fs.copy(
-      this.templatePath('.eslintrc.js'),
-      this.destinationPath('.eslintrc.js')
-    )
+      this.templatePath(".eslintrc.js"),
+      this.destinationPath(".eslintrc.js")
+    );
 
     this.fs.copy(
-      this.templatePath('.sass-lint.yml'),
-      this.destinationPath('.sass-lint.yml')
-    )
+      this.templatePath(".sass-lint.yml"),
+      this.destinationPath(".sass-lint.yml")
+    );
 
     this.fs.copy(
-      this.templatePath('yarn.lock'),
-      this.destinationPath('yarn.lock')
-    )
+      this.templatePath("yarn.lock"),
+      this.destinationPath("yarn.lock")
+    );
 
-    this._mergeGitIgnore()
+    this._mergeGitIgnore();
   }
 
   install() {
-    const isYarnAvailable = commandExists.sync('yarnpkg')
+    const isYarnAvailable = commandExists.sync("yarnpkg");
     this.installDependencies({
       yarn: isYarnAvailable,
       npm: !isYarnAvailable,
       bower: false
-    })
+    });
+  }
+
+  _installPackageJson() {
+    const json = this.fs.readJSON(this.templatePath("package.json"));
+
+    json.name = this.appName;
+    delete json["lint-staged"].gitDir;
+
+    this.fs.writeJSON(this.destinationPath("package.json"), json);
   }
 
   _mergeGitIgnore() {
-    const template = this.fs.read(this.templatePath('gitignore'))
-    const existing = this.fs.read(this.destinationPath('.gitignore'), {
-      defaults: ''
-    })
+    const template = this.fs.read(this.templatePath("gitignore"));
+    const existing = this.fs.read(this.destinationPath(".gitignore"), {
+      defaults: ""
+    });
 
     this.fs.write(
-      this.destinationPath('.gitignore'),
-      existing + '\n\n' + template
-    )
+      this.destinationPath(".gitignore"),
+      existing + "\n\n" + template
+    );
   }
-}
+};
 
 function kabob(string) {
-  return humps.decamelize(humps.camelize(string), { separator: '-' })
+  return humps.decamelize(humps.camelize(string), { separator: "-" });
 }

app/templates/.eslintrc.js

@@ -1,20 +1,17 @@
-const path = require('path')
+const path = require("path");
 
 module.exports = {
-  extends: [
-    'zeal',
-    'zeal/react'
-  ],
+  extends: ["zeal", "zeal/react", "prettier", "prettier/react"],
   root: true,
   settings: {
-    'import/resolver': {
+    "import/resolver": {
       webpack: {
         config: {
           resolve: {
-            root: path.resolve(__dirname, 'client')
+            root: path.resolve(__dirname, "client")
           }
         }
       }
     }
   }
-}
+};

app/templates/client/base/apolloClient.js

@@ -1,10 +1,10 @@
-import { ApolloClient } from 'react-apollo'
+import { ApolloClient } from "react-apollo";
 
 export default new ApolloClient({
   dataIdFromObject: result => {
     if (result.id && result.__typename) {
-      return result.__typename + result.id
+      return result.__typename + result.id;
     }
-    return null
+    return null;
   }
-})
+});

app/templates/client/base/configureStore.js

@@ -1,22 +1,23 @@
-import { applyMiddleware, createStore } from 'redux'
-import { composeWithDevTools } from 'redux-devtools-extension/developmentOnly'
+import { applyMiddleware, createStore } from "redux";
+import { composeWithDevTools } from "redux-devtools-extension/developmentOnly";
 
-import apolloClient from './apolloClient'
-import reducer from './reducer'
+import apolloClient from "./apolloClient";
+import reducer from "./reducer";
 
 export default function configureStore() {
-  const store = createStore(reducer, composeWithDevTools(
-    applyMiddleware(apolloClient.middleware())
-  ))
+  const store = createStore(
+    reducer,
+    composeWithDevTools(applyMiddleware(apolloClient.middleware()))
+  );
 
   if (module.hot) {
-    module.hot.accept('./reducer', () => {
+    module.hot.accept("./reducer", () => {
       // eslint-disable-next-line global-require
-      const nextReducer = require('./reducer').default
+      const nextReducer = require("./reducer").default;
 
-      store.replaceReducer(nextReducer)
-    })
+      store.replaceReducer(nextReducer);
+    });
   }
 
-  return store
+  return store;
 }

app/templates/client/base/index.js

@@ -1,2 +1,2 @@
-export apolloClient from './apolloClient'
-export configureStore from './configureStore'
+export apolloClient from "./apolloClient";
+export configureStore from "./configureStore";

app/templates/client/base/reducer.js

@@ -1,9 +1,9 @@
-import { combineReducers } from 'redux'
+import { combineReducers } from "redux";
 
-import { reducer as appReducer } from 'modules/app'
-import apolloClient from './apolloClient'
+import { reducer as appReducer } from "modules/app";
+import apolloClient from "./apolloClient";
 
 export default combineReducers({
   app: appReducer,
   apollo: apolloClient.reducer()
-})
+});

app/templates/client/index.js

@@ -1,23 +1,23 @@
-import 'babel-polyfill'
-import 'roboto-fontface/css/roboto/roboto-fontface.css'
-import 'material-design-icons/iconfont/material-icons.css'
+import "babel-polyfill";
+import "roboto-fontface/css/roboto/roboto-fontface.css";
+import "material-design-icons/iconfont/material-icons.css";
 
-import React from 'react'
-import ReactDOM from 'react-dom'
-import { ApolloProvider } from 'react-apollo'
-import { ThemeProvider } from 'react-css-themr'
-import { BrowserRouter } from 'react-router-dom'
+import React from "react";
+import ReactDOM from "react-dom";
+import { ApolloProvider } from "react-apollo";
+import { ThemeProvider } from "react-css-themr";
+import { BrowserRouter } from "react-router-dom";
 
-import { apolloClient, configureStore } from './base'
-import App from './modules/app/components/App'
+import { apolloClient, configureStore } from "./base";
+import App from "./modules/app/components/App";
 
-import './styles/commons.scss'
-import theme from './styles/theme'
+import "./styles/commons.scss";
+import theme from "./styles/theme";
 
-const rootEl = document.getElementById('root')
-const store = configureStore()
+const rootEl = document.getElementById("root");
+const store = configureStore();
 
-ReactDOM.render(<Root currentApp={App} />, rootEl)
+ReactDOM.render(<Root currentApp={App} />, rootEl);
 
 function Root({ currentApp }) {
   return (
@@ -28,14 +28,14 @@ function Root({ currentApp }) {
         </BrowserRouter>
       </ThemeProvider>
     </ApolloProvider>
-  )
+  );
 }
 
 if (module.hot) {
-  module.hot.accept('./modules/app/components/App', () => {
+  module.hot.accept("./modules/app/components/App", () => {
     // eslint-disable-next-line global-require
-    const NextApp = require('./modules/app/components/App').default
+    const NextApp = require("./modules/app/components/App").default;
 
-    ReactDOM.render(<Root currentApp={NextApp} />, rootEl)
-  })
+    ReactDOM.render(<Root currentApp={NextApp} />, rootEl);
+  });
 }

app/templates/client/modules/app/components/App/__tests__/App-test.js

@@ -1,13 +1,13 @@
-import React from 'react'
-import { shallow } from 'enzyme'
+import React from "react";
+import { shallow } from "enzyme";
 
-import { App } from '..'
-import theme from '../theme.scss'
+import { App } from "..";
+import theme from "../theme.scss";
 
-describe('App', () => {
-  test('renders a welcome message', () => {
-    const wrapper = shallow(<App theme={theme} />)
+describe("App", () => {
+  test("renders a welcome message", () => {
+    const wrapper = shallow(<App theme={theme} />);
 
-    expect(wrapper.find('h4').text()).toEqual('Welcome!')
-  })
-})
+    expect(wrapper.find("h4").text()).toEqual("Welcome!");
+  });
+});

app/templates/client/modules/app/components/App/index.js

@@ -1,41 +1,41 @@
-import React from 'react'
-import { Switch, Route } from 'react-router-dom'
-import { themr } from 'react-css-themr'
+import React from "react";
+import { Switch, Route } from "react-router-dom";
+import { themr } from "react-css-themr";
 
-import logo from './logo.png'
+import logo from "./logo.png";
 
-import appTheme from './theme.scss'
+import appTheme from "./theme.scss";
 
 export function App({ theme }) {
   return (
     <div className={theme.app}>
       <div className={theme.header}>
-        <img src={logo} className={theme.logo} alt='logo' />
+        <img src={logo} className={theme.logo} alt="logo" />
         <h4>Welcome!</h4>
       </div>
 
       <Switch>
-        <Route exact path='/' component={Home} />
+        <Route exact path="/" component={Home} />
         <Route component={NotFound} />
       </Switch>
     </div>
-  )
+  );
 }
 
 function Home() {
   return (
     <h5 style={{ margin: 40 }}>
       Home
     </h5>
-  )
+  );
 }
 
 function NotFound() {
   return (
     <h5 style={{ margin: 40 }}>
       Route not found
     </h5>
-  )
+  );
 }
 
-export default themr('', appTheme)(App)
+export default themr("", appTheme)(App);