Bump loader-utils@2.0.3 and react-dev-utils@12.0.1

required a bump of fork-ts-checker-webpack-plugin@6.5.3 which needed
some adjustments to the webpack.config.

services/idp/package.json

@@ -72,22 +72,22 @@
   },
   "dependencies": {
     "@fontsource/roboto": "^5.0.8",
-    "@material-ui/core": "^4.12.3",
-    "@material-ui/icons": "^4.11.2",
+    "@material-ui/core": "^4.12.4",
+    "@material-ui/icons": "^4.11.3",
     "@testing-library/jest-dom": "^6.1.2",
-    "@testing-library/react": "^11.1.0",
+    "@testing-library/react": "^11.2.7",
     "@testing-library/user-event": "^14.4.3",
     "@types/jest": "^29.5.4",
-    "@types/node": "^20.5.7",
-    "@types/react": "^17.0.2",
-    "@types/react-dom": "^17.0.2",
-    "@types/react-redux": "^7.1.19",
+    "@types/node": "^20.5.9",
+    "@types/react": "^17.0.65",
+    "@types/react-dom": "^17.0.20",
+    "@types/react-redux": "^7.1.26",
     "@types/redux-logger": "^3.0.9",
     "axios": "^1.5.0",
     "classnames": "^2.3.2",
     "i18next": "^23.4.6",
     "i18next-browser-languagedetector": "^7.1.0",
-    "i18next-http-backend": "^2.2.1",
+    "i18next-http-backend": "^2.2.2",
     "i18next-resources-to-backend": "^1.1.4",
     "kpop": "https://download.kopano.io/community/kapp:/kpop-2.2.0.tgz",
     "query-string": "^8.1.0",
@@ -95,8 +95,8 @@
     "react-app-polyfill": "^2.0.0",
     "react-dom": "^17.0.2",
     "react-i18next": "^12.3.1",
-    "react-redux": "^8.0.5",
-    "react-router": "^5.2.1",
+    "react-redux": "^8.1.2",
+    "react-router": "^5.3.4",
     "react-router-dom": "5.2.1",
     "redux": "^4.2.1",
     "redux-logger": "^3.0.6",
@@ -106,35 +106,35 @@
   },
   "devDependencies": {
     "@babel/core": "7.22.11",
-    "@typescript-eslint/eslint-plugin": "^4.5.0",
-    "@typescript-eslint/parser": "^4.5.0",
+    "@typescript-eslint/eslint-plugin": "^4.33.0",
+    "@typescript-eslint/parser": "^4.33.0",
     "babel-eslint": "^10.1.0",
     "babel-loader": "8.3.0",
     "babel-plugin-named-asset-import": "^0.3.8",
-    "babel-preset-react-app": "^10.0.0",
+    "babel-preset-react-app": "^10.0.1",
     "case-sensitive-paths-webpack-plugin": "2.4.0",
     "cldr": "^7.4.1",
     "css-loader": "5.2.7",
     "dotenv": "16.3.1",
     "dotenv-expand": "10.0.0",
-    "eslint": "^7.11.0",
+    "eslint": "^7.32.0",
     "eslint-config-react-app": "^6.0.0",
     "eslint-loader": "^4.0.2",
-    "eslint-plugin-flowtype": "^5.2.0",
+    "eslint-plugin-flowtype": "^5.10.0",
     "eslint-plugin-i18next": "^6.0.3",
     "eslint-plugin-import": "^2.28.1",
-    "eslint-plugin-jest": "^24.1.0",
+    "eslint-plugin-jest": "^24.7.0",
     "eslint-plugin-jsx-a11y": "^6.7.1",
     "eslint-plugin-react": "^7.33.2",
-    "eslint-plugin-react-hooks": "^4.2.0",
-    "eslint-plugin-testing-library": "^3.9.2",
-    "eslint-webpack-plugin": "^2.5.2",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-testing-library": "^3.10.2",
+    "eslint-webpack-plugin": "^2.7.0",
     "file-loader": "6.2.0",
     "html-webpack-plugin": "4.5.2",
     "i18next-conv": "^14.0.0",
     "i18next-parser": "^8.7.0",
     "jest": "29.6.4",
-    "license-checker-rseidelsohn": "^3.1.0",
+    "license-checker-rseidelsohn": "^3.3.0",
     "mini-css-extract-plugin": "1.6.2",
     "optimize-css-assets-webpack-plugin": "6.0.1",
     "pnp-webpack-plugin": "1.7.0",
@@ -143,12 +143,12 @@
     "postcss-normalize": "10.0.1",
     "postcss-preset-env": "9.1.2",
     "postcss-safe-parser": "6.0.0",
-    "react-dev-utils": "^11.0.3",
+    "react-dev-utils": "^12.0.1",
     "resolve": "1.22.4",
     "resolve-url-loader": "^5.0.0",
-    "sass-loader": "^10.0.5",
+    "sass-loader": "^10.4.1",
     "source-map-explorer": "^2.5.3",
-    "typescript": "^4.1.2",
+    "typescript": "^4.9.5",
     "url-loader": "4.1.1",
     "webpack": "4.46.0",
     "webpack-manifest-plugin": "4.1.1",

services/idp/ui_config/webpack.config.js

@@ -15,7 +15,6 @@ const safePostCssParser = require('postcss-safe-parser');
 const { WebpackManifestPlugin } = require('webpack-manifest-plugin');
 const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
 const WorkboxWebpackPlugin = require('workbox-webpack-plugin');
-const WatchMissingNodeModulesPlugin = require('react-dev-utils/WatchMissingNodeModulesPlugin');
 const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
 const getCSSModuleLocalIdent = require('react-dev-utils/getCSSModuleLocalIdent');
 const paths = require('./paths');
@@ -23,7 +22,6 @@ const modules = require('./modules');
 const getClientEnvironment = require('./env');
 const ModuleNotFoundPlugin = require('react-dev-utils/ModuleNotFoundPlugin');
 const ForkTsCheckerWebpackPlugin = require('react-dev-utils/ForkTsCheckerWebpackPlugin');
-const typescriptFormatter = require('react-dev-utils/typescriptFormatter');
 
 const postcssNormalize = require('postcss-normalize');
 
@@ -567,12 +565,6 @@ module.exports = function(webpackEnv) {
       // a plugin that prints an error when you attempt to do this.
       // See https://github.com/facebook/create-react-app/issues/240
       isEnvDevelopment && new CaseSensitivePathsPlugin(),
-      // If you require a missing module and then `npm install` it, you still have
-      // to restart the development server for Webpack to discover it. This plugin
-      // makes the discovery automatic so you don't have to restart.
-      // See https://github.com/facebook/create-react-app/issues/186
-      isEnvDevelopment &&
-        new WatchMissingNodeModulesPlugin(paths.appNodeModules),
       isEnvProduction &&
         new MiniCssExtractPlugin({
           // Options similar to the same options in webpackOptions.output
@@ -630,29 +622,33 @@ module.exports = function(webpackEnv) {
       // TypeScript type checking
       useTypeScript &&
         new ForkTsCheckerWebpackPlugin({
-          typescript: resolve.sync('typescript', {
-            basedir: paths.appNodeModules,
-          }),
           async: isEnvDevelopment,
-          useTypescriptIncrementalApi: true,
-          checkSyntacticErrors: true,
-          resolveModuleNameModule: process.versions.pnp
-            ? `${__dirname}/pnpTs.js`
-            : undefined,
-          resolveTypeReferenceDirectiveModule: process.versions.pnp
-            ? `${__dirname}/pnpTs.js`
-            : undefined,
-          tsconfig: paths.appTsConfig,
-          reportFiles: [
-            'ui/**',
-            '!**/__tests__/**',
-            '!**/?(*.)(spec|test).*',
-            '!**/src/setupProxy.*',
-            '!**/src/setupTests.*',
-          ],
-          silent: true,
-          // The formatter is invoked directly in WebpackDevServerUtils during development
-          formatter: isEnvProduction ? typescriptFormatter : undefined,
+          typescript: {
+            typescriptPath: resolve.sync('typescript', {
+              basedir: paths.appNodeModules,
+            }),
+            configFile: paths.appTsConfig,
+            configOverwrite: {
+              compilerOptions: {
+                incremental: true,
+	      },
+            },
+            diagnosticOptions: {
+              syntactic: true,
+	    }
+	  },
+          issue: {
+            include: [{file: 'ui/**'}],
+            exclude: [
+             {file: '!**/__tests__/**'},
+             {file: '!**/?(*.)(spec|test).*'},
+             {file: '!**/src/setupProxy.*'},
+             {file: '!**/src/setupTests.*'},
+            ],
+          },
+          logger: {
+            infrastructure: 'silent',
+          },
         }),
     ].filter(Boolean),
     // Some libraries import Node modules but don't use them in the browser.