update npm & typescript

interface/package.json

@@ -6,29 +6,29 @@
     "@material-ui/core": "^4.11.3",
     "@material-ui/icons": "^4.11.2",
     "@types/lodash": "^4.14.168",
-    "@types/node": "^12.20.4",
+    "@types/node": "^14.14.37",
     "@types/react": "^17.0.3",
-    "@types/react-dom": "^17.0.1",
+    "@types/react-dom": "^17.0.3",
     "@types/react-material-ui-form-validator": "^2.1.0",
-    "@types/react-router": "^5.1.12",
-    "@types/react-router-dom": "^5.1.6",
-    "compression-webpack-plugin": "^4.0.0",
+    "@types/react-router": "^5.1.13",
+    "@types/react-router-dom": "^5.1.7",
+    "compression-webpack-plugin": "^7.1.2",
     "express": "^4.17.1",
     "jwt-decode": "^3.1.2",
     "lodash": "^4.17.21",
-    "mime-types": "^2.1.29",
+    "mime-types": "^2.1.30",
     "notistack": "^1.0.5",
-    "parse-ms": "^2.1.0",
-    "react": "^17.0.1",
-    "react-dom": "^17.0.1",
-    "react-dropzone": "^11.3.1",
+    "parse-ms": "^3.0.0",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-dropzone": "^11.3.2",
     "react-form-validator-core": "^1.1.1",
     "react-material-ui-form-validator": "^2.1.4",
     "react-router": "^5.2.0",
     "react-router-dom": "^5.2.0",
-    "react-scripts": "4.0.1",
+    "react-scripts": "4.0.3",
     "sockette": "^2.0.6",
-    "typescript": "4.0.5",
+    "typescript": "4.2.4",
     "zlib": "^1.0.5"
   },
   "scripts": {
@@ -54,9 +54,9 @@
     ]
   },
   "devDependencies": {
-    "concurrently": "^6.0.0",
-    "http-proxy-middleware": "^0.19.1",
-    "nodemon": "^2.0.4",
+    "concurrently": "^6.0.1",
+    "http-proxy-middleware": "^1.1.1",
+    "nodemon": "^2.0.7",
     "npm-run-all": "^4.1.5",
     "react-app-rewired": "^2.1.8"
   }

interface/src/authentication/AuthenticatedRoute.tsx

@@ -5,10 +5,8 @@ import { withSnackbar, WithSnackbarProps } from 'notistack';
 import * as Authentication from './Authentication';
 import { withAuthenticationContext, AuthenticationContextProps, AuthenticatedContext, AuthenticatedContextValue } from './AuthenticationContext';
 
-type ChildComponent = React.ComponentType<RouteComponentProps<any>> | React.ComponentType<any>;
-
 interface AuthenticatedRouteProps extends RouteProps, WithSnackbarProps, AuthenticationContextProps {
-  component: ChildComponent;
+  component: React.ComponentType<RouteComponentProps<any>> | React.ComponentType<any>;
 }
 
 type RenderComponent = (props: RouteComponentProps<any>) => React.ReactNode;
@@ -27,7 +25,7 @@ export class AuthenticatedRoute extends React.Component<AuthenticatedRouteProps>
         );
       }
       Authentication.storeLoginRedirect(location);
-      enqueueSnackbar("Please sign in to continue.", { variant: 'info' });
+      enqueueSnackbar("Please sign in to continue", { variant: 'info' });
       return (
         <Redirect to='/' />
       );

interface/src/authentication/AuthenticationWrapper.tsx

@@ -101,7 +101,7 @@ class AuthenticationWrapper extends React.Component<AuthenticationWrapperProps,
         me: undefined
       }
     });
-    this.props.enqueueSnackbar("You have signed out.", { variant: 'success', });
+    this.props.enqueueSnackbar("You have signed out", { variant: 'success', });
     history.push('/');
   }
 

interface/src/authentication/UnauthenticatedRoute.tsx

@@ -19,7 +19,9 @@ class UnauthenticatedRoute extends Route<UnauthenticatedRouteProps> {
       if (authenticationContext.me) {
         return (<Redirect to={Authentication.fetchLoginRedirect(features)} />);
       }
-      return (<Component {...props} />);
+      if (Component) {
+        return (<Component {...props} />);
+      }
     }
     return (
       <Route {...rest} render={renderComponent} />

interface/src/setupProxy.js

@@ -1,4 +1,4 @@
-const createProxyMiddleware = require('http-proxy-middleware');
+const { createProxyMiddleware } = require('http-proxy-middleware');
 
 module.exports = function (app) {
     app.use(
@@ -6,10 +6,7 @@ module.exports = function (app) {
         createProxyMiddleware({
             target: 'http://localhost:3080',
             secure: false,
-            changeOrigin: true,
-            // pathRewrite: {
-            //     '^/api/settings': '/api/app/settings'
-            // },
+            changeOrigin: true
         })
     );
 };

interface/tsconfig.json

@@ -17,7 +17,7 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "react",
+    "jsx": "react-jsx",
     "noFallthroughCasesInSwitch": true
   },
   "include": [