Add Netlify configuration for Test Deploy Previews (#356)

We need the ability to swap API url depending
on where the UI is deployed. If deployed as a development
build, it needs to point to the testing instance.

Add 'dotenv' dependency to pass API URL depending on environment
to production build script and configure Netlify to accurately
build proper build depending on which branch it's deploying.

.env.development

@@ -0,0 +1,2 @@
+REACT_APP_API_URL=https://acmucsd-portal-testing.herokuapp.com
+PORT=8080

.env.production

@@ -0,0 +1 @@
+REACT_APP_API_URL=https://acmucsd-membership-portal-api.herokuapp.com

netlify.toml

@@ -1,3 +1,16 @@
+[build]
+# Configure it so that deploy previews and `nightly` run on the testing instance, not
+# on the default instance
+[context.deploy-preview]
+  publish = "build/"
+  command = "CI=false npm run build:dev"
+[context.deploy-preview.environment]
+  NODE_ENV = "development"
+[context.branch-deploy]
+  command = "CI=false npm run build:dev"
+[context.branch-deploy.environment]
+  NODE_ENV = "development"
+
 # The following redirect is intended for use with most SPAs that handle
 # routing internally.
 [[redirects]]

package.json

@@ -34,12 +34,13 @@
     "yup": "^0.29.3"
   },
   "scripts": {
-    "build": "react-app-rewired build",
+    "build:dev": "dotenv -e .env.development react-app-rewired build",
+    "build": "dotenv -e .env.production react-app-rewired build",
     "coveralls": "jest --coverage && cat ./coverage/lcov.info | coveralls",
     "eject": "react-scripts eject",
     "lint": "eslint \"**/*.{ts,tsx}\" && npx stylelint \"**/*.less\"",
     "lint:fix": "eslint \"**/*.{ts,tsx}\" --fix && npx stylelint \"**/*.less\" --fix",
-    "start": "cross-env PORT=8080 react-app-rewired start",
+    "start": "dotenv -e .env.development react-app-rewired start",
     "test": "jest",
     "test:watch": "jest --watch"
   },
@@ -76,6 +77,7 @@
     "babel-jest": "^24.8.0",
     "coveralls": "^3.0.6",
     "cross-env": "^7.0.2",
+    "dotenv-cli": "^4.0.0",
     "enzyme": "^3.10.0",
     "enzyme-adapter-react-16": "^1.14.0",
     "enzyme-to-json": "^3.4.0",

src/config.ts

@@ -1,7 +1,4 @@
-let apiurl = 'https://acmucsd-membership-portal-api.herokuapp.com';
-if (!process.env.NODE_ENV || process.env.NODE_ENV === 'development') {
-  apiurl = 'https://acmucsd-portal-testing.herokuapp.com';
-}
+const apiurl = process.env.REACT_APP_API_URL;
 
 export default {
   API_URL: apiurl,