Add .eslintignore to skip asset files

.eslintignore

@@ -0,0 +1 @@
+/src/assets

.eslintrc

@@ -33,10 +33,7 @@
       }
     ],
     "no-template-curly-in-string": "error",
-    "semi": [
-      "error",
-      "always"
-    ],
+    "semi": "off",
     "array-bracket-spacing": [
       "error",
       "never"
@@ -53,10 +50,7 @@
       }
     ],
     "camelcase": "warn",
-    "comma-dangle": [
-      "error",
-      "never"
-    ],
+    "comma-dangle": "off",
     "comma-spacing": [
       "error",
       {

.prettierignore

@@ -0,0 +1,3 @@
+node_modules
+public
+src/assets

.prettierrc

@@ -0,0 +1,6 @@
+{
+  "printWidth": 100,
+  "singleQuote": true,
+  "trailingComma": "es5",
+  "jsxBracketSameLine": false,
+}

package.json

@@ -24,7 +24,7 @@
   "scripts": {
     "build": "gatsby build",
     "develop": "gatsby develop",
-    "format": "prettier --trailing-comma es5 --no-semi --single-quote --write \"src/**/*.js\"",
+    "format": "prettier --write \"src/**/*.js\"",
     "test": "jest",
     "test:watch": "jest --watch",
     "test:coverage": "jest --env=jsdom --coverage",
@@ -53,7 +53,7 @@
   },
   "lint-staged": {
     "src/**/*.js": [
-      "yarn format",
+      "eslint ./node_modules/eslint/bin/eslint.js ./src/**/*.js",
       "git add"
     ]
   },

src/components/Countdown.js

@@ -1,47 +1,47 @@
-import React, { Component } from 'react';
-import Link from 'gatsby-link';
+import React, { Component } from 'react'
+import Link from 'gatsby-link'
 
 class Countdown extends Component {
   state = {
     days: null,
     hours: null,
     minutes: null,
     seconds: null,
-    interval: null
-  };
+    interval: null,
+  }
 
   componentDidMount = () => {
-    const interval = setInterval(() => this.getTimeRemaining(), 1000);
-    this.setState({ interval });
-  };
+    const interval = setInterval(() => this.getTimeRemaining(), 1000)
+    this.setState({ interval })
+  }
 
   componentWillUnmount = () => {
-    this.stopCountDown();
-  };
+    this.stopCountDown()
+  }
 
   getTimeRemaining = () => {
-    const deadLine = 'March 04 2019';
-    const time = Date.parse(deadLine) - Date.parse(new Date());
-    const seconds = Math.floor((time / 1000) % 60);
-    const minutes = Math.floor((time / 1000 / 60) % 60);
-    const hours = Math.floor((time / (1000 * 60 * 60)) % 24);
-    const days = Math.floor(time / (1000 * 60 * 60 * 24));
+    const deadLine = 'March 04 2019'
+    const time = Date.parse(deadLine) - Date.parse(new Date())
+    const seconds = Math.floor((time / 1000) % 60)
+    const minutes = Math.floor((time / 1000 / 60) % 60)
+    const hours = Math.floor((time / (1000 * 60 * 60)) % 24)
+    const days = Math.floor(time / (1000 * 60 * 60 * 24))
 
     this.setState({
       days,
       hours,
       minutes,
-      seconds
-    });
-  };
+      seconds,
+    })
+  }
 
   stopCountDown = () => {
-    const { interval } = this.state;
-    clearInterval(interval);
-  };
+    const { interval } = this.state
+    clearInterval(interval)
+  }
 
   render() {
-    const { days, hours, minutes, seconds } = this.state;
+    const { days, hours, minutes, seconds } = this.state
     return (
       <div className="col-sm-6 event_counter_container text-center">
         <div className="container-countdown">
@@ -66,8 +66,8 @@ class Countdown extends Component {
           Apply
         </Link>
       </div>
-    );
+    )
   }
 }
 
-export default Countdown;
+export default Countdown

src/components/DonateModal.js

@@ -1,22 +1,22 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import Modal from 'react-modal';
+import React from 'react'
+import PropTypes from 'prop-types'
+import Modal from 'react-modal'
 
-Modal.setAppElement('#___gatsby');
+Modal.setAppElement('#___gatsby')
 
 const container = {
   content: {
     top: '20%',
     bottom: '20%',
-    height: 'auto'
-  }
-};
+    height: 'auto',
+  },
+}
 
 // unused variable do we need this???
 
 // const closeButton = {
 //   right: '8px'
-// };
+// }
 
 const DonateModal = ({ modalIsOpen, closeModal }) => (
   <Modal
@@ -31,7 +31,7 @@ const DonateModal = ({ modalIsOpen, closeModal }) => (
       style={{
         maxWidth: '100%',
         minWidth: '100%',
-        maxHeight: 'none!important'
+        maxHeight: 'none!important',
       }}
       seamless="seamless"
       name="donorbox"
@@ -42,11 +42,11 @@ const DonateModal = ({ modalIsOpen, closeModal }) => (
       frameBorder={0}
     />
   </Modal>
-);
+)
 
 DonateModal.propTypes = {
   modalIsOpen: PropTypes.bool,
-  closeModal: PropTypes.func
-};
+  closeModal: PropTypes.func,
+}
 
