Merge pull request #133 from provectus/chore/update_react

[CHORE] Update dependencies. Clean linter warnings

Author: workshur

kafka-ui-react-app/.gitignore

@@ -26,4 +26,6 @@ yarn-error.log*
 .idea
 
 # generated sources
-src/generated-sources
+src/generated-sources
+
+.eslintcache

kafka-ui-react-app/.nvmrc

@@ -0,0 +1 @@
+v12.13.1

kafka-ui-react-app/package-lock.json

@@ -3,24 +3,25 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@types/react-datepicker": "^3.0.2",
+    "@types/react-datepicker": "^3.1.1",
     "@types/uuid": "^8.3.0",
-    "bulma": "^0.8.0",
+    "bulma": "^0.8.2",
     "bulma-switch": "^2.0.0",
     "classnames": "^2.2.6",
-    "date-fns": "^2.14.0",
+    "date-fns": "^2.16.1",
+    "eslint-import-resolver-node": "^0.3.4",
     "eslint-import-resolver-typescript": "^2.3.0",
     "immer": "^6.0.5",
-    "lodash": "^4.17.15",
+    "lodash": "^4.17.20",
     "pretty-ms": "^6.0.1",
-    "react": "^16.12.0",
-    "react-datepicker": "^3.0.0",
-    "react-dom": "^16.12.0",
-    "react-hook-form": "^4.5.5",
+    "react": "^17.0.1",
+    "react-datepicker": "^3.3.0",
+    "react-dom": "^17.0.1",
+    "react-hook-form": "^4.10.2",
     "react-json-tree": "^0.13.0",
-    "react-multi-select-component": "^2.0.12",
-    "react-redux": "^7.1.3",
-    "react-router-dom": "^5.1.2",
+    "react-multi-select-component": "^2.0.14",
+    "react-redux": "^7.2.2",
+    "react-router-dom": "^5.2.0",
     "redux": "^4.0.5",
     "redux-thunk": "^2.3.0",
     "reselect": "^4.0.0",
@@ -66,22 +67,22 @@
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^4.2.4",
-    "@testing-library/react": "^9.3.2",
+    "@testing-library/react": "^9.5.0",
     "@testing-library/user-event": "^7.1.2",
-    "@types/classnames": "^2.2.9",
-    "@types/jest": "^24.0.25",
-    "@types/lodash": "^4.14.149",
-    "@types/node": "^12.12.24",
-    "@types/react": "^16.9.17",
-    "@types/react-dom": "^16.9.0",
-    "@types/react-redux": "^7.1.5",
-    "@types/react-router-dom": "^5.1.3",
+    "@types/classnames": "^2.2.11",
+    "@types/jest": "^24.9.1",
+    "@types/lodash": "^4.14.165",
+    "@types/node": "^12.19.8",
+    "@types/react": "^17.0.0",
+    "@types/react-dom": "^17.0.0",
+    "@types/react-redux": "^7.1.11",
+    "@types/react-router-dom": "^5.1.6",
     "@types/redux": "^3.6.0",
     "@types/redux-thunk": "^2.1.0",
-    "@typescript-eslint/eslint-plugin": "^4.8.2",
-    "@typescript-eslint/parser": "^4.8.2",
+    "@typescript-eslint/eslint-plugin": "^4.9.0",
+    "@typescript-eslint/parser": "^4.9.0",
     "dotenv": "^8.2.0",
-    "eslint": "^6.8.0",
+    "eslint": "^7.14.0",
     "eslint-config-airbnb": "^18.2.1",
     "eslint-config-airbnb-typescript": "^12.0.0",
     "eslint-config-prettier": "^6.15.0",
@@ -93,11 +94,11 @@
     "esprint": "^0.6.0",
     "husky": "^4.3.0",
     "json-server": "^0.15.1",
-    "lint-staged": "^10.5.1",
-    "node-sass": "^4.13.1",
-    "prettier": "^2.1.2",
-    "react-scripts": "3.4.4",
-    "typescript": "~3.7.4"
+    "lint-staged": "^10.5.2",
+    "node-sass": "^4.14.1",
+    "prettier": "^2.2.1",
+    "react-scripts": "4.0.1",
+    "typescript": "~4.1.2"
   },
   "proxy": "http://localhost:8080"
 }

kafka-ui-react-app/package.json

@@ -37,7 +37,9 @@ const CustomParamSelect: React.FC<Props> = ({
     return valid || 'Custom Parameter must be unique';
   };
 
-  const onChange = (inputName: string) => (event: any) => {
+  const onChange = (inputName: string) => (
+    event: React.ChangeEvent<HTMLSelectElement>
+  ) => {
     triggerValidation(inputName);
     onNameChange(index, event.target.value);
   };

kafka-ui-react-app/src/components/Topics/shared/Form/CustomParams/CustomParamSelect.tsx

@@ -35,9 +35,10 @@ const CustomParams: React.FC<Props> = ({ isSubmitting, config }) => {
       )
     : {};
 
-  const [formCustomParams, setFormCustomParams] = React.useState<
-    TopicFormCustomParams
-  >({
+  const [
+    formCustomParams,
+    setFormCustomParams,
+  ] = React.useState<TopicFormCustomParams>({
     byIndex,
     allIndexes: Object.keys(byIndex),
   });

kafka-ui-react-app/src/components/Topics/shared/Form/CustomParams/CustomParams.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-type Callback = () => any;
+type Callback = () => void;
 
 const useInterval = (callback: Callback, delay: number) => {
   const savedCallback = React.useRef<Callback>();

kafka-ui-react-app/src/lib/hooks/useInterval.ts

@@ -0,0 +1,6 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "jsx": "react-jsxdev"
+  }
+}

kafka-ui-react-app/tsconfig.dev.json

@@ -17,8 +17,9 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "react",
-    "baseUrl": "src"
+    "jsx": "react-jsx",
+    "baseUrl": "src",
+    "noFallthroughCasesInSwitch": true
   },
   "include": [
     "src"