Update prettier config to use trailing commas; add local workspace settings for VS Code

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "trailingComma": "es5",
+  "printWidth": 80,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "jsxBracketSameLine": true
+}

.vscode/settings.json

@@ -0,0 +1,31 @@
+{
+    "files.associations": {
+        "*.js": "javascriptreact"
+    },
+    "[javascript]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[javascriptreact]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode",
+    },
+    "eslint.enable": true,
+    "eslint.options": {
+        "extensions": [
+            ".js",
+            ".jsx"
+        ]
+    },
+    "eslint.validate": [
+        "javascript",
+        "javascriptreact"
+    ],
+    "eslint.alwaysShowStatus": true,
+    "editor.formatOnPaste": false,
+    "editor.formatOnSave": true,
+    "editor.codeActionsOnSave": {
+        "source.organizeImports": true,
+        "source.fixAll.eslint": true
+    },
+    "javascript.suggest.completeFunctionCalls": true,
+    "javascript.implicitProjectConfig.checkJs": true,
+}

App.js

@@ -30,7 +30,7 @@ async function loadResourcesAsync() {
   await Promise.all([
     Asset.loadAsync([
       require('./assets/images/robot-dev.png'),
-      require('./assets/images/robot-prod.png')
+      require('./assets/images/robot-prod.png'),
     ]),
     Font.loadAsync({
       // This is the font that we are using for our tab bar
@@ -41,8 +41,8 @@ async function loadResourcesAsync() {
       // Used across application
       'poppins-regular': require('./assets/fonts/Poppins-Regular.ttf'),
       'poppins-semibold': require('./assets/fonts/Poppins-SemiBold.ttf'),
-      'poppins-medium': require('./assets/fonts/Poppins-Medium.ttf')
-    })
+      'poppins-medium': require('./assets/fonts/Poppins-Medium.ttf'),
+    }),
   ]);
 }
 
@@ -59,6 +59,6 @@ function handleFinishLoading(setLoadingComplete) {
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    backgroundColor: '#fff'
-  }
+    backgroundColor: '#fff',
+  },
 });

components/AuthTextField.js

@@ -4,7 +4,7 @@ import { fieldStateColors } from '../lib/authUtils';
 import {
   InputNoticeContainer,
   TextField,
-  TextFieldContainer
+  TextFieldContainer,
 } from '../styled/auth';
 import { Caption } from './BaseComponents';
 