-export default DonateModal;
+export default DonateModal

src/components/Footer.js

@@ -1,5 +1,5 @@
-import React from 'react';
-import Link from 'gatsby-link';
+import React from 'react'
+import Link from 'gatsby-link'
 
 const Footer = () => (
   <div>
@@ -10,8 +10,8 @@ const Footer = () => (
             <div className="widgets-content footer-widget-wrap">
               <h3 className="widgets-title">About #VetsWhoCode</h3>
               <p>
-                FRAGO, doing business as #VetsWhoCode, is an exempt organization as described in Section 501(c)(3) of
-                the Internal Revenue Code. Our EIN is 47-3555231.
+                FRAGO, doing business as #VetsWhoCode, is an exempt organization as described in
+                Section 501(c)(3) of the Internal Revenue Code. Our EIN is 47-3555231.
               </p>
               <div className="footer-social">
                 <a href="http://bit.ly/vetswhocode-fb">
@@ -69,7 +69,11 @@ const Footer = () => (
                         <Link to="/contact">Contact Us</Link>
                       </li>
                       <li>
-                        <a href="https://medium.com/vets-who-code" rel="noopener noreferrer" target="_blank">
+                        <a
+                          href="https://medium.com/vets-who-code"
+                          rel="noopener noreferrer"
+                          target="_blank"
+                        >
                           <span>Blog</span>
                         </a>
                       </li>
@@ -85,8 +89,10 @@ const Footer = () => (
               <div className="office map">
                 <p>
                   <span>Hi, if you have any questions, please drop us a line.</span>
-                  <br />Email: [email protected]
-                  <br />Phone: (917) 960-3806
+                  <br />
+                  Email: [email protected]
+                  <br />
+                  Phone: (917) 960-3806
                 </p>
               </div>
             </div>
@@ -98,7 +104,7 @@ const Footer = () => (
       <div className="container">
         <div className="row">
           <div className="col-md-6 col-sm-6">
-            <p className="copyright">&copy; #VetsWhoCode</p>
+            <p className="copyright">&copy #VetsWhoCode</p>
           </div>
           <div className="col-md-6 col-sm-6">
             <ul className="footer-menu">
@@ -111,6 +117,6 @@ const Footer = () => (
       </div>
     </footer>
   </div>
-);
+)
 
-export default Footer;
+export default Footer

src/components/Header.js

@@ -1,9 +1,9 @@
-import React from 'react';
-import HeaderSlider from "./HeaderSlider";
+import React from 'react'
+import HeaderSlider from './HeaderSlider'
 
 const Header = () => (
   <header id="site-header" className="site-header flexslider classic">
     <HeaderSlider />
   </header>
-);
-export default Header;
+)
+export default Header

src/components/HeaderSlider.js

@@ -1,21 +1,21 @@
-import React, { Component } from 'react';
-import Slider from 'react-slick';
-import Link from 'gatsby-link';
+import React, { Component } from 'react'
+import Slider from 'react-slick'
+import Link from 'gatsby-link'
 
-import 'slick-carousel/slick/slick.css';
-import 'slick-carousel/slick/slick-theme.css';
+import 'slick-carousel/slick/slick.css'
+import 'slick-carousel/slick/slick-theme.css'
 
-import codePNG from '../images/code.png';
-import speakingPNG from '../images/speaking.png';
-import thisIsUsPNG from '../images/this_is_us.png';
+import codePNG from '../images/code.png'
+import speakingPNG from '../images/speaking.png'
+import thisIsUsPNG from '../images/this_is_us.png'
 
 class HeaderSlider extends Component {
   next = () => {
-    this.slider.slickNext();
+    this.slider.slickNext()
   }
 
   previous = () => {
-    this.slider.slickPrev();
+    this.slider.slickPrev()
   }
 
   render() {
@@ -26,8 +26,8 @@ class HeaderSlider extends Component {
       slidesToShow: 1,
       slidesToScroll: 1,
       autoplay: true,
-      autoplaySpeed: 3000
-    };
+      autoplaySpeed: 3000,
+    }
 
     return (
       <div>
@@ -126,8 +126,8 @@ class HeaderSlider extends Component {
           </li>
         </ul>
       </div>
-    );
+    )
   }
 }
 
-export default HeaderSlider;
+export default HeaderSlider

src/components/Loader.js

@@ -1,29 +1,29 @@
-import React, { Component } from 'react';
+import React, { Component } from 'react'
 
 class Loader extends Component {
   componentDidMount() {
-    global.jQuery = require('../../static/vendor/jquery/dist/jquery');
-    window.$ = jQuery;
-    window.jQuery = jQuery;
-    this.handleLoader();
+    global.jQuery = require('../../static/vendor/jquery/dist/jquery')
+    window.$ = jQuery
+    window.jQuery = jQuery
+    this.handleLoader()
   }
 
   handleLoader = () => {
     $(window).on('load', () => {
-      $('#loader').fadeOut();
+      $('#loader').fadeOut()
       $('#loader-wrapper')
         .delay(100)
-        .fadeOut();
-    });
+        .fadeOut()
+    })
   }
 
   render() {
     return (
       <div id="loader-wrapper">
         <div id="loader" />
       </div>
-    );
+    )
   }
 }
 
-export default Loader;
+export default Loader