generator-jhipster 7.1.0 → 7.4.0

package/generators/client/templates/react/jest.conf.js.ejs

@@ -1,6 +1,7 @@
 const tsconfig = require('./tsconfig.json');
 
 module.exports = {
+  testEnvironment: 'jsdom',
   transform: {
     '^.+\\.tsx?$': 'ts-jest'
   },
@@ -25,11 +26,16 @@ module.exports = {
   ],
   setupFiles: ['<rootDir>/<%= CLIENT_MAIN_SRC_DIR %>app/setup-tests.ts'],
   globals: {
+<%_ if (enableTranslation) { _%>
+    I18N_HASH: 'generated_hash',
+<%_ } _%>
     'ts-jest': {
       tsconfig: './tsconfig.test.json',
       compiler: 'typescript',
       diagnostics: false
-    }
+    },
+    ...require('./webpack/environment'),
+    DEVELOPMENT: false,
   }
 };
 

package/generators/client/templates/react/package.json

@@ -1,92 +1,89 @@
 {
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "1.2.35",
-    "@fortawesome/free-solid-svg-icons": "5.15.3",
-    "@fortawesome/react-fontawesome": "0.1.14",
-    "@reduxjs/toolkit": "1.6.0",
-    "axios": "0.21.1",
-    "bootstrap": "4.6.0",
-    "bootswatch": "5.0.1",
-    "loaders.css": "0.1.2",
+    "@fortawesome/fontawesome-svg-core": "1.2.36",
+    "@fortawesome/free-solid-svg-icons": "5.15.4",
+    "@fortawesome/react-fontawesome": "0.1.16",
+    "@reduxjs/toolkit": "1.6.2",
+    "axios": "0.24.0",
+    "bootstrap": "5.1.3",
+    "bootswatch": "5.1.3",
     "lodash": "4.17.21",
     "path-browserify": "1.0.1",
-    "react": "17.0.1",
-    "react-dom": "17.0.1",
-    "react-hook-form": "7.8.8",
-    "react-hot-loader": "4.13.0",
-    "react-jhipster": "0.16.2",
+    "react": "17.0.2",
+    "react-dom": "17.0.2",
+    "react-hook-form": "7.19.5",
+    "react-jhipster": "0.18.0",
     "react-loadable": "5.5.0",
-    "react-redux": "7.2.4",
-    "react-redux-loading-bar": "5.0.0",
-    "react-router-dom": "5.2.0",
-    "react-toastify": "7.0.4",
+    "react-redux": "7.2.6",
+    "react-redux-loading-bar": "5.0.2",
+    "react-router-dom": "5.3.0",
+    "react-toastify": "8.1.0",
     "react-transition-group": "4.4.2",
-    "reactstrap": "8.9.0",
-    "redux": "4.1.0",
-    "redux-thunk": "2.3.0",
+    "reactstrap": "9.0.1",
+    "redux": "4.1.2",
+    "redux-thunk": "2.4.0",
     "sonar-scanner": "3.1.0",
-    "tslib": "2.3.0",
+    "tslib": "2.3.1",
     "uuid": "8.3.2"
   },
   "devDependencies": {
-    "@testing-library/react": "11.2.7",
-    "@types/jest": "26.0.23",
-    "@types/lodash": "4.14.170",
-    "@types/node": "15.12.2",
-    "@types/react": "17.0.11",
-    "@types/react-dom": "17.0.7",
-    "@types/react-redux": "7.1.16",
-    "@types/react-router-dom": "5.1.7",
+    "@testing-library/react": "12.1.2",
+    "@types/jest": "27.0.3",
+    "@types/lodash": "4.14.177",
+    "@types/node": "16.11.8",
+    "@types/react": "17.0.35",
+    "@types/react-dom": "17.0.11",
+    "@types/react-redux": "7.1.20",
+    "@types/react-router-dom": "5.3.2",
     "@types/redux": "3.6.31",
-    "@types/webpack-env": "1.16.0",
-    "@typescript-eslint/eslint-plugin": "4.27.0",
-    "@typescript-eslint/parser": "4.27.0",
-    "autoprefixer": "10.2.6",
-    "browser-sync": "2.26.14",
+    "@types/webpack-env": "1.16.3",
+    "@typescript-eslint/eslint-plugin": "5.4.0",
+    "@typescript-eslint/parser": "5.4.0",
+    "autoprefixer": "10.4.0",
+    "browser-sync": "2.27.7",
     "browser-sync-webpack-plugin": "2.3.0",
-    "copy-webpack-plugin": "9.0.0",
-    "core-js": "3.14.0",
+    "copy-webpack-plugin": "9.1.0",
+    "core-js": "3.19.1",
     "cross-env": "7.0.3",
-    "css-loader": "5.2.6",
-    "css-minimizer-webpack-plugin": "3.0.1",
-    "eslint": "7.28.0",
+    "css-loader": "6.5.1",
+    "css-minimizer-webpack-plugin": "3.1.4",
+    "eslint": "8.2.0",
     "eslint-config-prettier": "8.3.0",
-    "eslint-plugin-react": "7.24.0",
-    "eslint-webpack-plugin": "2.5.4",
-    "file-loader": "6.2.0",
-    "fork-ts-checker-webpack-plugin": "6.2.10",
-    "html-webpack-plugin": "5.3.1",
+    "eslint-plugin-react": "7.27.0",
+    "eslint-webpack-plugin": "3.1.1",
+    "folder-hash": "4.0.1",
+    "fork-ts-checker-webpack-plugin": "6.4.0",
+    "html-webpack-plugin": "5.5.0",
     "identity-obj-proxy": "3.0.0",
-    "jest": "27.0.4",
-    "jest-junit": "12.2.0",
+    "jest": "27.3.1",
+    "jest-junit": "13.0.0",
     "jest-sonar-reporter": "2.0.0",
     "json-loader": "0.5.7",
     "merge-jsons-webpack-plugin": "1.0.21",
-    "mini-css-extract-plugin": "1.6.0",
-    "postcss-loader": "6.1.0",
+    "mini-css-extract-plugin": "2.4.5",
+    "postcss-loader": "6.2.0",
+    "postcss-rtlcss": "3.5.0",
     "react-infinite-scroller": "1.2.4",
     "redux-mock-store": "1.5.4",
     "rimraf": "3.0.2",
-    "sass": "1.35.1",
-    "sass-loader": "12.1.0",
+    "sass": "1.43.4",
+    "sass-loader": "12.3.0",
     "simple-progress-webpack-plugin": "2.0.0",
-    "sinon": "11.1.1",
+    "sinon": "12.0.1",
     "source-map-loader": "3.0.0",
     "sourcemap-istanbul-instrumenter-loader": "0.2.0",
-    "stripcomment-loader": "0.1.0",
-    "style-loader": "2.0.0",
-    "swagger-ui-dist": "3.50.0",
-    "terser-webpack-plugin": "5.1.3",
+    "style-loader": "3.3.1",
+    "swagger-ui-dist": "4.1.0",
+    "terser-webpack-plugin": "5.2.5",
     "thread-loader": "3.0.4",
-    "to-string-loader": "1.1.6",
-    "ts-jest": "27.0.3",
-    "ts-loader": "9.2.3",
-    "typescript": "4.3.3",
-    "webpack": "5.39.0",
-    "webpack-cli": "4.7.2",
-    "webpack-dev-server": "3.11.2",
+    "ts-jest": "27.0.7",
+    "ts-loader": "9.2.6",
+    "typescript": "4.5.2",
+    "webpack": "5.64.1",
+    "webpack-cli": "4.9.1",
+    "webpack-dev-server": "4.5.0",
     "webpack-merge": "5.8.0",
-    "webpack-notifier": "1.13.0",
-    "workbox-webpack-plugin": "6.1.5"
+    "webpack-notifier": "1.14.1",
+    "workbox-webpack-plugin": "6.4.1"
   }
 }

