Typescript support implemented

monkey/monkey_island/cc/ui/package.json

@@ -27,85 +27,93 @@
     "not dead"
   ],
   "devDependencies": {
-    "@babel/cli": "^7.8.4",
-    "@babel/core": "^7.9.6",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.9.6",
-    "@babel/preset-env": "^7.9.6",
-    "@babel/preset-react": "^7.9.0",
-    "@babel/runtime": "^7.9.6",
+    "@babel/cli": "^7.12.1",
+    "@babel/core": "^7.12.3",
+    "@babel/plugin-proposal-class-properties": "^7.12.1",
+    "@babel/plugin-transform-runtime": "^7.12.1",
+    "@babel/preset-env": "^7.12.1",
+    "@babel/preset-react": "^7.12.5",
+    "@babel/runtime": "^7.12.5",
     "babel-eslint": "^10.1.0",
-    "babel-loader": "^8.0.0",
-    "css-loader": "^3.5.0",
+    "babel-loader": "^8.2.1",
+    "copyfiles": "^2.4.0",
+    "css-loader": "^3.6.0",
     "eslint": "^6.8.0",
     "eslint-loader": "^4.0.1",
-    "eslint-plugin-react": "^7.19.0",
+    "eslint-plugin-react": "^7.21.5",
     "file-loader": "^1.1.11",
     "glob": "^7.1.6",
     "html-loader": "^0.5.5",
     "html-webpack-plugin": "^3.2.0",
     "minimist": "^1.2.5",
+    "node-sass": "^4.14.1",
     "null-loader": "^0.1.1",
     "react-addons-test-utils": "^15.6.2",
     "rimraf": "^2.7.1",
-    "style-loader": "^0.22.1",
-    "copyfiles": "^2.2.0",
-    "url-loader": "^1.1.2",
     "sass-loader": "^7.3.1",
-    "node-sass": "^4.14.1",
-    "webpack": "^4.43.0",
-    "webpack-cli": "^3.3.11",
-    "stylelint": "^13.3.3",
+    "style-loader": "^0.22.1",
+    "stylelint": "^13.7.2",
+    "url-loader": "^1.1.2",
+    "webpack": "^4.44.2",
+    "webpack-cli": "^3.3.12",
     "webpack-dev-server": "^3.11.0"
   },
   "dependencies": {
-    "@emotion/core": "^10.0.34",
-    "@fortawesome/fontawesome-svg-core": "^1.2.29",
-    "@fortawesome/free-regular-svg-icons": "^5.13.1",
-    "@fortawesome/free-solid-svg-icons": "^5.13.1",
-    "@fortawesome/react-fontawesome": "^0.1.11",
+    "@emotion/core": "^10.1.1",
+    "@fortawesome/fontawesome-svg-core": "^1.2.32",
+    "@fortawesome/free-regular-svg-icons": "^5.15.1",
+    "@fortawesome/free-solid-svg-icons": "^5.15.1",
+    "@fortawesome/react-fontawesome": "^0.1.12",
     "@kunukn/react-collapse": "^1.2.7",
-    "bootstrap": "^4.5.2",
+    "@types/jest": "^26.0.15",
+    "@types/node": "^14.14.9",
+    "@types/react": "^16.9.56",
+    "@types/react-dom": "^16.9.9",
+    "bootstrap": "^4.5.3",
     "classnames": "^2.2.6",
-    "core-js": "^3.6.5",
+    "core-js": "^3.7.0",
     "d3": "^5.14.1",
     "downloadjs": "^1.4.7",
     "fetch": "^1.1.0",
     "file-saver": "^2.0.2",
-    "filepond": "^4.19.2",
+    "filepond": "^4.23.1",
     "jwt-decode": "^2.2.0",
     "lodash": "^4.17.20",
     "marked": "^2.0.0",
     "normalize.css": "^8.0.0",
-    "npm": "^6.14.7",
+    "npm": "^6.14.8",
     "pluralize": "^7.0.0",
     "prop-types": "^15.7.2",
     "rainge": "^1.0.1",
     "rc-progress": "^2.6.1",
-    "react": "^16.12.0",
-    "react-bootstrap": "^1.3.0",
+    "react": "^16.14.0",
+    "react-bootstrap": "^1.4.0",
     "react-copy-to-clipboard": "^5.0.2",
     "react-data-components": "^1.2.0",
     "react-desktop-notification": "^1.0.9",
     "react-dimensions": "^1.3.0",
-    "react-dom": "^16.12.0",
+    "react-dom": "^16.14.0",
     "react-event-timeline": "^1.6.3",
     "react-fa": "^5.0.0",
-    "react-filepond": "^7.0.1",
+    "react-filepond": "^7.1.0",
     "react-graph-vis": "^1.0.5",
-    "react-hot-loader": "^4.12.20",
-    "react-json-tree": "^0.12.0",
+    "react-hot-loader": "^4.13.0",
+    "react-json-tree": "^0.12.1",
     "react-jsonschema-form-bs4": "^1.7.1",
-    "react-particles-js": "^3.3.0",
+    "react-particles-js": "^3.4.1",
     "react-redux": "^5.1.2",
-    "react-router-dom": "^4.3.1",
+    "react-router-dom": "^5.2.0",
     "react-spinners": "^0.9.0",
+    "react-step-wizard": "^5.3.5",
     "react-table": "^6.10.3",
     "react-toggle": "^4.1.1",
     "react-tooltip-lite": "^1.12.0",
     "redux": "^4.0.4",
     "sha3": "^2.1.3",
-    "snyk": "^1.373.1"
+    "snyk": "^1.427.0",
+    "source-map-loader": "^1.1.2",
+    "ts-loader": "^8.0.11",
+    "typescript": "^4.1.2"
   },
   "snyk": true
 }

monkey/monkey_island/cc/ui/tsconfig.json

@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "sourceMap": true,
+    "module": "commonjs",
+    "target": "es5",
+    "jsx": "react",
+    "esModuleInterop": true
+  },
+  "include": [
+    "src"
+  ],
+  "compileOnSave": false
+}

monkey/monkey_island/cc/ui/webpack.config.js

@@ -4,6 +4,13 @@ const HtmlWebPackPlugin = require("html-webpack-plugin");
 module.exports = {
   module: {
     rules: [
+      { test: /\.tsx?$/,
+        loader: "ts-loader"
+      },
+      {
+        test: /\.js$/,
+        loader: "source-map-loader"
+      },
       {
         test: /\.js$/,
         exclude: /node_modules/,
@@ -54,6 +61,7 @@ module.exports = {
       }
     ]
   },
+  devtool: "source-map",
   plugins: [
     new HtmlWebPackPlugin({
       template: "./src/index.html",
@@ -61,7 +69,7 @@ module.exports = {
     })
   ],
   resolve: {
-    extensions: ['.js', '.jsx', '.css'],
+    extensions: ['.ts', '.tsx', '.js', '.jsx', '.css'],
     modules: [
       'node_modules',
       path.resolve(__dirname, 'src/')