Adds ESlint to webpack so files are linted as they are saved

.eslintrc.js

@@ -1,4 +1,7 @@
 module.exports = {
     extends: 'expensify',
     parser: 'babel-eslint',
+    rules: {
+        "react/jsx-filename-extension": [1, {"extensions": [".js"]}],
+    },
 };

package.json

@@ -40,6 +40,7 @@
     "clean-webpack-plugin": "^3.0.0",
     "eslint": "^7.6.0",
     "eslint-config-expensify": "^2.0.11",
+    "eslint-loader": "^4.0.2",
     "html-webpack-plugin": "^4.3.0",
     "jest": "^26.2.2",
     "metro-react-native-babel-preset": "^0.61.0",

src/App.js

@@ -1,4 +1,4 @@
-import Expensify from './Expensify';
 import React from 'react';
+import Expensify from './Expensify';
 
 export default () => <Expensify />;

src/Expensify.js

@@ -1,22 +1,24 @@
-import {init as StoreInit} from './store/Store';
+import React, {Component} from 'react';
 import SignInPage from './page/SignInPage';
 import HomePage from './page/HomePage/HomePage';
 import * as Store from './store/Store';
 import * as ActiveClientManager from './lib/ActiveClientManager';
 import {verifyAuthToken} from './store/actions/SessionActions';
 import STOREKEYS from './store/STOREKEYS';
-import React, {Component} from 'react';
-import {Route, Router, Redirect, Switch} from './lib/Router';
+import {
+    Route,
+    Router,
+    Redirect,
+    Switch
+} from './lib/Router';
 
 // Initialize the store when the app loads for the first time
