[major] react 17 and other major dependency upgrades

.eslintrc.json

@@ -0,0 +1,65 @@
+{
+  "parser": "@typescript-eslint/parser",
+  "parserOptions": {
+    "project": "./tsconfig.json",
+    "sourceType": "module",
+    "ecmaVersion": 2018,
+    "ecmaFeatures": {
+      "jsx": true
+    }
+  },
+  "env": {
+    "browser": true,
+    "node": true,
+    "jest": true,
+    "cypress/globals": true
+  },
+  "extends": [
+    "airbnb",
+    "plugin:react/recommended",
+    "plugin:import/typescript",
+    "prettier",
+    "prettier/@typescript-eslint",
+    "prettier/react",
+    "prettier/vue"
+  ],
+  "plugins": ["@typescript-eslint", "prettier", "cypress", "@emotion/eslint-plugin"],
+  "rules": {
+    "@typescript-eslint/no-unused-vars": [
+      "error",
+      {
+        "vars": "all",
+        "args": "after-used",
+        "ignoreRestSiblings": false
+      }
+    ],
+    "no-shadow": "off",
+    "@typescript-eslint/no-shadow": ["error"],
+    "no-use-before-define": "off",
+    "@typescript-eslint/no-use-before-define": ["error"],
+    "import/extensions": [
+      "error",
+      "ignorePackages",
+      {
+        "js": "never",
+        "jsx": "never",
+        "ts": "never",
+        "tsx": "never",
+        "mjs": "never"
+      }
+    ],
+    "no-param-reassign": ["error", { "props": true, "ignorePropertyModificationsFor": ["state"] }],
+    "no-undef": "off",
+    "no-unused-vars": "off",
+    "react/jsx-filename-extension": [1, { "extensions": [".jsx", ".tsx"] }],
+    "react/jsx-props-no-spreading": [0],
+    "react/prop-types": [2, { "ignore": ["children"] }],
+    "react/react-in-jsx-scope": "off",
+    "semi": ["error", "never"]
+  },
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
+  }
+}

.gitignore

@@ -23,7 +23,6 @@ npm-debug.log
 .rnd
 .config/htop/htoprc
 .log
-.eslintrc.json
 
 .bash_history
 .bash_logout

.husky/.gitignore

@@ -0,0 +1 @@
+_

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+yarn lint-staged

.lintstagedrc

@@ -1,15 +1,15 @@
 {
   "*.{js,jsx,ts,tsx}": [
     "prettier --write",
-    "eslint --fix",
+    "eslint --fix"
   ],
   "*.vue": [
-    "prettier --write",
+    "prettier --write"
   ],
   "*.json": [
-    "prettier --write",
+    "prettier --write"
   ],
   "*.{css,scss,sass}": [
-    "prettier --write",
+    "prettier --write"
   ]
 }

.travis.yml

@@ -1,7 +1,7 @@
 if: tag IS blank
 
 language: node_js
-node_js: 10
+node_js: 12
 cache:
   yarn: true
   directories:

package.json

@@ -4,7 +4,7 @@
     "packages/*"
   ],
   "resolutions": {
-    "babel-jest": "24.9.0"
+    "babel-jest": "26.6.3"
   },
   "scripts": {
     "clean": "yarn clean:build && yarn clean:node_modules",
@@ -20,48 +20,48 @@
     "build": "lerna run build",
     "coverage": "lerna run coverage",
     "coverage:cleanup": "lerna run coverage:cleanup",
-    "storybook": "yarn --cwd packages/ui/ storybook"
-  },
-  "husky": {
-    "hooks": {
-      "pre-commit": "lint-staged"
-    }
+    "storybook": "yarn --cwd packages/ui/ storybook",
+    "lint": "lerna run lint",
+    "prepare": "husky install",
+    "lint-staged": "lint-staged"
   },
   "prettier": {
     "printWidth": 100,
     "semi": false,
     "singleQuote": true
   },
   "devDependencies": {
+    "@emotion/eslint-plugin": "11.2.0",
     "@types/enzyme": "3.10.8",
-    "@types/jest": "25.2.3",
-    "@types/lodash.merge": "4.6.6",
-    "@types/node": "10.17.56",
+    "@types/jest": "26.0.22",
+    "@types/lodash": "4.14.168",
+    "@types/node": "12.12.6",
+    "@types/pino": "6.3.7",
     "@types/reach__router": "1.3.7",
-    "@types/react": "16.14.5",
-    "@types/react-dom": "16.9.12",
-    "@types/react-helmet": "5.0.16",
+    "@types/react": "17.0.3",
+    "@types/react-dom": "17.0.3",
+    "@types/react-helmet": "6.1.1",
     "@types/react-redux": "7.1.16",
-    "@types/react-test-renderer": "16.9.5",
+    "@types/react-test-renderer": "17.0.1",
     "@types/typography": "0.16.3",
     "@types/webpack-env": "1.16.0",
-    "@typescript-eslint/eslint-plugin": "2.34.0",
-    "@typescript-eslint/parser": "2.34.0",
-    "eslint": "6.8.0",
+    "@typescript-eslint/eslint-plugin": "4.21.0",
+    "@typescript-eslint/parser": "4.21.0",
+    "eslint": "7.24.0",
     "eslint-config-airbnb": "18.2.1",
-    "eslint-config-prettier": "6.15.0",
+    "eslint-config-prettier": "7.1.0",
     "eslint-plugin-cypress": "2.11.2",
     "eslint-plugin-import": "2.22.1",
     "eslint-plugin-jsx-a11y": "6.4.1",
     "eslint-plugin-prettier": "3.3.1",
-    "eslint-plugin-react": "7.23.1",
-    "eslint-plugin-react-hooks": "2.5.1",
-    "husky": "4.3.8",
+    "eslint-plugin-react": "7.23.2",
+    "eslint-plugin-react-hooks": "4.2.0",
+    "husky": "^6.0.0",
     "lerna": "3.22.1",
     "lint-staged": "10.5.4",
     "prettier": "2.2.1",
     "serve": "11.3.2",
     "start-server-and-test": "1.12.1",
-    "typescript": "3.9.9"
+    "typescript": "4.2.4"
   }
 }