package/generators/client/templates/react/package.json.ejs

@@ -19,7 +19,7 @@
 {
   "name": "<%= dasherizedBaseName %>",
   "version": "0.0.1-SNAPSHOT",
-  "description": "Description for <%= baseName %>",
+  "description": "<%= projectDescription %>",
   "private": true,
   "license": "UNLICENSED",
   "cacheDirectories": [
@@ -36,13 +36,11 @@
     "bootswatch": "<%= dependabotPackageJson.dependencies['bootswatch'] %>",
 <%_ } _%>
     "dayjs": "<%= dependabotPackageJson.dependencies['dayjs'] %>",
-    "loaders.css": "<%= dependabotPackageJson.dependencies['loaders.css'] %>",
     "lodash": "<%= dependabotPackageJson.dependencies['lodash'] %>",
     "path-browserify": "<%= dependabotPackageJson.dependencies['path-browserify'] %>",
     "react": "<%= dependabotPackageJson.dependencies['react'] %>",
     "react-dom": "<%= dependabotPackageJson.dependencies['react-dom'] %>",
     "react-hook-form": "<%= dependabotPackageJson.dependencies['react-hook-form'] %>",
-    "react-hot-loader": "<%= dependabotPackageJson.dependencies['react-hot-loader'] %>",
     "react-jhipster": "<%= dependabotPackageJson.dependencies['react-jhipster'] %>",
     "react-loadable": "<%= dependabotPackageJson.dependencies['react-loadable'] %>",
     "react-redux": "<%= dependabotPackageJson.dependencies['react-redux'] %>",
@@ -103,7 +101,6 @@
     "eslint-config-prettier": "<%= dependabotPackageJson.devDependencies['eslint-config-prettier'] %>",
     "eslint-plugin-react": "<%= dependabotPackageJson.devDependencies['eslint-plugin-react'] %>",
     "eslint-webpack-plugin": "<%= dependabotPackageJson.devDependencies['eslint-webpack-plugin'] %>",
-    "file-loader": "<%= dependabotPackageJson.devDependencies['file-loader'] %>",
     "fork-ts-checker-webpack-plugin": "<%= dependabotPackageJson.devDependencies['fork-ts-checker-webpack-plugin'] %>",
 <%_ if (!skipJhipsterDependencies) { _%>
     "generator-jhipster": "<%= packagejs.version %>",
@@ -117,11 +114,8 @@
     "jest-junit": "<%= dependabotPackageJson.devDependencies['jest-junit'] %>",
     "jest-sonar-reporter": "<%= dependabotPackageJson.devDependencies['jest-sonar-reporter'] %>",
     "json-loader": "<%= dependabotPackageJson.devDependencies['json-loader'] %>",
-<%_ if (!skipCommitHook) { _%>
-    "husky": "<%= dependabotPackageJson.devDependencies['husky'] %>",
-    "lint-staged": "<%= dependabotPackageJson.devDependencies['lint-staged'] %>",
-<%_ } _%>
 <%_ if (enableTranslation) { _%>
+    "folder-hash": "<%= dependabotPackageJson.devDependencies['folder-hash'] %>",
     "merge-jsons-webpack-plugin": "<%= dependabotPackageJson.devDependencies['merge-jsons-webpack-plugin'] %>",
 <%_ } _%>
     "mini-css-extract-plugin": "<%= dependabotPackageJson.devDependencies['mini-css-extract-plugin'] %>",
@@ -129,6 +123,9 @@
     "mocha": "7.1.2",
 <%_ } _%>
     "postcss-loader": "<%= dependabotPackageJson.devDependencies['postcss-loader'] %>",
+<%_ if (enableI18nRTL) { _%>
+    "postcss-rtlcss": "<%= dependabotPackageJson.devDependencies['postcss-rtlcss'] %>",
+<%_ } _%>
     "prettier": "<%= dependabotPackageJson.devDependencies['prettier'] %>",
 <%_ if (!skipServer) { _%>
     "prettier-plugin-java": "<%= dependabotPackageJson.devDependencies['prettier-plugin-java'] %>",
@@ -146,12 +143,10 @@
     "sinon": "<%= dependabotPackageJson.devDependencies['sinon'] %>",
     "source-map-loader": "<%= dependabotPackageJson.devDependencies['source-map-loader'] %>",
     "sourcemap-istanbul-instrumenter-loader": "<%= dependabotPackageJson.devDependencies['sourcemap-istanbul-instrumenter-loader'] %>",
-    "stripcomment-loader": "<%= dependabotPackageJson.devDependencies['stripcomment-loader'] %>",
     "style-loader": "<%= dependabotPackageJson.devDependencies['style-loader'] %>",
     "swagger-ui-dist": "<%= dependabotPackageJson.devDependencies['swagger-ui-dist'] %>",
     "terser-webpack-plugin": "<%= dependabotPackageJson.devDependencies['terser-webpack-plugin'] %>",
     "thread-loader": "<%= dependabotPackageJson.devDependencies['thread-loader'] %>",
-    "to-string-loader": "<%= dependabotPackageJson.devDependencies['to-string-loader'] %>",
     "ts-jest": "<%= dependabotPackageJson.devDependencies['ts-jest'] %>",
     "ts-loader": "<%= dependabotPackageJson.devDependencies['ts-loader'] %>",
 <%_ if (protractorTests) { _%>
@@ -159,9 +154,6 @@
 <%_ } _%>
 <%_ if (cypressTests) { _%>
     "cypress": "<%= dependabotPackageJson.devDependencies['cypress'] %>",
-  <%_ if (authenticationTypeOauth2) { _%>
-    "puppeteer": "<%= dependabotPackageJson.devDependencies['puppeteer'] %>",
-  <%_ } _%>
 <%_ } _%>
     "typescript": "<%= dependabotPackageJson.devDependencies['typescript'] %>",
 <%_ if (protractorTests) { _%>
@@ -188,18 +180,18 @@
     "cleanup": "rimraf <%= DIST_DIR %>",
     "clean-www": "rimraf <%= DIST_DIR %>app/{src,<%= BUILD_DIR %>}",
 <%_ if (protractorTests && !cypressTests) { _%>
-    "e2e": "<%= clientPackageManager %> run e2e:protractor",
-    "e2e:headless": "<%= clientPackageManager %> run e2e:protractor:headless",
+    "e2e": "<%= clientPackageManager %> run e2e:protractor --",
+    "e2e:headless": "<%= clientPackageManager %> run e2e:protractor:headless --",
 <%_ } else if ((cypressTests && !protractorTests) || (protractorTests && cypressTests)) {  _%>
-    "e2e": "<%= clientPackageManager %> run e2e:cypress",
-    "e2e:headless": "<%= clientPackageManager %> run e2e:cypress:headless",
+    "e2e": "<%= clientPackageManager %> run e2e:cypress:headed --",
+    "e2e:headless": "<%= clientPackageManager %> run e2e:cypress --",
 <%_ } _%>
 <%_ if (protractorTests) { _%>
-    "e2e:protractor:headless": "<%= clientPackageManager %> run e2e:protractor",
+    "e2e:protractor:headless": "<%= clientPackageManager %> run e2e:protractor --",
     "e2e:protractor": "protractor <%= TEST_SRC_DIR %>protractor.conf.js",
 <%_ } _%>
 <%_ if (cypressTests) { _%>
-    "e2e:cypress:headless": "<%= clientPackageManager %> run e2e:cypress -- --headless",
+    "e2e:cypress:headed": "<%= clientPackageManager %> run e2e:cypress -- --headed",
     "e2e:cypress": "cypress run --browser chrome --record ${CYPRESS_ENABLE_RECORD:-false}",
     "cypress": "cypress open",
 <%_ } _%>
@@ -209,24 +201,23 @@
 <%_ } _%>
     "jest": "jest --coverage --logHeapUsage --maxWorkers=2 --config jest.conf.js",
     "jest:update": "<%= clientPackageManager %> run jest -- --updateSnapshot",
-    "start": "<%= clientPackageManager %> run webapp:dev",
+    "start": "<%= clientPackageManager %> run webapp:dev --",
     "start-tls": "<%= clientPackageManager %> run webapp:dev -- --env.tls",
 <%_ if (skipServer) { _%>
     "sonar": "sonar-scanner",
 <%_ } _%>
     "pretest": "<%= clientPackageManager %> run lint",
-    "test": "<%= clientPackageManager %> run jest",
-    "test-ci": "<%= clientPackageManager %> run lint && <%= clientPackageManager %> run jest:update",
+    "test": "<%= clientPackageManager %> run jest --",
+    "test-ci": "<%= clientPackageManager %> run lint && <%= clientPackageManager %> run jest:update --",
     "test:watch": "<%= clientPackageManager %> run jest -- --watch",
-    "webapp:build": "<%= clientPackageManager %> run clean-www && <%= clientPackageManager %> run webapp:build:dev",
-    "webapp:build:dev": "<%= clientPackageManager %> run webpack -- --config webpack/webpack.dev.js --env stats=minimal",
-    "webapp:build:prod": "<%= clientPackageManager %> run webpack -- --config webpack/webpack.prod.js --progress=profile",
-    "webapp:dev": "<%= clientPackageManager %> run webpack-dev-server -- --config webpack/webpack.dev.js --inline --env stats=minimal",
-    "webapp:dev-verbose": "<%= clientPackageManager %> run webpack-dev-server -- --config webpack/webpack.dev.js --inline --progress=profile --env stats=normal",
-    "webapp:prod": "<%= clientPackageManager %> run clean-www && <%= clientPackageManager %> run webapp:build:prod",
-    "webapp:test": "<%= clientPackageManager %> run test",
-    "webpack-dev-server": "npm run webpack -- serve",
-    "webpack": "node --max_old_space_size=4096 node_modules/webpack/bin/webpack.js"
+    "webapp:build": "<%= clientPackageManager %> run clean-www && <%= clientPackageManager %> run webapp:build:dev --",
+    "webapp:build:dev": "webpack --config webpack/webpack.dev.js --env stats=minimal",
+    "webapp:build:prod": "webpack --config webpack/webpack.prod.js --progress=profile",
+    "webapp:dev": "<%= clientPackageManager %> run webpack-dev-server -- --config webpack/webpack.dev.js --env stats=minimal",
+    "webapp:dev-verbose": "<%= clientPackageManager %> run webpack-dev-server -- --config webpack/webpack.dev.js --progress=profile --env stats=normal",
+    "webapp:prod": "<%= clientPackageManager %> run clean-www && <%= clientPackageManager %> run webapp:build:prod --",
+    "webapp:test": "<%= clientPackageManager %> run test --",
+    "webpack-dev-server": "webpack serve"
   },
   "jestSonar": {
     "reportPath": "<%= BUILD_DIR %>test-results/jest",

package/generators/client/templates/react/src/main/webapp/app/app.scss.ejs

@@ -25,9 +25,6 @@
 <%_ if (!clientThemeNone) { _%>
 @import "~bootswatch/dist/<%= clientTheme %>/bootswatch";
 <%_ } _%>
-<%_ if (enableI18nRTL) { _%>
-@import '../content/scss/rtl.scss';
-<%_ } _%>
 body {
 <%_ if (clientThemeNone) { _%>
   background: #fafafa;

package/generators/client/templates/react/src/main/webapp/app/app.tsx.ejs

@@ -24,7 +24,6 @@ import React, { useEffect } from 'react';
 import { Card } from 'reactstrap';
 import { BrowserRouter as Router } from 'react-router-dom';
 import { ToastContainer, toast } from 'react-toastify';
-import { hot } from 'react-hot-loader';
 
 import { useAppDispatch, useAppSelector } from 'app/config/store';
 import { getSession } from 'app/shared/reducers/authentication';
@@ -88,4 +87,4 @@ export const App = () => {
   );
 };
 
-export default hot(module)(App);
+export default App;

package/generators/client/templates/react/src/main/webapp/app/config/axios-interceptor.spec.ts.ejs

@@ -16,9 +16,6 @@
  See the License for the specific language governing permissions and
  limitations under the License.
 -%>
-/**
- * @jest-environment jsdom
- */
 import axios from 'axios';
 import sinon from 'sinon';
 

package/generators/client/templates/react/src/main/webapp/app/config/axios-interceptor.ts.ejs

@@ -19,8 +19,6 @@
 import axios from 'axios';
 import { Storage } from 'react-jhipster';
 
-import { SERVER_API_URL } from 'app/config/constants';
-
 const TIMEOUT = 1 * 60 * 1000;
 axios.defaults.timeout = TIMEOUT;
 axios.defaults.baseURL = SERVER_API_URL;

package/generators/client/templates/react/src/main/webapp/app/config/constants.ts.ejs

@@ -16,14 +16,6 @@
  See the License for the specific language governing permissions and
  limitations under the License.
 -%>
-const config = {
-  VERSION: process.env.VERSION
-};
-
-export default config;
-
-export const SERVER_API_URL = process.env.SERVER_API_URL;
-
 export const AUTHORITIES = {
   ADMIN: 'ROLE_ADMIN',
   USER: 'ROLE_USER'
@@ -37,6 +29,5 @@ export const APP_DATE_FORMAT = 'DD/MM/YY HH:mm';
 export const APP_TIMESTAMP_FORMAT = 'DD/MM/YY HH:mm:ss';
 export const APP_LOCAL_DATE_FORMAT = 'DD/MM/YYYY';
 export const APP_LOCAL_DATETIME_FORMAT = 'YYYY-MM-DDTHH:mm';
-export const APP_LOCAL_DATETIME_FORMAT_Z = 'YYYY-MM-DDTHH:mm Z';
 export const APP_WHOLE_NUMBER_FORMAT = '0,0';
 export const APP_TWO_DIGITS_AFTER_POINT_NUMBER_FORMAT = '0,0.[00]';

package/generators/client/templates/react/src/main/webapp/app/config/error-middleware.ts.ejs

@@ -32,11 +32,11 @@ export default () => next => action => {
    * The error middleware serves to log error messages from dispatch
    * It need not run in production
    */
-  if (process.env.NODE_ENV === 'development') {
+  if (DEVELOPMENT) {
     const { error } = action;
     if (error) {
       console.error(`${action.type} caught at middleware with reason: ${JSON.stringify(error.message)}.`);
-      if (error && error.response && error.response.data) {
+      if (error.response && error.response.data) {
         const message = getErrorMessage(error.response.data);
         console.error(`Actual cause: ${message}`);
       }

package/generators/client/templates/react/src/main/webapp/app/config/logger-middleware.ts.ejs

@@ -18,7 +18,7 @@
 -%>
 /* eslint no-console: off */
 export default () => next => action => {
-  if (process.env.NODE_ENV !== 'production') {
+  if (DEVELOPMENT) {
     const { type, payload, meta, error } = action;
 
     console.groupCollapsed(type);

package/generators/client/templates/react/src/main/webapp/app/config/notification-middleware.ts.ejs

@@ -73,7 +73,6 @@ export default () => next => action => {
           (error.message === '' || (data && data.path && (data.path.includes('/api/account') || data.path.includes('/api/authenticate'))))
         )
       ) {
-        let i;
         switch (response.status) {
           // connection refused, server not reachable
           case 0:
@@ -98,8 +97,7 @@ export default () => next => action => {
               addErrorAlert(errorHeader, errorHeader, { entityName });
             } else if (data?.fieldErrors) {
               const fieldErrors = data.fieldErrors;
-              for (i = 0; i < fieldErrors.length; i++) {
-                const fieldError = fieldErrors[i];
+              for (const fieldError of fieldErrors) {
                 if (['Min', 'Max', 'DecimalMin', 'DecimalMax'].includes(fieldError.message)) {
                     fieldError.message = 'Size';
                 }

package/generators/client/templates/react/src/main/webapp/app/config/store.ts.ejs

@@ -47,9 +47,7 @@ const store = configureStore({
     ),
 });
 
-const getStore = () => {
-  return store;
-};
+const getStore = () => store;
 
 export type IRootState = ReturnType<typeof store.getState>;
 export type AppDispatch = typeof store.dispatch;

package/generators/client/templates/react/src/main/webapp/app/modules/account/password/password.tsx.ejs

@@ -53,11 +53,11 @@ export const PasswordPage = () => {
 <%_ if (enableTranslation) { _%>
       toast.success(translate(successMessage));
     } else if (errorMessage) {
-      toast.success(translate(errorMessage));
+      toast.error(translate(errorMessage));
 <%_ } else { _%>
       toast.success(successMessage);
     } else if (errorMessage) {
-      toast.success(errorMessage);
+      toast.error(errorMessage);
 <%_ } _%>
     }
   }, [successMessage, errorMessage]);

package/generators/client/templates/react/src/main/webapp/app/modules/account/settings/settings.reducer.spec.ts.ejs

@@ -16,10 +16,6 @@
  See the License for the specific language governing permissions and
  limitations under the License.
 -%>
-
-/**
- * @jest-environment jsdom
- */
 import configureStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
 import axios from 'axios';

package/generators/client/templates/react/src/main/webapp/app/modules/account/settings/settings.reducer.ts.ejs

@@ -70,7 +70,7 @@ export const SettingsSlice = createSlice({
         state.errorMessage = null;
         state.updateSuccess = false;
       })
-      .addCase(updateAccount.rejected, (state, action) => {
+      .addCase(updateAccount.rejected, state => {
         state.loading = false;
         state.updateSuccess = false;
         state.updateFailure = true;

package/generators/client/templates/react/src/main/webapp/app/modules/administration/administration.reducer.spec.ts.ejs

@@ -46,9 +46,8 @@ describe('Administration reducer tests', () => {
   function isEmpty(element): boolean {
     if (element instanceof Array) {
       return element.length === 0;
-    } else {
-      return Object.keys(element).length === 0;
     }
+    return Object.keys(element).length === 0;
   }
 
   function testInitialState(state) {

package/generators/client/templates/react/src/main/webapp/app/modules/administration/configuration/configuration.tsx.ejs

@@ -51,9 +51,9 @@ export const ConfigurationPage = () => {
       .map((v: any) => v.beans)
       .reduce((acc, e) => ({ ...acc, ...e }));
 
-  const configProps = configuration && configuration.configProps ? configuration.configProps : {};
+  const configProps = configuration?.configProps ?? {};
 
-  const env = configuration && configuration.env ? configuration.env : {};
+  const env = configuration?.env ?? {};
 
   return (
     <div>
@@ -88,7 +88,7 @@ export const ConfigurationPage = () => {
                         <Row key={index}>
                           <Col md="4">{propKey}</Col>
                           <Col md="8">
-                            <Badge className="float-right badge-secondary break">{JSON.stringify(property['properties'][propKey])}</Badge>
+                            <Badge className="float-end bg-secondary break">{JSON.stringify(property['properties'][propKey])}</Badge>
                           </Col>
                         </Row>
                       ))}
@@ -118,7 +118,7 @@ export const ConfigurationPage = () => {
                       <tr key={propIndex}>
                         <td className="break">{propKey}</td>
                         <td className="break">
-                          <span className="float-right badge badge-secondary break">{envKey.properties[propKey].value}</span>
+                          <span className="float-end badge bg-secondary break">{envKey.properties[propKey].value}</span>
                         </td>
                       </tr>
                     ))}

package/generators/client/templates/react/src/main/webapp/app/modules/administration/gateway/gateway.tsx.ejs

@@ -38,8 +38,8 @@ export const GatewayPage = () => {
     Object.keys(instance).map((key, index) => {
       spans.push((
         <span key={key.toString() + 'value'}>
-          <Badge key={key.toString() + '-containerbadge'} className="font-weight-normal">
-            <Badge key={key.toString() + '-badge'} color="info" className="font-weight-normal" pill>{key}</Badge>
+          <Badge key={key.toString() + '-containerbadge'} className="fw-normal">
+            <Badge key={key.toString() + '-badge'} color="info" className="fw-normal" pill>{key}</Badge>
             {instance[key]}
           </Badge>
         </span>

package/generators/client/templates/react/src/main/webapp/app/modules/administration/health/health-modal.tsx.ejs

@@ -25,9 +25,8 @@ const formatDiskSpaceOutput = rawValue => {
   if (val > 1) {
     // Value
     return val.toFixed(2) + ' GB';
-  } else {
-    return (rawValue / 1048576).toFixed(2) + ' MB';
   }
+  return (rawValue / 1048576).toFixed(2) + ' MB';
 };
 
 const HealthModal = ({ handleClose, healthObject, showModal }) => {

package/generators/client/templates/react/src/main/webapp/app/modules/administration/health/health.tsx.ejs

@@ -48,6 +48,8 @@ export const HealthPage = () => {
     setHealthObject({ ...healthObj, name });
   };
 
+  const getBadgeType = (status: string) => status !== 'UP' ? 'danger' : 'success';
+
   const handleClose = () => setShowModal(false);
 
   const renderModal = () => <HealthModal healthObject={healthObject} handleClose={handleClose} showModal={showModal} />;
@@ -84,7 +86,7 @@ export const HealthPage = () => {
                   <tr key={configPropIndex}>
                     <td>{configPropKey}</td>
                     <td>
-                      <Badge color={data[configPropKey].status !== 'UP' ? 'danger' : 'success'}>{data[configPropKey].status}</Badge>
+                      <Badge color={getBadgeType(data[configPropKey].status)}>{data[configPropKey].status}</Badge>
                     </td>
                     <td>
                       {data[configPropKey].details ? (

package/generators/client/templates/react/src/main/webapp/app/modules/administration/metrics/metrics.tsx.ejs

@@ -74,11 +74,11 @@ export const MetricsPage = () => {
           <h3>JVM Metrics</h3>
           <Row>
             <Col md="4">
-              {metrics && metrics.jvm ? <JvmMemory jvmMetrics={metrics.jvm} wholeNumberFormat={APP_WHOLE_NUMBER_FORMAT} /> : ''}
+              {metrics?.jvm ? <JvmMemory jvmMetrics={metrics.jvm} wholeNumberFormat={APP_WHOLE_NUMBER_FORMAT} /> : ''}
             </Col>
             <Col md="4">{threadDump ? <JvmThreads jvmThreads={threadDump} wholeNumberFormat={APP_WHOLE_NUMBER_FORMAT} /> : ''}</Col>
             <Col md="4">
-              {metrics && metrics.processMetrics ? (
+              {metrics?.processMetrics ? (
                 <SystemMetrics
                   systemMetrics={metrics.processMetrics}
                   wholeNumberFormat={APP_WHOLE_NUMBER_FORMAT}
@@ -92,7 +92,7 @@ export const MetricsPage = () => {
         </Col>
       </Row>
 
-      {metrics && metrics.garbageCollector ? (
+      {metrics?.garbageCollector ? (
         <GarbageCollectorMetrics garbageCollectorMetrics={metrics.garbageCollector} wholeNumberFormat={APP_WHOLE_NUMBER_FORMAT} />
       ) : (
         ''
@@ -106,13 +106,13 @@ export const MetricsPage = () => {
       ) : (
         ''
       )}
-      {metrics && metrics.services ? (
+      {metrics?.services ? (
         <EndpointsRequestsMetrics endpointsRequestsMetrics={metrics.services} wholeNumberFormat={APP_WHOLE_NUMBER_FORMAT} />
       ) : (
         ''
       )}
 
-      {metrics.cache ? (
+      {metrics?.cache ? (
         <Row>
           <Col sm="12">
             <CacheMetrics cacheMetrics={metrics.cache} twoDigitAfterPointFormat={APP_TWO_DIGITS_AFTER_POINT_NUMBER_FORMAT} />
@@ -122,7 +122,7 @@ export const MetricsPage = () => {
         ''
       )}
 
-      {metrics.databases && JSON.stringify(metrics.databases) !== '{}' ? (
+      {metrics?.databases && JSON.stringify(metrics.databases) !== '{}' ? (
         <Row>
           <Col sm="12">
             <DatasourceMetrics datasourceMetrics={metrics.databases} twoDigitAfterPointFormat={APP_TWO_DIGITS_AFTER_POINT_NUMBER_FORMAT} />