Merge pull request #21 from JMaio/ts-convert

Convert to TypeScript

.eslintignore

@@ -0,0 +1,3 @@
+src/registerServiceWorker.js
+src/serviceWorker.js
+public/clientDetect.js

.eslintrc

@@ -0,0 +1,52 @@
+// https://eslintconfig.dev/cra/typescript-prettier
+// https://dev.to/benweiser/how-to-set-up-eslint-typescript-prettier-with-create-react-app-3675
+// -----------
+// https://www.robertcooper.me/using-eslint-and-prettier-in-a-typescript-project
+{
+    "env": {
+        "browser": true,
+        // "es2021": true,
+        "jasmine": true,
+        "jest": true,
+        "es6": true
+    },
+    "extends": [
+        "eslint:recommended",
+        // "plugin:react/recommended",
+        "plugin:@typescript-eslint/recommended",
+        "react-app", // Uses the recommended rules Create React App
+        "prettier/@typescript-eslint",
+        "plugin:prettier/recommended"
+        // "plugin:@typescript-eslint/recommended", // Uses the recommended rules from @typescript-eslint/eslint-plugin
+        // "prettier/@typescript-eslint", // Uses eslint-config-prettier to disable ESLint rules from @typescript-eslint/eslint-plugin that would conflict with prettier
+        // "plugin:prettier/recommended" // Should be last in the list. Enables eslint-plugin-prettier and eslint-config-prettier. This will display prettier errors as ESLint errors. Make sure this is always the last configuration in the extends array.
+    ],
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+        "ecmaFeatures": {
+            "jsx": true // Allows for the parsing of JSX
+        },
+        "ecmaVersion": 2020,
+        "sourceType": "module"
+    },
+    "plugins": [
+        "react",
+        "@typescript-eslint",
+        "prettier"
+    ],
+    "settings": {
+        "react": {
+            "pragma": "React",
+            "version": "detect"
+        }
+    },
+    "rules": {
+        "prettier/prettier": [
+            "error",
+            {
+                "singleQuote": true
+            }
+        ]
+        // "semi": "error"
+    }
+}

.github/workflows/nodejs.yml

@@ -34,9 +34,7 @@ name: Yarn CI
 
 on:
   push:
-    branches: [ master ]
   pull_request:
-    branches: [ master ]
 
 jobs:
   build:

.prettierrc

@@ -0,0 +1,7 @@
+{
+    "semi": true,
+    "trailingComma": "all",
+    "singleQuote": true,
+    "printWidth": 90,
+    "tabWidth": 2
+}

.vscode/settings.json

@@ -4,5 +4,10 @@
         "**/.project": true,
         "**/.settings": true,
         "**/.factorypath": true
-    }
+    },
+    "editor.codeActionsOnSave": {
+        "source.fixAll.eslint": true,
+        // "source.organizeImports": true,
+    },
+    "editor.tabSize": 2,
 }

package.json

@@ -8,29 +8,40 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "^4.0.0-alpha.44",
     "@mdi/js": "^5.6.55",
-    "complex.js": "^2.0.11",
+    "@types/jest": "^26.0.14",
+    "@types/lodash": "^4.14.162",
+    "@types/node": "^14.11.2",
+    "@types/react": "^16.9.49",
+    "@types/react-dom": "^16.9.8",
     "gl-matrix": "^3.1.0",
-    "jshint": "^2.10.2",
     "lodash": "^4.17.19",
-    "preval.macro": "^5.0.0",
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
-    "react-draggable": "^4.0.3",
     "react-scripts": "3.4.3",
     "react-spring": "^8.0.27",
     "react-use-gesture": "^7.0.16",
     "twgl.js": "^4.14.2",
     "typeface-roboto": "^0.0.75",
     "typescript": "^4.0.3",
-    "vec-la": "^1.5.0"
+    "vec-la-fp": "^1.9.0"
   },
   "scripts": {
     "start": "react-scripts start",
     "build": "react-scripts build",
+    "build:localhost": "cross-env PUBLIC_URL='.' react-scripts build",
     "test": "react-scripts test",
+    "test:ci": "cross-env CI=true yarn test",
     "eject": "react-scripts eject",
     "predeploy": "yarn run build",
-    "deploy": "gh-pages -d build"
+    "deploy": "gh-pages -d build",
+    "lint": "eslint \"./src/**.{js,jsx,ts,tsx}\"",
+    "lint:fix": "eslint \"./src/**/*.{js,jsx,ts,tsx}\" --fix"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "pretty-quick --staged --patern \"./src/**/*.{js,jsx,ts,tsx}\"",
+      "pre-push": "yarn run test:ci"
+    }
   },
   "eslintConfig": {
     "extends": "react-app"
@@ -48,8 +59,23 @@
     ]
   },
   "devDependencies": {
+    "@types/preval.macro": "^3.0.0",
+    "@typescript-eslint/eslint-plugin": "4.0.1",
+    "@typescript-eslint/parser": "4.0.1",
+    "cross-env": "^7.0.2",
+    "eslint-config-prettier": "^6.11.0",
+    "eslint-config-react-app": "^5.2.1",
+    "eslint-plugin-prettier": "^3.1.4",
+    "eslint-plugin-react": "^7.21.1",
+    "eslint-plugin-react-hooks": "^4.1.2",
     "gh-pages": "^3.1.0",
+    "husky": "3.1.0",
     "jest-canvas-mock": "^2.2.0",
-    "jest-webgl-canvas-mock": "^0.2.3"
+    "jest-webgl-canvas-mock": "^0.2.3",
+    "jshint": "^2.10.2",
+    "prettier": "^2.1.2",
+    "pretty-quick": "^3.0.2",
+    "preval.macro": "^5.0.0",
+    "serve": "^11.3.2"
   }
 }