packages/api/.eslintrc.json

@@ -0,0 +1,6 @@
+{
+  "extends": "../../.eslintrc.json",
+  "rules": {
+    "camelcase": "off"
+  }
+}

packages/api/package.json

@@ -8,31 +8,33 @@
     ]
   },
   "engines": {
-    "node": "10"
+    "node": "12"
   },
   "scripts": {
     "build": "tsc && babel --delete-dir-on-start -d build/ --verbose src/ --extensions '.ts,.tsx'",
-    "deploy": "firebase deploy --only functions --token $FIREBASE_TOKEN"
+    "deploy": "firebase deploy --only functions --token $FIREBASE_TOKEN",
+    "lint": "eslint ./src --fix --ext .ts,.tsx,.js,.jsx"
   },
   "dependencies": {
     "@babel/cli": "7.13.14",
-    "@babel/core": "7.13.14",
-    "@babel/plugin-transform-runtime": "7.13.10",
+    "@babel/core": "7.13.15",
+    "@babel/plugin-transform-runtime": "7.13.15",
     "@babel/polyfill": "7.12.1",
-    "@babel/preset-env": "7.13.12",
+    "@babel/preset-env": "7.13.15",
     "@babel/preset-typescript": "7.13.0",
     "@babel/runtime": "7.13.10",
-    "@google-cloud/firestore": "4.9.8",
+    "@google-cloud/firestore": "4.9.9",
     "apollo-link": "1.2.14",
     "apollo-link-http": "1.5.17",
     "apollo-server-cloud-functions": "2.22.2",
     "apollo-server-fastify": "2.22.2",
     "cross-fetch": "3.1.4",
     "dataloader": "2.0.0",
-    "date-fns": "2.19.0",
+    "date-fns": "2.20.1",
     "firebase-admin": "9.6.0",
     "firebase-functions": "3.13.2",
     "graphql": "15.5.0",
-    "lodash.merge": "4.6.2"
+    "lodash": "4.17.21",
+    "pino": "6.11.2"
   }
 }

packages/api/src/graphql/starwars/index.ts

@@ -1,5 +1,5 @@
 import { gql, makeExecutableSchema } from 'apollo-server-cloud-functions'
-import merge from 'lodash.merge'
+import { merge } from 'lodash'
 
 import { filmResolvers, FilmTypeDef } from './Film'
 import { personResolvers, PersonTypeDef } from './Person'

packages/api/src/logger.ts

@@ -1,8 +1,27 @@
-/* eslint-disable no-console */
+import pino from 'pino'
 
-const logger = {
-  error: console.error,
-  log: console.log,
+const pinoSeverity = {
+  trace: 'DEBUG',
+  debug: 'DEBUG',
+  info: 'INFO',
+  warn: 'WARNING',
+  error: 'ERROR',
+  fatal: 'CRITICAL',
 }
 
+const logger = pino({
+  messageKey: 'message',
+  formatters: {
+    level(label, number) {
+      return {
+        severity: pinoSeverity[label] || pinoSeverity.info,
+        level: number,
+      }
+    },
+    log(message) {
+      return { message }
+    },
+  },
+})
+
 export default logger

packages/cypress/.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "../../.eslintrc.json"
+}

packages/cypress/package.json

@@ -4,9 +4,10 @@
   "private": true,
   "scripts": {
     "cypress:open": "cypress open",
-    "cypress:run": "cypress run"
+    "cypress:run": "cypress run",
+    "lint": "eslint . --fix --ext .ts,.tsx,.js,.jsx"
   },
   "devDependencies": {
-    "cypress": "5.6.0"
+    "cypress": "6.2.1"
   }
 }

packages/cypress/plugins/index.js

@@ -11,7 +11,7 @@
 // This function is called when a project is opened or re-opened (e.g. due to
 // the project's config changing)
 
-module.exports = (on, config) => {
+module.exports = () => {
   // `on` is used to hook into various events Cypress emits
   // `config` is the resolved Cypress config
 }

packages/cypress/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": "../../tsconfig",
+  "include": ["fixtures", "integration", "plugins", "support"]
+}

packages/types/.eslintrc.json

@@ -0,0 +1,7 @@
+{
+  "extends": "../../.eslintrc.json",
+  "ignorePatterns": ["**/*.d.ts"],
+  "rules": {
+    "camelcase": "off"
+  }
+}

packages/types/StarWars/Film.ts

@@ -1,4 +1,8 @@
-import { Person, Planet, Species, Starship, Vehicle } from '.'
+import type { Person } from './Person'
+import type { Planet } from './Planet'
+import type { Species } from './Species'
+import type { Starship } from './Starship'
+import type { Vehicle } from './Vehicle'
 
 export interface Film {
   id: number