diff --git a/.eslintrc.js b/.eslintrc.js deleted file mode 100644 index 8dd28fce..00000000 --- a/.eslintrc.js +++ /dev/null @@ -1,72 +0,0 @@ -module.exports = { - parser: '@typescript-eslint/parser', - parserOptions: { - project: './tsconfig.json', - sourceType: 'module', - 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'], - parserOptions: { - ecmaVersion: 2018, - sourceType: 'module', - ecmaFeatures: { - jsx: true, - }, - }, - rules: { - '@typescript-eslint/member-naming': [ - 'error', - { - private: '^__', - protected: '^_', - }, - ], - '@typescript-eslint/no-unused-vars': [ - 'error', - { - vars: 'all', - args: 'after-used', - ignoreRestSiblings: false, - }, - ], - 'import/extensions': [ - 'error', - 'ignorePackages', - { - js: 'never', - jsx: 'never', - ts: 'never', - tsx: 'never', - mjs: 'never', - }, - ], - 'no-param-reassign': ['error', { props: true, ignorePropertyModificationsFor: ['state'] }], - 'no-unused-vars': 'off', - 'react/jsx-filename-extension': [1, { extensions: ['.jsx', '.tsx'] }], - 'react/jsx-props-no-spreading': [0], - 'react/prop-types': [2, { ignore: ['children'] }], - semi: ['error', 'never'], - }, - settings: { - react: { - version: 'detect', - }, - }, -} diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 00000000..2560cafd --- /dev/null +++ b/.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" + } + } +} diff --git a/.gitignore b/.gitignore index 53dd104f..8db8dac1 100644 --- a/.gitignore +++ b/.gitignore @@ -23,7 +23,6 @@ npm-debug.log .rnd .config/htop/htoprc .log -.eslintrc.json .bash_history .bash_logout diff --git a/.husky/.gitignore b/.husky/.gitignore new file mode 100644 index 00000000..31354ec1 --- /dev/null +++ b/.husky/.gitignore @@ -0,0 +1 @@ +_ diff --git a/.husky/pre-commit b/.husky/pre-commit new file mode 100755 index 00000000..d2ae35e8 --- /dev/null +++ b/.husky/pre-commit @@ -0,0 +1,4 @@ +#!/bin/sh +. "$(dirname "$0")/_/husky.sh" + +yarn lint-staged diff --git a/.lintstagedrc b/.lintstagedrc index 59a800fb..7c0feed6 100644 --- a/.lintstagedrc +++ b/.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" ] } \ No newline at end of file diff --git a/.travis.yml b/.travis.yml index e167dc26..11e8e96c 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,7 +1,7 @@ if: tag IS blank language: node_js -node_js: 10 +node_js: 12 cache: yarn: true directories: diff --git a/package.json b/package.json index e1e573e9..02542828 100644 --- a/package.json +++ b/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,12 +20,10 @@ "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, @@ -33,35 +31,37 @@ "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" } } diff --git a/packages/api/.eslintrc.json b/packages/api/.eslintrc.json new file mode 100644 index 00000000..94cd9832 --- /dev/null +++ b/packages/api/.eslintrc.json @@ -0,0 +1,6 @@ +{ + "extends": "../../.eslintrc.json", + "rules": { + "camelcase": "off" + } +} diff --git a/packages/api/package.json b/packages/api/package.json index 5e4c3185..56423f96 100644 --- a/packages/api/package.json +++ b/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" } } diff --git a/packages/api/src/graphql/starwars/index.ts b/packages/api/src/graphql/starwars/index.ts index 854c6bf0..ba67826b 100644 --- a/packages/api/src/graphql/starwars/index.ts +++ b/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' diff --git a/packages/api/src/logger.ts b/packages/api/src/logger.ts index d469a2a1..c4f589ff 100644 --- a/packages/api/src/logger.ts +++ b/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 diff --git a/packages/cypress/.eslintrc.json b/packages/cypress/.eslintrc.json new file mode 100644 index 00000000..be97c53f --- /dev/null +++ b/packages/cypress/.eslintrc.json @@ -0,0 +1,3 @@ +{ + "extends": "../../.eslintrc.json" +} diff --git a/packages/cypress/package.json b/packages/cypress/package.json index 12599eb1..49d4bbef 100644 --- a/packages/cypress/package.json +++ b/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" } } diff --git a/packages/cypress/plugins/index.js b/packages/cypress/plugins/index.js index fd170fba..6a38f99a 100644 --- a/packages/cypress/plugins/index.js +++ b/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 } diff --git a/packages/cypress/tsconfig.json b/packages/cypress/tsconfig.json new file mode 100644 index 00000000..e8982b97 --- /dev/null +++ b/packages/cypress/tsconfig.json @@ -0,0 +1,4 @@ +{ + "extends": "../../tsconfig", + "include": ["fixtures", "integration", "plugins", "support"] +} diff --git a/packages/types/.eslintrc.json b/packages/types/.eslintrc.json new file mode 100644 index 00000000..6d49940c --- /dev/null +++ b/packages/types/.eslintrc.json @@ -0,0 +1,7 @@ +{ + "extends": "../../.eslintrc.json", + "ignorePatterns": ["**/*.d.ts"], + "rules": { + "camelcase": "off" + } +} diff --git a/packages/types/StarWars/Film.ts b/packages/types/StarWars/Film.ts index ea6769a7..23b8bd03 100644 --- a/packages/types/StarWars/Film.ts +++ b/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 diff --git a/packages/types/StarWars/Person.ts b/packages/types/StarWars/Person.ts index 1dd0d104..711aa2cf 100644 --- a/packages/types/StarWars/Person.ts +++ b/packages/types/StarWars/Person.ts @@ -1,4 +1,7 @@ -import { Film, Species, Starship, Vehicle } from '.' +import type { Film } from './Film' +import type { Species } from './Species' +import type { Starship } from './Starship' +import type { Vehicle } from './Vehicle' export interface Person { id: number diff --git a/packages/types/StarWars/Planet.ts b/packages/types/StarWars/Planet.ts index cf8f70b0..30c24494 100644 --- a/packages/types/StarWars/Planet.ts +++ b/packages/types/StarWars/Planet.ts @@ -1,4 +1,5 @@ -import { Film, Person } from '.' +import type { Film } from './Film' +import type { Person } from './Person' export interface Planet { id: number diff --git a/packages/types/StarWars/Species.ts b/packages/types/StarWars/Species.ts index b7500b47..044aafe1 100644 --- a/packages/types/StarWars/Species.ts +++ b/packages/types/StarWars/Species.ts @@ -1,4 +1,5 @@ -import { Film, Person } from '.' +import type { Film } from './Film' +import type { Person } from './Person' export interface Species { id: number diff --git a/packages/types/StarWars/Starship.ts b/packages/types/StarWars/Starship.ts index fd662fc6..7cc191d7 100644 --- a/packages/types/StarWars/Starship.ts +++ b/packages/types/StarWars/Starship.ts @@ -1,4 +1,5 @@ -import { Film, Person } from '.' +import type { Film } from './Film' +import type { Person } from './Person' export interface Starship { id: number diff --git a/packages/types/StarWars/Vehicle.ts b/packages/types/StarWars/Vehicle.ts index 98685048..87339559 100644 --- a/packages/types/StarWars/Vehicle.ts +++ b/packages/types/StarWars/Vehicle.ts @@ -1,4 +1,5 @@ -import { Film, Person } from '.' +import type { Film } from './Film' +import type { Person } from './Person' export interface Vehicle { id: number diff --git a/packages/types/package.json b/packages/types/package.json index b011615a..f7d8206f 100644 --- a/packages/types/package.json +++ b/packages/types/package.json @@ -3,6 +3,6 @@ "version": "4.4.0", "private": true, "scripts": { - "lint": "../../node_modules/.bin/tslint --project tsconfig.json --fix" + "lint": "eslint . --fix --ext .ts,.tsx,.js,.jsx" } } diff --git a/packages/types/tsconfig.json b/packages/types/tsconfig.json index a6683c65..f20e3630 100644 --- a/packages/types/tsconfig.json +++ b/packages/types/tsconfig.json @@ -1,4 +1,4 @@ { "extends": "../../tsconfig", - "include": ["./index.ts", "./StarWars"] + "include": ["./index.ts", "./StarWars", "/typescript/*"] } diff --git a/packages/typography/package.json b/packages/typography/package.json index ad1d0bd9..2bc8101e 100644 --- a/packages/typography/package.json +++ b/packages/typography/package.json @@ -3,10 +3,12 @@ "version": "4.7.11", "private": true, "sideEffects": false, - "scripts": {}, + "scripts": { + "lint": "eslint . --fix --ext .ts,.tsx,.js,.jsx" + }, "main": "index.js", "dependencies": { - "typeface-fira-sans": "0.0.75", + "typeface-fira-sans": "1.1.13", "typography": "0.16.19", "typography-plugin-code": "0.16.19", "typography-theme-de-young": "0.16.19" diff --git a/packages/typography/tsconfig.json b/packages/typography/tsconfig.json index 9285eb38..a16ae858 100644 --- a/packages/typography/tsconfig.json +++ b/packages/typography/tsconfig.json @@ -1,4 +1,4 @@ { "extends": "../../tsconfig", - "include": ["src"] + "include": ["index.ts"] } diff --git a/packages/ui/package.json b/packages/ui/package.json index e15edb39..76da51fc 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -3,8 +3,8 @@ "version": "4.8.7", "private": true, "description": "UI web components for mattailes.net", - "module": "dist/index.mjs", - "main": "dist/index.js", + "module": "dist/index.js", + "main": "dist/index.cjs.js", "types": "dist/types/components.d.ts", "collection": "dist/collection/collection-manifest.json", "files": [ @@ -13,12 +13,13 @@ ], "scripts": { "build-library": "stencil build", + "lint": "eslint ./src --fix --ext .ts,.tsx,.js,.jsx", "start": "stencil build --dev --watch --serve", "test": "stencil test --spec --e2e", "test.watch": "stencil test --spec --e2e --watchAll" }, "dependencies": { - "@stencil/core": "1.17.4", + "@stencil/core": "2.5.2", "@stencil/sass": "1.4.1", "sanitize.css": "12.0.1" }, diff --git a/packages/ui/stencil.config.ts b/packages/ui/stencil.config.ts index 9cabbf36..b4b55093 100644 --- a/packages/ui/stencil.config.ts +++ b/packages/ui/stencil.config.ts @@ -1,3 +1,4 @@ +/* eslint-disable import/prefer-default-export */ import { Config } from '@stencil/core' import { sass } from '@stencil/sass' diff --git a/packages/ui/tsconfig.json b/packages/ui/tsconfig.json index dbb9afea..1affc7c8 100644 --- a/packages/ui/tsconfig.json +++ b/packages/ui/tsconfig.json @@ -23,6 +23,6 @@ "target": "es2017", "types": [] }, - "include": ["src/**/*.ts", "src/**/*.tsx", "stencil.config.ts"], + "include": ["src/**/*.ts", "src/**/*.tsx"], "exclude": ["node_modules"] } diff --git a/packages/website/.eslintrc.json b/packages/website/.eslintrc.json new file mode 100644 index 00000000..a5b02ff3 --- /dev/null +++ b/packages/website/.eslintrc.json @@ -0,0 +1,4 @@ +{ + "extends": "../../.eslintrc.json", + "ignorePatterns": ["**/*.d.ts"] +} diff --git a/packages/website/package.json b/packages/website/package.json index 67a1000b..45dd1bbd 100644 --- a/packages/website/package.json +++ b/packages/website/package.json @@ -9,7 +9,7 @@ "coverage": "react-scripts test --env=jsdom --coverage", "deploy": "firebase deploy --token $FIREBASE_TOKEN", "eject": "react-scripts eject", - "lint": "../../node_modules/.bin/tslint --project tsconfig.json --fix", + "lint": "eslint ./src --fix --ext .ts,.tsx,.js,.jsx", "start": "react-scripts start", "test:debug": "react-scripts --inspect-brk test --runInBand --env=jsdom", "test": "react-scripts test --env=jsdom" @@ -24,25 +24,21 @@ ] }, "devDependencies": { - "@types/react-helmet": "6.1.0", - "@typescript-eslint/eslint-plugin": "4.20.0", - "@typescript-eslint/parser": "4.20.0", + "@emotion/jest": "11.1.0", "enzyme": "3.11.0", - "enzyme-adapter-react-16": "1.15.6", - "eslint-plugin-react-hooks": "4.2.0", - "jest-emotion": "10.0.32", + "enzyme-adapter-react-16": "1.15.5", "jest-enzyme": "7.1.2", "nock": "13.0.11", "raf": "3.4.1", - "react-test-renderer": "16.14.0", + "react-test-renderer": "17.0.1", "redux-mock-store": "1.5.4", - "source-map-explorer": "2.5.2", - "typescript": "4.2.3", - "webpack-bundle-analyzer": "3.9.0" + "source-map-explorer": "2.5.1", + "webpack-bundle-analyzer": "4.3.0" }, "dependencies": { - "@emotion/core": "10.1.1", - "@emotion/styled": "10.0.27", + "@emotion/core": "11.0.0", + "@emotion/react": "11.1.5", + "@emotion/styled": "11.3.0", "@mattailes/types": "^4.4.0", "@mattailes/typography": "^4.7.11", "@mattailes/ui": "^4.8.7", @@ -51,16 +47,16 @@ "cross-fetch": "3.1.4", "dotenv": "8.2.0", "facepaint": "1.2.1", - "firebase": "7.24.0", + "firebase": "8.3.3", "graphql": "15.5.0", "graphql.macro": "1.4.2", "prop-types": "15.7.2", - "react": "16.14.0", + "react": "17.0.2", "react-apollo": "3.1.5", - "react-dom": "16.14.0", + "react-dom": "17.0.2", "react-helmet": "6.1.0", "react-redux": "7.2.3", - "react-scripts": "3.4.4", + "react-scripts": "4.0.3", "redux": "4.0.5", "redux-devtools-extension": "2.13.9", "redux-saga": "1.1.3", diff --git a/packages/website/src/components/App.tsx b/packages/website/src/components/App.tsx index 5b1c9c32..ec5bbbca 100644 --- a/packages/website/src/components/App.tsx +++ b/packages/website/src/components/App.tsx @@ -1,4 +1,4 @@ -import React from 'react' +import { lazy, Suspense } from 'react' import { Router } from '@reach/router' @@ -8,18 +8,18 @@ import { Navigation } from './Navigation' import NotFound from './NotFound' import { UserProvider } from '../context/User' -const AsyncHome = React.lazy(() => import('../modules/home/Home')) -const AsyncStarWars = React.lazy(() => import('../modules/starWarsApp/StarWarsApp')) -const AsyncTodo = React.lazy(() => import('../modules/todoApp/TodoApp')) -const AsyncGameOfLife = React.lazy(() => import('../modules/gameOfLife/GameOfLife')) -const AsyncGallery = React.lazy(() => import('../modules/gallery/Gallery')) -const AsyncMashin = React.lazy(() => import('../modules/mashin/Mashin')) +const AsyncHome = lazy(() => import('../modules/home/Home')) +const AsyncStarWars = lazy(() => import('../modules/starWarsApp/StarWarsApp')) +const AsyncTodo = lazy(() => import('../modules/todoApp/TodoApp')) +const AsyncGameOfLife = lazy(() => import('../modules/gameOfLife/GameOfLife')) +const AsyncGallery = lazy(() => import('../modules/gallery/Gallery')) +const AsyncMashin = lazy(() => import('../modules/mashin/Mashin')) const App: React.FunctionComponent = () => ( - }> + }> @@ -29,7 +29,7 @@ const App: React.FunctionComponent = () => ( - + ) diff --git a/packages/website/src/components/Authentication/EntryPoint.tsx b/packages/website/src/components/Authentication/EntryPoint.tsx index 216c35ba..67152f02 100644 --- a/packages/website/src/components/Authentication/EntryPoint.tsx +++ b/packages/website/src/components/Authentication/EntryPoint.tsx @@ -1,4 +1,4 @@ -import React, { useContext, useEffect } from 'react' +import { useContext, useEffect } from 'react' import styled from '@emotion/styled' import firebase from 'firebase/app' diff --git a/packages/website/src/components/Error.tsx b/packages/website/src/components/Error.tsx index ebd26dbd..2b5593e6 100644 --- a/packages/website/src/components/Error.tsx +++ b/packages/website/src/components/Error.tsx @@ -1,6 +1,4 @@ -import React from 'react' - -const Error: React.SFC = () => ( +const Error: React.FunctionComponent = () => (

Something horrible has happened.

big ole error diff --git a/packages/website/src/components/ErrorBoundary.tsx b/packages/website/src/components/ErrorBoundary.tsx index d35713e9..c9c2524b 100644 --- a/packages/website/src/components/ErrorBoundary.tsx +++ b/packages/website/src/components/ErrorBoundary.tsx @@ -1,5 +1,3 @@ -import React from 'react' - import Error from './Error' interface Props { diff --git a/packages/website/src/components/Loading.tsx b/packages/website/src/components/Loading.tsx index 51c0df47..3b66f7eb 100644 --- a/packages/website/src/components/Loading.tsx +++ b/packages/website/src/components/Loading.tsx @@ -1,5 +1,3 @@ -import React from 'react' - -const Loading: React.SFC = () =>
Loading...
+const Loading: React.FunctionComponent = () =>
Loading...
export default Loading diff --git a/packages/website/src/components/Navigation/Navigation.tsx b/packages/website/src/components/Navigation/Navigation.tsx index cbc96529..ce228409 100644 --- a/packages/website/src/components/Navigation/Navigation.tsx +++ b/packages/website/src/components/Navigation/Navigation.tsx @@ -1,5 +1,3 @@ -import React from 'react' - import styled from '@emotion/styled' import { Link } from '@reach/router' @@ -16,28 +14,26 @@ const AvatarImg = styled.img` margin: 0; ` -const Navigation: React.FunctionComponent<{}> = () => { - return ( - - - Home - - - Todo - - - Star Wars GraphQL - - - Conway's Game of Life - - - Gallery - - - - - ) -} +const Navigation: React.FunctionComponent<{}> = () => ( + + + Home + + + Todo + + + Star Wars GraphQL + + + Conway's Game of Life + + + Gallery + + + + +) export default Navigation diff --git a/packages/website/src/components/Navigation/Submenu.tsx b/packages/website/src/components/Navigation/Submenu.tsx index 79375065..c0059052 100644 --- a/packages/website/src/components/Navigation/Submenu.tsx +++ b/packages/website/src/components/Navigation/Submenu.tsx @@ -1,4 +1,4 @@ -import React, { useRef, useState } from 'react' +import { useRef, useState } from 'react' import PropTypes from 'prop-types' import styled from '@emotion/styled' diff --git a/packages/website/src/components/Navigation/index.ts b/packages/website/src/components/Navigation/index.ts index d92eefb7..77e12dd7 100644 --- a/packages/website/src/components/Navigation/index.ts +++ b/packages/website/src/components/Navigation/index.ts @@ -1 +1,2 @@ +/* eslint-disable import/prefer-default-export */ export { default as Navigation } from './Navigation' diff --git a/packages/website/src/components/NotFound.tsx b/packages/website/src/components/NotFound.tsx index a8e13dba..38e38de2 100644 --- a/packages/website/src/components/NotFound.tsx +++ b/packages/website/src/components/NotFound.tsx @@ -1,5 +1,3 @@ -import React from 'react' - import styled from '@emotion/styled' import { RouteComponentProps } from '@reach/router' import { Helmet } from 'react-helmet' diff --git a/packages/website/src/components/__tests__/App.test.tsx b/packages/website/src/components/__tests__/App.test.tsx index 06b5a069..67d4df87 100644 --- a/packages/website/src/components/__tests__/App.test.tsx +++ b/packages/website/src/components/__tests__/App.test.tsx @@ -1,4 +1,3 @@ -import React from 'react' import ReactDOM from 'react-dom' import App from '../App' diff --git a/packages/website/src/context/User.tsx b/packages/website/src/context/User.tsx index 49c0454a..d91b7aee 100644 --- a/packages/website/src/context/User.tsx +++ b/packages/website/src/context/User.tsx @@ -1,6 +1,6 @@ -import React, { useReducer } from 'react' +import { useReducer, createContext } from 'react' -export const UserContext = React.createContext(null) +export const UserContext = createContext(null) export interface User { displayName?: string @@ -23,7 +23,7 @@ const reducer = (state: User, action: { type: string; payload: User }) => { } } -export const UserProvider: React.SFC = ({ children }) => { +export const UserProvider: React.FunctionComponent = ({ children }) => { const [state, dispatch] = useReducer(reducer, {}) const value = { state, dispatch } diff --git a/packages/website/src/index.tsx b/packages/website/src/index.tsx index 3ca5bcc3..0c221f6a 100644 --- a/packages/website/src/index.tsx +++ b/packages/website/src/index.tsx @@ -1,5 +1,3 @@ -import React from 'react' - import typography from '@mattailes/typography' import { defineCustomElements } from '@mattailes/ui/dist/loader' import ApolloClient from 'apollo-boost' diff --git a/packages/website/src/modules/gallery/Gallery.tsx b/packages/website/src/modules/gallery/Gallery.tsx index e180563c..486c0a7c 100644 --- a/packages/website/src/modules/gallery/Gallery.tsx +++ b/packages/website/src/modules/gallery/Gallery.tsx @@ -1,4 +1,4 @@ -import React, { useState } from 'react' +import { useState } from 'react' import { RouteComponentProps } from '@reach/router' import styled from '@emotion/styled' @@ -15,7 +15,7 @@ const Container = styled.div` align-items: center; ` -const Gallery: React.SFC = () => { +const Gallery: React.FunctionComponent = () => { const [nextPageToken, setNextPageToken] = useState('') const [images, loading, error, pageToken] = useImagesFromStorage(nextPageToken) diff --git a/packages/website/src/modules/gallery/ImageGrid.tsx b/packages/website/src/modules/gallery/ImageGrid.tsx index 463e0101..9034945b 100644 --- a/packages/website/src/modules/gallery/ImageGrid.tsx +++ b/packages/website/src/modules/gallery/ImageGrid.tsx @@ -1,5 +1,4 @@ /* eslint-disable react/prop-types */ -import React from 'react' import styled from '@emotion/styled' import { ImageState } from './gallery.types' @@ -36,15 +35,13 @@ const Image = styled.img` } ` -const ImageGrid: React.FunctionComponent = ({ images }) => { - return ( - - {images.map(({ thumbPath }) => ( - gallery item - ))} - - ) -} +const ImageGrid: React.FunctionComponent = ({ images }) => ( + + {images.map(({ thumbPath }) => ( + gallery item + ))} + +) ImageGrid.defaultProps = { images: [], diff --git a/packages/website/src/modules/gameOfLife/GameOfLife.tsx b/packages/website/src/modules/gameOfLife/GameOfLife.tsx index 64c66e81..783cb15d 100644 --- a/packages/website/src/modules/gameOfLife/GameOfLife.tsx +++ b/packages/website/src/modules/gameOfLife/GameOfLife.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from 'react' +import { useEffect, useState } from 'react' import PropTypes from 'prop-types' import { connect } from 'react-redux' import { RouteComponentProps } from '@reach/router' diff --git a/packages/website/src/modules/gameOfLife/components/Controls.tsx b/packages/website/src/modules/gameOfLife/components/Controls.tsx index 5cb53c13..40f52732 100644 --- a/packages/website/src/modules/gameOfLife/components/Controls.tsx +++ b/packages/website/src/modules/gameOfLife/components/Controls.tsx @@ -1,4 +1,3 @@ -import React from 'react' import PropTypes from 'prop-types' import styled from '@emotion/styled' diff --git a/packages/website/src/modules/gameOfLife/components/GameBoard.tsx b/packages/website/src/modules/gameOfLife/components/GameBoard.tsx index 09f32fd6..214e15b9 100644 --- a/packages/website/src/modules/gameOfLife/components/GameBoard.tsx +++ b/packages/website/src/modules/gameOfLife/components/GameBoard.tsx @@ -1,4 +1,3 @@ -import React from 'react' import PropTypes from 'prop-types' import styled from '@emotion/styled' diff --git a/packages/website/src/modules/gameOfLife/components/GameBoardCell.tsx b/packages/website/src/modules/gameOfLife/components/GameBoardCell.tsx index ec0f130a..53f0ca6a 100644 --- a/packages/website/src/modules/gameOfLife/components/GameBoardCell.tsx +++ b/packages/website/src/modules/gameOfLife/components/GameBoardCell.tsx @@ -1,5 +1,3 @@ -import React from 'react' - import styled from '@emotion/styled' interface CellProps { @@ -20,6 +18,6 @@ const StyledCell = styled.div` } ` -const GameBoardCell: React.SFC = (props) => +const GameBoardCell: React.FunctionComponent = (props) => export default GameBoardCell diff --git a/packages/website/src/modules/gameOfLife/components/GameBoardRow.tsx b/packages/website/src/modules/gameOfLife/components/GameBoardRow.tsx index a3407c90..c35fc945 100644 --- a/packages/website/src/modules/gameOfLife/components/GameBoardRow.tsx +++ b/packages/website/src/modules/gameOfLife/components/GameBoardRow.tsx @@ -1,4 +1,4 @@ -import React, { SyntheticEvent } from 'react' +import { SyntheticEvent } from 'react' import PropTypes from 'prop-types' import styled from '@emotion/styled' diff --git a/packages/website/src/modules/gameOfLife/index.ts b/packages/website/src/modules/gameOfLife/index.ts index f8ef5b17..beac0a77 100644 --- a/packages/website/src/modules/gameOfLife/index.ts +++ b/packages/website/src/modules/gameOfLife/index.ts @@ -1 +1,2 @@ +/* eslint-disable import/prefer-default-export */ export { default as GameOfLife } from './GameOfLife' diff --git a/packages/website/src/modules/home/Home.tsx b/packages/website/src/modules/home/Home.tsx index 86c21b4e..a9113872 100644 --- a/packages/website/src/modules/home/Home.tsx +++ b/packages/website/src/modules/home/Home.tsx @@ -1,4 +1,3 @@ -import React from 'react' import { RouteComponentProps } from '@reach/router' import styled from '@emotion/styled' @@ -18,7 +17,7 @@ const ArticleHeader = styled.header` font-size: 1.1rem; ` -const Home: React.SFC = () => ( +const Home: React.FunctionComponent = () => (
My name is Matthew Ailes and this is my website.
diff --git a/packages/website/src/modules/home/__tests__/Home.test.tsx b/packages/website/src/modules/home/__tests__/Home.test.tsx index 6b8dbfb8..ed7b2ac2 100644 --- a/packages/website/src/modules/home/__tests__/Home.test.tsx +++ b/packages/website/src/modules/home/__tests__/Home.test.tsx @@ -1,5 +1,3 @@ -import * as React from 'react' - import { shallow } from 'enzyme' import Home from '../Home' diff --git a/packages/website/src/modules/home/index.ts b/packages/website/src/modules/home/index.ts index f164169e..4a4f50bf 100644 --- a/packages/website/src/modules/home/index.ts +++ b/packages/website/src/modules/home/index.ts @@ -1 +1,2 @@ +/* eslint-disable import/prefer-default-export */ export { default as Home } from './Home' diff --git a/packages/website/src/modules/mashin/Mashin.tsx b/packages/website/src/modules/mashin/Mashin.tsx index 85f91315..254c5e3c 100644 --- a/packages/website/src/modules/mashin/Mashin.tsx +++ b/packages/website/src/modules/mashin/Mashin.tsx @@ -1,4 +1,3 @@ -import React from 'react' import { RouteComponentProps } from '@reach/router' import styled from '@emotion/styled' @@ -18,23 +17,21 @@ const Container = styled.div` interface Props extends RouteComponentProps {} -const Mashin: React.FC = () => { - return ( - <> -
MASHIN
- -