Code cleanup

.eslintrc

@@ -1,7 +1,8 @@
 {
   "extends": [
     "airbnb",
-    "prettier"
+    "prettier",
+    "prettier/react"
   ],
   "parser": "babel-eslint",
   "parserOptions": {
@@ -45,9 +46,18 @@
     "no-underscore-dangle": 0,
     "consistent-return": 0,
     "react/display-name": 1,
+    "react/no-unknown-property": 0,
     "react/react-in-jsx-scope": 0,
     "react/forbid-prop-types": 0,
     "react/no-unescaped-entities": 0,
+    "import/no-unresolved": 0,
+    "prefer-destructuring": 0,
+    "react/no-typos": 0,
+    "react/prefer-stateless-function": [0,
+      {
+        "ignorePureComponents": "true"
+      }
+    ],
     "jsx-a11y/accessible-emoji": 0,
     "react/jsx-filename-extension": [
       1,
@@ -82,7 +92,7 @@
       }
     ],
     "prettier/prettier": [
-      "error",
+      "warn",
       {
         "trailingComma": "es5",
         "singleQuote": true,

package.json

@@ -18,15 +18,22 @@
   },
   "devDependencies": {
     "eslint": "^4.15.0",
+    "eslint-config-airbnb": "^16.1.0",
+    "eslint-config-prettier": "^2.9.0",
     "eslint-config-synacor": "^2.0.4",
     "eslint-plugin-html": "^4.0.1",
+    "eslint-plugin-import": "^2.8.0",
+    "eslint-plugin-jsx-a11y": "^6.0.3",
     "eslint-plugin-prettier": "^2.4.0",
+    "eslint-plugin-react": "^7.5.1",
     "if-env": "^1.0.0",
     "node-sass": "^4.7.2",
     "preact-cli": "^2.1.0",
+    "prettier": "^1.10.2",
     "sass-loader": "^6.0.6"
   },
   "dependencies": {
+    "firebase": "^4.8.2",
     "preact": "^8.2.7",
     "preact-compat": "^3.17.0",
     "preact-router": "^2.6.0",

src/base.js

@@ -1,7 +1,8 @@
 import Rebase from 're-base';
+import fireApp from './base2';
+
 require('firebase/auth');
 require('firebase/database');
-import fireApp from './base2';
 
 const base = Rebase.createClass(fireApp.database());
 export default base;

src/base2.js

@@ -1,11 +1,12 @@
 import firebase from 'firebase/app';
+
 require('firebase/auth');
 require('firebase/database');
 
 const fireApp = firebase.initializeApp({
-  apiKey: "AIzaSyA1FJ3bLQnN1fstX3ZjHrH7564qvFi-ahI",
-  authDomain: "uva-reactnativeapp.firebaseapp.com",
-  databaseURL: "https://uva-reactnativeapp.firebaseio.com"
+  apiKey: 'AIzaSyA1FJ3bLQnN1fstX3ZjHrH7564qvFi-ahI',
+  authDomain: 'uva-reactnativeapp.firebaseapp.com',
+  databaseURL: 'https://uva-reactnativeapp.firebaseio.com',
 });
 
-export default fireApp;
+export default fireApp;

src/components/app.js

@@ -1,4 +1,4 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
 import { Router } from 'preact-router';
 
 // Import Routes
@@ -15,7 +15,7 @@ export default class App extends Component {
     super();
 
     this.state = {
-      uid: 'hl8tgg53mkQIUmIh6D8SUsReTGD2'
+      uid: 'hl8tgg53mkQIUmIh6D8SUsReTGD2',
     };
   }
   handleRoute = e => {

src/components/header/index.js

@@ -1,4 +1,4 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
 import { Link } from 'preact-router/match';
 import style from './style';
 
@@ -8,9 +8,15 @@ export default class Header extends Component {
       <header class={style.header}>
         <h1>Preact App</h1>
         <nav>
-          <Link activeClassName={style.active} href="/">Home</Link>
-          <Link activeClassName={style.active} href="/profile">Me</Link>
-          <Link activeClassName={style.active} href="/profile/john">John</Link>
+          <Link activeClassName={style.active} href="/">
+            Home
+          </Link>
+          <Link activeClassName={style.active} href="/profile">
+            Me
+          </Link>
+          <Link activeClassName={style.active} href="/profile/john">
+            John
+          </Link>
         </nav>
       </header>
     );

src/components/item/index.js

@@ -1,4 +1,5 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
+import { PropTypes } from 'preact-compat';
 import { Link } from 'preact-router/match';
 import style from './style';
 
@@ -13,4 +14,8 @@ export default class Item extends Component {
       </Link>
     );
   }
-}
+}
+
+Item.propTypes = {
+  details: PropTypes.object.isRequired,
+};

src/routes/Media/index.js

@@ -1,4 +1,4 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
 import style from './style';
 
 export default class Media extends Component {

src/routes/account/index.js

@@ -1,4 +1,4 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
 import style from './style';
 
 export default class Account extends Component {

src/routes/add/index.js

@@ -1,4 +1,4 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
 import style from './style';
 
 export default class Add extends Component {

src/routes/addMedia/index.js

@@ -1,4 +1,4 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
 import style from './style';
 
 export default class AddMedia extends Component {

src/routes/home/index.js

@@ -1,4 +1,4 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
 import style from './style';
 
 export default class Home extends Component {

src/routes/login/index.js

@@ -1,4 +1,4 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
 import style from './style';
 
 export default class Login extends Component {

src/routes/measurement/index.js

@@ -1,4 +1,5 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
+import { PropTypes } from 'preact-compat';
 import Header from '../../components/header';
 import style from './style';
 import base from '../../base';
@@ -8,14 +9,14 @@ export default class Measurement extends Component {
     super(props);
 
     this.state = {
-      measurement: {}
+      measurement: {},
     };
   }
 
   componentWillMount(nextProps) {
     this.ref = base.bindToState(`/${this.props.uid}/mes/${this.props.measurementId}`, {
       context: this,
-      state: 'measurement'
+      state: 'measurement',
     });
   }
 
@@ -28,43 +29,49 @@ export default class Measurement extends Component {
     return (
       <div class={style.container}>
         <Header head={this.props.head} backCol="#ffffff" />
-        {measurement.longitude &&
+        {measurement.longitude && (
           <div class={style.row}>
             <p class={style.label}>Longitude</p>
             <p class={style.value}>{measurement.longitude}</p>
           </div>
-        }
-        {measurement.latitude &&
+        )}
+        {measurement.latitude && (
           <div class={style.row}>
             <p class={style.label}>Latitude</p>
             <p class={style.value}>{measurement.latitude}</p>
           </div>
-        }
-        {measurement.date &&
+        )}
+        {measurement.date && (
           <div class={style.row}>
             <p class={style.label}>Date</p>
             <p class={style.value}>{measurement.date}</p>
           </div>
-        }
-        {measurement.acidity &&
+        )}
+        {measurement.acidity && (
           <div class={style.row}>
             <p class={style.label}>Acidity (pH)</p>
             <p class={style.value}>{measurement.acidity}</p>
           </div>
-        }
-        {measurement.salinity &&
+        )}
+        {measurement.salinity && (
           <div class={style.row}>
             <p class={style.label}>Salinity (PSU)</p>
             <p class={style.value}>{measurement.salinity}</p>
           </div>
-        }
-        {measurement.tempature &&
+        )}
+        {measurement.tempature && (
           <div class={style.row}>
             <p class={style.label}>Tempature</p>
             <p class={style.value}>{measurement.tempature}</p>
           </div>
-        }
+        )}
       </div>
     );
   }
 }
+
+Measurement.propTypes = {
+  uid: PropTypes.string.isRequired,
+  head: PropTypes.string.isRequired,
+  measurementId: PropTypes.string.isRequired,
+};

src/routes/overview/index.js

@@ -1,5 +1,6 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
 import { Link } from 'preact-router/match';
+import { PropTypes } from 'preact-compat';
 import style from './style';
 
 // Import Components
@@ -14,14 +15,14 @@ export default class Overview extends Component {
     super(props);
 
     this.state = {
-      measurements: {}
+      measurements: {},
     };
   }
 
   componentWillMount(nextProps) {
     this.ref = base.syncState(`/${this.props.uid}/mes/`, {
       context: this,
-      state: 'measurements'
+      state: 'measurements',
     });
   }
 
@@ -72,3 +73,7 @@ export default class Overview extends Component {
     );
   }
 }
+
+Overview.propTypes = {
+  uid: PropTypes.string.isRequired,
+};