@@ -18,7 +18,7 @@ function AuthTextField({
   value,
   onBlurCallback,
   onFocusCallback,
-  changeTextCallback
+  changeTextCallback,
 }) {
   return (
     <TextFieldContainer>

components/news/NewsItem.js

@@ -5,7 +5,7 @@ import {
   ContentContainer,
   ContentText,
   DateContainer,
-  DateText
+  DateText,
 } from '../../styled/news';
 
 class NewsItem extends React.Component {
@@ -24,7 +24,7 @@ class NewsItem extends React.Component {
       <TouchableOpacity
         onPress={() =>
           this.props.navigation.navigate('NewsDetails', {
-            currentNewsItem: this.props.newsItem
+            currentNewsItem: this.props.newsItem,
           })
         }>
         <Card>

components/product/ProductCard.js

@@ -16,7 +16,7 @@ function ProductCard({ product, store, navigation, displayPoints }) {
       onPress={() =>
         navigation.navigate('ProductDetails', {
           currentProduct: product,
-          store
+          store,
         })
       }>
       <ColumnContainer>

components/product/ProductInfo.js

@@ -3,7 +3,7 @@ import { Body, Caption, Title } from '../BaseComponents';
 import {
   ProductInfoContainer,
   ProductInfoCaptionContainer,
-  ProductNoticeContainer
+  ProductNoticeContainer,
 } from '../../styled/product';
 
 /**

components/product/StoreProducts.js

@@ -5,7 +5,7 @@ import {
   ButtonContainer,
   ButtonLabel,
   Title,
-  Subhead
+  Subhead,
 } from '../BaseComponents';
 import StoreCard from '../store/StoreCard';
 import ProductCard from './ProductCard';
@@ -25,7 +25,7 @@ function StoreProducts({ navigation, store, products }) {
               navigation.navigate('Products', {
                 products,
                 navigation,
-                store
+                store,
               })
             }>
             <Subhead color="black">See all {products.length}</Subhead>

components/rewards/RewardsCard.js

@@ -2,7 +2,7 @@ import React from 'react';
 import Colors from '../../assets/Colors';
 import {
   RewardDescriptionContainer,
-  RewardsCardContainer
+  RewardsCardContainer,
 } from '../../styled/rewards';
 import { Caption, Subhead } from '../BaseComponents';
 import CircleIcon from '../CircleIcon';

components/rewards/RewardsHome.js

@@ -4,7 +4,7 @@ import { ProgressBar } from 'react-native-paper';
 import Colors from '../../assets/Colors';
 import {
   AvailableRewardsContainer,
-  RewardsProgressContainer
+  RewardsProgressContainer,
 } from '../../styled/rewards';
 import { Body, Overline, Title } from '../BaseComponents';
 import RewardsCard from './RewardsCard';
@@ -36,7 +36,7 @@ function RewardsHome({ user }) {
             height: 20,
             width: '100%',
             borderRadius: 20,
-            marginBottom: 15
+            marginBottom: 15,
           }}
           progress={(parseInt(user.points) % 1000) / 1000}
           color={Colors.primaryGreen}

components/rewards/Transaction.js

@@ -15,7 +15,7 @@ function Transaction(props) {
     weekday: 'short',
     year: 'numeric',
     month: 'short',
-    day: 'numeric'
+    day: 'numeric',
   };
   return (
     <Card>

components/store/StoreCard.js

@@ -6,12 +6,12 @@ import Colors from '../../assets/Colors';
 import {
   InLineContainer,
   SpaceAroundRowContainer,
-  SpaceBetweenRowContainer
+  SpaceBetweenRowContainer,
 } from '../../styled/shared';
 import {
   DividerBar,
   EBTStatusBar,
-  StoreCardContainer
+  StoreCardContainer,
 } from '../../styled/store';
 import { Body, Caption, Title } from '../BaseComponents';
 import StoreProductButton from './StoreProductButton';

constants/Colors.js

@@ -10,5 +10,5 @@ export default {
   warningBackground: '#EAEB5E',
   warningText: '#666804',
   noticeBackground: tintColor,
-  noticeText: '#fff'
+  noticeText: '#fff',
 };

lib/airtable/airtable.js

@@ -21,7 +21,7 @@ const apiKey = process.env.AIRTABLE_API_KEY;
 
 Airtable.configure({
   endpointUrl: ENDPOINT_URL,
-  apiKey
+  apiKey,
 });
 
 const base = Airtable.base(BASE_ID);
@@ -88,7 +88,7 @@ function getAllRecords(table) {
   return new Promise(function(resolve, reject) {
     base(table)
       .select({
-        view: VIEW
+        view: VIEW,
       })
       .eachPage(
         function page(records, fetchNextPage) {
@@ -140,7 +140,7 @@ function getRecordsByAttribute(table, fieldType, field) {
     base(table)
       .select({
         view: VIEW,
-        filterByFormula: `{${fieldType}}='${field}'`
+        filterByFormula: `{${fieldType}}='${field}'`,
       })
       .firstPage((err, records) => {
         if (err) {
@@ -170,8 +170,8 @@ function updateRecord(table, id, updatedRecord) {
       [
         {
           id,
-          fields: transformedRecord
-        }
+          fields: transformedRecord,
+        },
       ],
       function(err, records) {
         if (err) {
@@ -223,5 +223,5 @@ export {
   getRecordById,
   getRecordsByAttribute,
   updateRecord,
-  deleteRecord
+  deleteRecord,
 };

lib/airtable/request.js

@@ -18,7 +18,7 @@ import {
   getAllRecords,
   getRecordsByAttribute,
   getRecordById,
-  deleteRecord
+  deleteRecord,
 } from './airtable';
 
 /*

lib/airtable/schema.js

@@ -13,7 +13,7 @@ export const Tables = {
   Products: 'Products',
   News: 'News',
   Receipts: 'Receipts',
-  Recipes: 'Recipes'
+  Recipes: 'Recipes',
 };
 
 export const Columns = {
@@ -31,15 +31,15 @@ export const Columns = {
     pushTokenIds: `Push Tokens`,
     name: `Name`,
     redeemedRewards: `Redeemed Rewards`,
-    id: `id`
+    id: `id`,
   },
   'Push Tokens': {
     primaryKey: `Primary Key`,
     createdDate: `Created Date`,
     customerId: `Customer`,
     customerName: `Customer Name`,
     token: `Token`,
-    id: `id`
+    id: `id`,
   },
   Clerks: {
     primaryKey: `Primary Key`,
@@ -50,7 +50,7 @@ export const Columns = {
     storeId: `Store`,
     clerkName: `Clerk Name`,
     id: `id`,
-    storeName: `Store Name`
+    storeName: `Store Name`,
   },
   Transactions: {
     primaryKey: `Primary Key`,
@@ -66,7 +66,7 @@ export const Columns = {
     lineItems: `Line Items`,
     storeName: `Store Name`,
     transaction_id: `transaction_id`,
-    id: `id`
+    id: `id`,
   },
   'Line Items': {
     primaryKey: `Primary Key`,
@@ -76,7 +76,7 @@ export const Columns = {
     productPrice: `Product price`,
     transactionId: `Transaction`,
     productName: `Product Name`,
-    id: `id`
+    id: `id`,
   },
   Stores: {
     primaryKey: `Primary Key`,
@@ -91,7 +91,7 @@ export const Columns = {
     id: `id`,
     clerkIds: `Clerks`,
     productIds: `Products`,
-    storeName: `Store Name`
+    storeName: `Store Name`,
   },
   Products: {
     primaryKey: `Primary Key`,
@@ -103,15 +103,15 @@ export const Columns = {
     lineItemIds: `Line Items`,
     name: `Name`,
     storeIds: `Stores`,
-    image: `Image`
+    image: `Image`,
   },
   News: {
     primaryKey: `Primary Key`,
     created: `Created`,
     description: `Description`,
     id: `id`,
     postDate: `Post Date`,
-    title: `Title`
+    title: `Title`,
   },
   Receipts: {
     primaryKey: `Primary Key`,
@@ -120,7 +120,7 @@ export const Columns = {
     time: `Time`,
     customerId: `Customer`,
     customerName: `Customer Name`,
-    id: `id`
+    id: `id`,
   },
   Recipes: {
     primaryKey: `Primary Key`,
@@ -130,6 +130,6 @@ export const Columns = {
     ingredients: `Ingredients`,
     instructions: `Instructions`,
     title: `Title`,
-    field8: `Field 8`
-  }
+    field8: `Field 8`,
+  },
 };