-StoreInit();
+Store.init();
 
 export default class Expensify extends Component {
     constructor(props) {
         super(props);
 
-        this.sessionChanged = this.sessionChanged.bind(this);
-
         this.state = {
             redirectTo: null,
         };
@@ -33,21 +35,13 @@ export default class Expensify extends Component {
 
         // Initialize this client as being an active client
         await ActiveClientManager.init();
-        //TODO: Refactor window events
+
+        // TODO: Refactor window events
         // window.addEventListener('beforeunload', () => {
         //   ActiveClientManager.removeClient();
         // });
     }
 
-    /**
-     * When the session changes, change which page the user sees
-     *
-     * @param {object} newSession
-     */
-    sessionChanged(newSession) {
-        this.setState({isAuthTokenValid: newSession && newSession.authToken});
-    }
-
     render() {
         return (
             <Router>

src/lib/ActiveClientManager.js

@@ -18,9 +18,7 @@ const init = async () => {
  */
 function removeClient() {
     const activeClientIDs = Store.get(STOREKEYS.ACTIVE_CLIENT_IDS) || [];
-    const newActiveClientIDs = activeClientIDs.filter(
-        (activeClientID) => activeClientID !== clientID,
-    );
+    const newActiveClientIDs = activeClientIDs.filter(activeClientID => activeClientID !== clientID);
     Store.set(STOREKEYS.ACTIVE_CLIENT_IDS, newActiveClientIDs);
 }
 

src/lib/Network.js

@@ -21,14 +21,12 @@ function request(command, data, type = 'post') {
             _.each(data, (val, key) => formData.append(key, val));
             return formData;
         })
-        .then(formData => fetch(
-            `${CONFIG.EXPENSIFY.API_ROOT}command=${command}`,
-            {
-                method: type,
-                body: formData,
-            },
-        ))
+        .then(formData => fetch(`${CONFIG.EXPENSIFY.API_ROOT}command=${command}`, {
+            method: type,
+            body: formData,
+        }))
         .then(response => response.json())
+        // eslint-disable-next-line no-unused-vars
         .catch(() => isAppOffline = true);
 }
 
@@ -56,27 +54,27 @@ function delayedWrite(command, data) {
 /**
  * Process the write queue by looping through the queue and attempting to make the requests
  */
-function processWriteQueue() {
-    if (isAppOffline) {
-        // Make a simple request to see if we're online again
-        request('Get', null, 'get')
-            .then(() => isAppOffline = false);
-        return;
-    }
-
-    if (delayedWriteQueue.length === 0) {
-        return;
-    }
-
-    _.each(delayedWriteQueue, (delayedWriteRequest) => {
-        request(delayedWriteRequest.command, delayedWriteRequest.data)
-            .then(delayedWriteRequest.callback)
-            .catch(() => {
-                // If the request failed, we need to put the request object back into the queue
-                delayedWriteQueue.push(delayedWriteRequest);
-            });
-    });
-}
+// function processWriteQueue() {
+//     if (isAppOffline) {
+//         // Make a simple request to see if we're online again
+//         request('Get', null, 'get')
+//             .then(() => isAppOffline = false);
+//         return;
+//     }
+//
+//     if (delayedWriteQueue.length === 0) {
+//         return;
+//     }
+//
+//     _.each(delayedWriteQueue, (delayedWriteRequest) => {
+//         request(delayedWriteRequest.command, delayedWriteRequest.data)
+//             .then(delayedWriteRequest.callback)
+//             .catch(() => {
+//                 // If the request failed, we need to put the request object back into the queue
+//                 delayedWriteQueue.push(delayedWriteRequest);
+//             });
+//     });
+// }
 
 // TODO: Figure out setInterval
 // Process our write queue very often

src/lib/PersistentStorage.js

@@ -13,14 +13,9 @@ import _ from 'underscore';
  */
 function get(key) {
     return AsyncStorage.getItem(key)
-        .then(val => {
-            const jsonValue = JSON.parse(val);
-            return jsonValue;
-        })
-        .catch(err => {
-            console.error(`Unable to get item from persistent storage. Key: ${key} Error: ${err}`);
-        });
-};
+        .then(val => JSON.parse(val))
+        .catch(err => console.error(`Unable to get item from persistent storage. Key: ${key} Error: ${err}`));
+}
 
 /**
  * Get the data for multiple keys
@@ -38,9 +33,7 @@ function multiGet(keys) {
             ...finalData,
             [keyValuePair[0]]: JSON.parse(keyValuePair[1]),
         }), {}))
-        .catch((err) => {
-            console.error(`Unable to get item from persistent storage. Keys: ${JSON.stringify(keys)} Error: ${err}`);
-        });
+        .catch(err => console.error(`Unable to get item from persistent storage. Keys: ${JSON.stringify(keys)} Error: ${err}`));
 }
 
 /**
@@ -52,7 +45,7 @@ function multiGet(keys) {
  */
 function set(key, val) {
     return AsyncStorage.setItem(key, JSON.stringify(val));
-};
+}
 
 /**
  * Set multiple keys at once
@@ -79,7 +72,7 @@ function multiSet(data) {
  */
 function clear() {
     return AsyncStorage.clear();
-};
+}
 
 /**
  * Merges `val` into an existing key. Best used when updating an existing object

src/lib/Router/index.js

@@ -7,4 +7,11 @@ import {
     withRouter,
 } from 'react-router-dom';
 
-export {Link, Route, Redirect, Router, Switch, withRouter};
+export {
+    Link,
+    Route,
+    Redirect,
+    Router,
+    Switch,
+    withRouter
+};

src/lib/Router/index.native.js

@@ -7,4 +7,11 @@ import {
     withRouter,
 } from 'react-router-native';
 
-export {Link, Route, Redirect, Router, Switch, withRouter};
+export {
+    Link,
+    Route,
+    Redirect,
+    Router,
+    Switch,
+    withRouter
+};

src/page/HomePage/HomePage.js

@@ -2,9 +2,14 @@
  * @format
  * @flow strict-local
  */
-
 import React, {Component} from 'react';
-import {SafeAreaView, Text, StatusBar, View, Button} from 'react-native';
+import {
+    SafeAreaView,
+    Text,
+    StatusBar,
+    View,
+    Button
+} from 'react-native';
 import {signOut} from '../../store/actions/SessionActions';
 
 export default class App extends Component {
@@ -30,10 +35,11 @@ export default class App extends Component {
                                 margin: 20,
                                 textAlign: 'center',
                                 fontWeight: 'bold',
-                            }}>
-                            {'React Native Chat Homepage!'}
+                            }}
+                        >
+                            React Native Chat Homepage!
                         </Text>
-                        <Button onPress={this.signOut} title={'Sign Out'} />
+                        <Button onPress={this.signOut} title="Sign Out" />
                     </View>
                 </SafeAreaView>
             </>

src/page/SignInPage.js

@@ -26,6 +26,7 @@ export default class App extends Component {
         this.state = {
             login: '',
             password: '',
+            // eslint-disable-next-line react/no-unused-state
             error: Store.get(STOREKEYS.SESSION, 'error'),
         };
     }
@@ -45,6 +46,7 @@ export default class App extends Component {
      * @param {object} newSession
      */
     sessionChanged(newSession) {
+        // eslint-disable-next-line react/no-unused-state
         this.setState({error: newSession && newSession.error});
     }
 
@@ -65,20 +67,20 @@ export default class App extends Component {
                         <TextInput
                             style={{height: 40, borderColor: 'black', borderWidth: 2}}
                             value={this.state.login}
-                            onChangeText={(text) => this.setState({login: text})}
+                            onChangeText={text => this.setState({login: text})}
                         />
                     </View>
                     <View>
                         <Text>Password:</Text>
                         <TextInput
                             style={{height: 40, borderColor: 'black', borderWidth: 2}}
-                            secureTextEntry={true}
+                            secureTextEntry
                             value={this.state.password}
-                            onChangeText={(text) => this.setState({password: text})}
+                            onChangeText={text => this.setState({password: text})}
                         />
                     </View>
                     <View>
-                        <Button onPress={this.submit} title={'Log In'} />
+                        <Button onPress={this.submit} title="Log In" />
                     </View>
                 </SafeAreaView>
             </>