generator-jhipster 7.6.0 → 7.8.1

package/generators/client/templates/angular/src/main/webapp/app/admin/user-management/list/user-management.component.html.ejs

@@ -21,7 +21,7 @@
     <span id="user-management-page-heading" <%= jhiPrefix %>Translate="userManagement.home.title" data-cy="userManagementPageHeading">Users</span>
 
     <div class="d-flex justify-content-end">
-      <button class="btn btn-info mr-2" (click)="loadAll()" [disabled]="isLoading">
+      <button class="btn btn-info me-2" (click)="loadAll()" [disabled]="isLoading">
         <fa-icon icon="sync" [spin]="isLoading"></fa-icon>
         <span <%= jhiPrefix %>Translate="userManagement.home.refreshListLabel">Refresh List</span>
       </button>
@@ -100,7 +100,7 @@
 <%_ } _%>
           <td>
             <div *ngFor="let authority of user.authorities">
-              <span class="badge badge-info">{{ authority }}</span>
+              <span class="badge bg-info">{{ authority }}</span>
             </div>
           </td>
 <%_ if (!databaseTypeCassandra) { _%>
@@ -108,7 +108,7 @@
           <td>{{ user.lastModifiedBy }}</td>
           <td>{{ user.lastModifiedDate | date: 'dd/MM/yy HH:mm' }}</td>
 <%_ } _%>
-          <td class="text-right">
+          <td class="text-end">
             <div class="btn-group">
               <button type="submit" [routerLink]="['./', user.login, 'view']" class="btn btn-info btn-sm">
                 <fa-icon icon="eye"></fa-icon>
@@ -138,11 +138,11 @@
 <%_ if (!databaseTypeCassandra) { _%>
 
   <div *ngIf="users">
-    <div class="row justify-content-center">
+    <div class="d-flex justify-content-center">
       <<%= jhiPrefixDashed %>-item-count [params]="{ page: page, totalItems: totalItems, itemsPerPage: itemsPerPage }"></<%= jhiPrefixDashed %>-item-count>
     </div>
 
-    <div class="row justify-content-center">
+    <div class="d-flex justify-content-center">
       <ngb-pagination
         [collectionSize]="totalItems"
         [(page)]="page"

package/generators/client/templates/angular/src/main/webapp/app/admin/user-management/list/user-management.component.ts.ejs

@@ -72,7 +72,7 @@ export class UserManagementComponent implements OnInit {
     this.userService.update({ ...user, activated: isActivated }).subscribe(() => this.loadAll());
   }
 
-  trackIdentity(index: number, item: User): <%= getTypescriptKeyType(user.primaryKey.type) %> {
+  trackIdentity(_index: number, item: User): <%= getTypescriptKeyType(user.primaryKey.type) %> {
     return item.id!;
   }
 

package/generators/client/templates/angular/src/main/webapp/app/admin/user-management/update/user-management-update.component.html.ejs

@@ -16,7 +16,7 @@
  See the License for the specific language governing permissions and
  limitations under the License.
 -%>
-<div class="row justify-content-center">
+<div class="d-flex justify-content-center">
   <div class="col-8">
     <form name="editForm" role="form" novalidate (ngSubmit)="save()" [formGroup]="editForm">
       <h2 id="myUserLabel" <%= jhiPrefix %>Translate="userManagement.home.createOrEditLabel">Create or edit a User</h2>
@@ -24,13 +24,13 @@
       <div *ngIf="user">
         <<%= jhiPrefixDashed %>-alert-error></<%= jhiPrefixDashed %>-alert-error>
 
-        <div class="form-group" [hidden]="!user.id">
+        <div class="mb-3" [hidden]="!user.id">
           <label <%= jhiPrefix %>Translate="global.field.id">ID</label>
           <input type="text" class="form-control" name="id" formControlName="id" readonly />
         </div>
 
-        <div class="form-group">
-          <label class="form-control-label" <%= jhiPrefix %>Translate="userManagement.login">Login</label>
+        <div class="mb-3">
+          <label class="form-label" <%= jhiPrefix %>Translate="userManagement.login">Login</label>
           <input type="text" class="form-control" name="login" formControlName="login" />
 
           <div *ngIf="editForm.get('login')!.invalid && (editForm.get('login')!.dirty || editForm.get('login')!.touched)">
@@ -61,8 +61,8 @@
           </div>
         </div>
 
-        <div class="form-group">
-          <label class="form-control-label" <%= jhiPrefix %>Translate="userManagement.firstName">First Name</label>
+        <div class="mb-3">
+          <label class="form-label" <%= jhiPrefix %>Translate="userManagement.firstName">First Name</label>
           <input type="text" class="form-control" name="firstName" formControlName="firstName" />
 
           <div *ngIf="editForm.get('firstName')!.invalid && (editForm.get('firstName')!.dirty || editForm.get('firstName')!.touched)">
@@ -77,7 +77,7 @@
           </div>
         </div>
 
-        <div class="form-group">
+        <div class="mb-3">
           <label <%= jhiPrefix %>Translate="userManagement.lastName">Last Name</label>
           <input type="text" class="form-control" name="lastName" formControlName="lastName" />
 
@@ -93,8 +93,8 @@
           </div>
         </div>
 
-        <div class="form-group">
-          <label class="form-control-label" <%= jhiPrefix %>Translate="userManagement.email">Email</label>
+        <div class="mb-3">
+          <label class="form-label" <%= jhiPrefix %>Translate="userManagement.email">Email</label>
           <input type="email" class="form-control" name="email" formControlName="email" />
 
           <div *ngIf="editForm.get('email')!.invalid && (editForm.get('email')!.dirty || editForm.get('email')!.touched)">
@@ -149,7 +149,7 @@
         </div>
 <%_ if (enableTranslation) { _%>
 
-        <div class="form-group" *ngIf="languages && languages.length > 0">
+        <div class="mb-3" *ngIf="languages && languages.length > 0">
           <label <%= jhiPrefix %>Translate="userManagement.langKey">Lang Key</label>
           <select class="form-control" id="langKey" name="langKey" formControlName="langKey">
             <option *ngFor="let language of languages" [value]="language">{{ language | findLanguageFromKey }}</option>
@@ -157,7 +157,7 @@
         </div>
 <%_ } _%>
 
-        <div class="form-group">
+        <div class="mb-3">
           <label <%= jhiPrefix %>Translate="userManagement.profiles">Profiles</label>
           <select class="form-control" multiple name="authority" formControlName="authorities">
             <option *ngFor="let authority of authorities" [value]="authority">{{ authority }}</option>

package/generators/client/templates/angular/src/main/webapp/app/core/util/data-util.service.ts.ejs

@@ -116,7 +116,7 @@ export class DataUtils {
     const fileReader: FileReader = new FileReader();
     fileReader.onload = (e: ProgressEvent<FileReader>) => {
       if (typeof e.target?.result === 'string') {
-        const base64Data: string = e.target.result.substr(e.target.result.indexOf('base64,') + 'base64,'.length);
+        const base64Data: string = e.target.result.substring(e.target.result.indexOf('base64,') + 'base64,'.length);
         callback(base64Data);
       }
     };

package/generators/client/templates/angular/src/main/webapp/app/core/util/parse-links.service.ts.ejs

@@ -50,7 +50,7 @@ export class ParseLinks {
 
       url.replace(
         /([^?=&]+)(=([^&]*))?/g,
-        ($0: string, $1: string | undefined, $2: string | undefined, $3: string | undefined) => {
+        (_$0: string, $1: string | undefined, _$2: string | undefined, $3: string | undefined) => {
           if ($1 !== undefined) {
             queryString[$1] = $3;
           }

package/generators/client/templates/angular/src/main/webapp/app/layouts/navbar/navbar.component.html.ejs

@@ -17,6 +17,7 @@
  limitations under the License.
 -%>
 <nav data-cy="navbar" class="navbar navbar-<% if (clientThemeNone || clientThemePrimary) { %>dark<% } else { %><%= clientThemeVariant %><% } %> navbar-expand-md <% if (clientThemeNone) { %>bg-dark<% } else { %>bg-<%= clientThemeVariant %><% } %>">
+  <div class="container-fluid">
   <a class="navbar-brand logo" routerLink="/" (click)="collapseNavbar()">
     <span class="logo-img"></span>
     <span <%= jhiPrefix %>Translate="global.title" class="navbar-title"><%= capitalizedBaseName %></span>
@@ -35,7 +36,7 @@
     <fa-icon icon="bars"></fa-icon>
   </a>
   <div class="navbar-collapse collapse" id="navbarResponsive" [ngbCollapse]="isNavbarCollapsed" [ngSwitch]="account !== null">
-    <ul class="navbar-nav ml-auto">
+    <ul class="navbar-nav ms-auto">
       <li class="nav-item" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }">
         <a class="nav-link" routerLink="/" (click)="collapseNavbar()">
           <span>
@@ -73,7 +74,7 @@
               <fa-icon icon="asterisk" [fixedWidth]="true"></fa-icon>
               <span
     <%_ if (enableTranslation) { _%>
-              [jhiTranslate]="entityNavbarItem.translationKey"
+              [<%= jhiPrefix %>Translate]="entityNavbarItem.translationKey"
     <%_ } _%>
               >{{entityNavbarItem.name}}</span>
             </a>
@@ -239,4 +240,5 @@
       </li>
     </ul>
   </div>
+  </div>
 </nav>

package/generators/client/templates/angular/src/main/webapp/app/layouts/navbar/navbar.component.scss.ejs

@@ -46,12 +46,6 @@ Navbar
   }
 <%_ } _%>
 
-  ul.navbar-nav {
-    .nav-item {
-      margin-left: 0.5em;
-    }
-  }
-
   a.nav-link {
     font-weight: 400;
   }

package/generators/client/templates/angular/src/main/webapp/app/layouts/profiles/page-ribbon.component.scss.ejs

@@ -21,12 +21,6 @@ Developement Ribbon
 ========================================================================== */
 .ribbon {
   background-color: rgba(170, 0, 0, 0.5);
-  left: -3.5em;
-  -moz-transform: rotate(-45deg);
-  -ms-transform: rotate(-45deg);
-  -o-transform: rotate(-45deg);
-  -webkit-transform: rotate(-45deg);
-  transform: rotate(-45deg);
   overflow: hidden;
   position: absolute;
   top: 40px;

package/generators/client/templates/angular/src/main/webapp/app/login/login.component.html.ejs

@@ -17,7 +17,7 @@
  limitations under the License.
 -%>
 <div>
-  <div class="row justify-content-center">
+  <div class="d-flex justify-content-center">
     <div class="col-lg-6 col-md-8 col-sm-10">
       <h1 <%= jhiPrefix %>Translate="login.title" data-cy="loginTitle">Sign in</h1>
       <div
@@ -29,7 +29,7 @@
         <strong>Failed to sign in!</strong> Please check your credentials and try again.
       </div>
       <form class="form" role="form" (ngSubmit)="login()" [formGroup]="loginForm">
-        <div class="form-group">
+        <div class="mb-3">
           <label class="username-label" for="username" <%= jhiPrefix %>Translate="global.form.username.label">Login</label>
           <input
             type="text"
@@ -43,7 +43,7 @@
           />
         </div>
 
-        <div class="form-group">
+        <div class="mb-3">
           <label for="password" <%= jhiPrefix %>Translate="login.form.password">Password</label>
           <input
             type="password"

package/generators/client/templates/angular/src/main/webapp/content/scss/_bootstrap-variables.scss.ejs

@@ -17,11 +17,11 @@
  limitations under the License.
 -%>
 /*
-* Bootstrap overrides https://getbootstrap.com/docs/4.0/getting-started/theming/
-* All values defined in bootstrap source
-* https://github.com/twbs/bootstrap/blob/v4-dev/scss/_variables.scss can be overwritten here
-* Make sure not to add !default to values here
-*/
+ * Bootstrap overrides https://getbootstrap.com/docs/5.1/customize/sass/
+ * All values defined in bootstrap source
+ * https://github.com/twbs/bootstrap/blob/v5.1.3/scss/_variables.scss can be overwritten here
+ * Make sure not to add !default to values here
+ */
 
 <%_ if (clientThemeNone) { _%>
 // Colors:

package/generators/client/templates/angular/src/main/webapp/content/scss/global.scss.ejs

@@ -122,6 +122,10 @@ Generic styles
   word-break: break-all;
 }
 
+.form-control {
+  background-color: #fff;
+}
+
 .readonly {
   background-color: #eee;
   opacity: 1;
@@ -224,4 +228,29 @@ ui bootstrap tweaks
   white-space: nowrap;
 }
 
+.dropdown-menu {
+  padding-left: 0px;
+}
+
+/* ==========================================================================
+angular-cli removes postcss-rtl processed inline css, processed rules must be added here instead
+========================================================================== */
+/* page-ribbon.component.scss */
+.ribbon {
+  left: -3.5em;
+  -moz-transform: rotate(-45deg);
+  -ms-transform: rotate(-45deg);
+  -o-transform: rotate(-45deg);
+  -webkit-transform: rotate(-45deg);
+  transform: rotate(-45deg);
+}
+
+/* navbar.component.scss */
+.navbar {
+  ul.navbar-nav {
+    .nav-item {
+      margin-left: 0.5em;
+    }
+  }
+}
 /* jhipster-needle-scss-add-main JHipster will add new css style */

package/generators/client/templates/angular/src/main/webapp/content/scss/vendor.scss.ejs

@@ -33,8 +33,4 @@ eg $input-color: red;
 @import '~bootswatch/dist/<%= clientTheme %>/bootswatch';
 <%_ } _%>
 
-<%_ if (enableI18nRTL) { _%>
-@import 'content/scss/rtl.scss';
-<%_ } _%>
-
 /* jhipster-needle-scss-add-vendor JHipster will add new css style */

package/generators/client/templates/angular/webpack/webpack.custom.js.ejs

@@ -22,6 +22,9 @@ const path = require('path');
 <%_ if (enableTranslation) { _%>
 const { hashElement } = require('folder-hash');
 const MergeJsonWebpackPlugin = require('merge-jsons-webpack-plugin');
+  <%_ if (enableI18nRTL) { _%>
+const postcssRTLCSS = require('postcss-rtlcss');
+  <%_ } _%>
 <%_ } _%>
 const BrowserSyncPlugin = require('browser-sync-webpack-plugin');
 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
@@ -32,7 +35,6 @@ const ESLintPlugin = require('eslint-webpack-plugin');
 const environment = require('./environment');
 const proxyConfig = require('./proxy.conf');
 
-
 module.exports = async (config, options, targetOptions) => {
 <%_ if (enableTranslation) { _%>
   const languagesHash = await hashElement(path.resolve(__dirname, '../<%= MAIN_SRC_DIR %>i18n'), {
@@ -108,6 +110,18 @@ module.exports = async (config, options, targetOptions) => {
   }
 
   const patterns = [
+    {
+      // https://github.com/swagger-api/swagger-ui/blob/v4.6.1/swagger-ui-dist-package/README.md
+      context: require('swagger-ui-dist').getAbsoluteFSPath(),
+      from: '*.{js,css,html,png}',
+      to: 'swagger-ui/',
+      globOptions: { ignore: ['**/index.html'] },
+    },
+    {
+      from: require.resolve('axios/dist/axios.min.js'), 
+      to: 'swagger-ui/',
+    },
+    { from: './<%= CLIENT_MAIN_SRC_DIR %>swagger-ui/', to: 'swagger-ui/' },
     // jhipster-needle-add-assets-to-webpack - JHipster will add/remove third-party resources in this array
   ];
 
@@ -115,6 +129,22 @@ module.exports = async (config, options, targetOptions) => {
     config.plugins.push(new CopyWebpackPlugin({ patterns }));
   }
 
+<%_ if (enableI18nRTL) { _%>
+  const scssRule = config.module.rules.find(x => x.test && x.test.toString().includes('scss'));
+  const uses = scssRule.rules.flatMap(r => r.use || r.oneOf.flatMap(o => o.use));
+  const postcssLoaderOptions = uses.filter(u => u.loader.includes('postcss-loader')).map(u => u.options);
+  postcssLoaderOptions.forEach(options => {
+    const generateOptions = options.postcssOptions;
+    options.postcssOptions = (loader) => {
+      const postcssOptions = generateOptions(loader);
+      postcssOptions.plugins.push(postcssRTLCSS());
+      return postcssOptions;
+    };
+    // https://github.com/angular/angular-cli/blob/4b9199d97f3bcb10710b5049b04d8a04436e2dd4/packages/angular_devkit/build_angular/src/webpack/configs/styles.ts#L201-L202
+    options.postcssOptions.config = false;
+  });
+
+<%_ } _%>
   config.plugins.push(
     new webpack.DefinePlugin({
 <%_ if (enableTranslation) { _%>

package/generators/client/templates/common/package.json

@@ -1,15 +1,16 @@
 {
   "devDependencies": {
     "@cypress/code-coverage": "3.9.12",
-    "babel-loader": "8.2.3",
+    "babel-loader": "8.2.4",
     "babel-plugin-istanbul": "6.1.1",
-    "cypress": "9.3.1",
-    "eslint-plugin-cypress": "2.12.1",
+    "cypress": "9.5.3",
     "cypress-audit": "1.1.0",
-    "lighthouse": "9.2.0",
-    "nyc": "15.1.0"
+    "eslint-plugin-cypress": "2.12.1",
+    "lighthouse": "9.5.0",
+    "nyc": "15.1.0",
+    "swagger-ui-dist": "4.10.3"
   },
   "dependencies": {
-    "dayjs": "1.10.7"
+    "dayjs": "1.11.0"
   }
 }

package/generators/client/templates/common/src/main/webapp/swagger-ui/index.html.ejs

@@ -35,16 +35,9 @@
 
     <script type="text/javascript">
       const AlwaysEnableTryItOutPlugin = function (system) {
-        const OperationContainer = system.getComponents('OperationContainer');
         return {
           components: {
             TryItOutButton: () => null,
-            OperationContainer: class CustomOperationContainer extends OperationContainer {
-              constructor(...args) {
-                super(...args);
-                this.state.tryItOutEnabled = true;
-              }
-            },
           },
         };
       };
@@ -150,6 +143,7 @@
           withCredentials: true,
           presets: [SwaggerUIBundle.presets.apis, SwaggerUIStandalonePreset],
           plugins: [SwaggerUIBundle.plugins.DownloadUrl, AlwaysEnableTryItOutPlugin],
+          tryItOutEnabled: true,
           requestInterceptor: function (req) {
 <%_ if (authenticationTypeSession || authenticationTypeOauth2) { _%>
             req.headers['X-XSRF-TOKEN'] = getCSRF();

package/generators/client/templates/common/webpack/webpack.microfrontend.js.jhi.ejs

@@ -34,6 +34,8 @@ module.exports = ({ serve }) => {
   return {
     optimization: {
       moduleIds: 'named',
+      chunkIds: 'named',
+      runtimeChunk: false,
     },
     plugins: [
       new ModuleFederationPlugin({
@@ -49,8 +51,5 @@ module.exports = ({ serve }) => {
     output: {
       publicPath: 'auto',
     },
-    optimization: {
-      runtimeChunk: false,
-    },
   };
 };

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

@@ -34,7 +34,7 @@
     "ecmaFeatures": {
       "jsx": true
     },
-    "project": "./<% if (protractorTests) { %>tsconfig.e2e.json<% } else { %>tsconfig.json<% } %>"
+    "project": "./<% if (protractorTests) { %>tsconfig.e2e.json<% } else { %>tsconfig.test.json<% } %>"
   },
   "settings": {
     "react": {

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

@@ -1,4 +1,4 @@
-const tsconfig = require('./tsconfig.json');
+const tsconfig = require('./tsconfig.test.json');
 
 module.exports = {
   testEnvironment: 'jsdom',

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

@@ -1,23 +1,23 @@
 {
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "1.2.36",
-    "@fortawesome/free-solid-svg-icons": "5.15.4",
-    "@fortawesome/react-fontawesome": "0.1.16",
-    "@reduxjs/toolkit": "1.7.1",
-    "axios": "0.25.0",
+    "@fortawesome/fontawesome-svg-core": "6.1.1",
+    "@fortawesome/free-solid-svg-icons": "6.1.1",
+    "@fortawesome/react-fontawesome": "0.1.18",
+    "@reduxjs/toolkit": "1.8.1",
+    "axios": "0.26.1",
     "bootstrap": "5.1.3",
     "bootswatch": "5.1.3",
     "lodash": "4.17.21",
     "path-browserify": "1.0.1",
     "react": "17.0.2",
     "react-dom": "17.0.2",
-    "react-hook-form": "7.24.2",
-    "react-jhipster": "0.18.0",
+    "react-hook-form": "7.29.0",
+    "react-jhipster": "0.20.0",
     "react-loadable": "5.5.0",
-    "react-redux": "7.2.6",
+    "react-redux": "7.2.8",
     "react-redux-loading-bar": "5.0.2",
     "react-router-dom": "5.3.0",
-    "react-toastify": "8.1.0",
+    "react-toastify": "8.2.0",
     "react-transition-group": "4.4.2",
     "reactstrap": "9.0.1",
     "redux": "4.1.2",
@@ -27,63 +27,62 @@
     "uuid": "8.3.2"
   },
   "devDependencies": {
-    "@testing-library/react": "12.1.2",
-    "@types/jest": "27.4.0",
-    "@types/lodash": "4.14.178",
-    "@types/node": "16.11.21",
-    "@types/react": "17.0.38",
-    "@types/react-dom": "17.0.11",
-    "@types/react-redux": "7.1.22",
+    "@testing-library/react": "12.1.4",
+    "@types/jest": "27.4.1",
+    "@types/lodash": "4.14.181",
+    "@types/node": "16.11.26",
+    "@types/react": "17.0.43",
+    "@types/react-dom": "17.0.14",
+    "@types/react-redux": "7.1.23",
     "@types/react-router-dom": "5.3.3",
     "@types/redux": "3.6.31",
     "@types/webpack-env": "1.16.3",
-    "@typescript-eslint/eslint-plugin": "5.10.0",
-    "@typescript-eslint/parser": "5.10.0",
-    "autoprefixer": "10.4.2",
-    "browser-sync": "2.27.7",
+    "@typescript-eslint/eslint-plugin": "5.18.0",
+    "@typescript-eslint/parser": "5.18.0",
+    "autoprefixer": "10.4.4",
+    "browser-sync": "2.27.9",
     "browser-sync-webpack-plugin": "2.3.0",
-    "copy-webpack-plugin": "10.2.1",
-    "core-js": "3.20.3",
+    "copy-webpack-plugin": "10.2.4",
+    "core-js": "3.21.1",
     "cross-env": "7.0.3",
-    "css-loader": "6.5.1",
+    "css-loader": "6.7.1",
     "css-minimizer-webpack-plugin": "3.4.1",
-    "eslint": "8.7.0",
-    "eslint-config-prettier": "8.3.0",
-    "eslint-plugin-react": "7.28.0",
+    "eslint": "8.12.0",
+    "eslint-config-prettier": "8.5.0",
+    "eslint-plugin-react": "7.29.4",
     "eslint-webpack-plugin": "3.1.1",
-    "folder-hash": "4.0.1",
-    "fork-ts-checker-webpack-plugin": "6.5.0",
+    "folder-hash": "4.0.2",
+    "fork-ts-checker-webpack-plugin": "7.2.3",
     "html-webpack-plugin": "5.5.0",
     "identity-obj-proxy": "3.0.0",
-    "jest": "27.4.7",
-    "jest-junit": "13.0.0",
+    "jest": "27.5.1",
+    "jest-junit": "13.1.0",
     "jest-sonar-reporter": "2.0.0",
     "json-loader": "0.5.7",
     "merge-jsons-webpack-plugin": "2.0.1",
-    "mini-css-extract-plugin": "2.5.2",
+    "mini-css-extract-plugin": "2.6.0",
     "postcss-loader": "6.2.1",
-    "postcss-rtlcss": "3.5.1",
+    "postcss-rtlcss": "3.5.4",
     "react-infinite-scroll-component": "6.1.0",
     "redux-mock-store": "1.5.4",
     "rimraf": "3.0.2",
-    "sass": "1.49.0",
-    "sass-loader": "12.4.0",
+    "sass": "1.49.11",
+    "sass-loader": "12.6.0",
     "simple-progress-webpack-plugin": "2.0.0",
-    "sinon": "12.0.1",
+    "sinon": "13.0.1",
     "source-map-loader": "3.0.1",
     "sourcemap-istanbul-instrumenter-loader": "0.2.0",
     "style-loader": "3.3.1",
-    "swagger-ui-dist": "4.2.1",
-    "terser-webpack-plugin": "5.3.0",
+    "terser-webpack-plugin": "5.3.1",
     "thread-loader": "3.0.4",
-    "ts-jest": "27.1.3",
-    "ts-loader": "9.2.6",
-    "typescript": "4.5.5",
-    "webpack": "5.66.0",
-    "webpack-cli": "4.9.1",
-    "webpack-dev-server": "4.7.3",
+    "ts-jest": "27.1.4",
+    "ts-loader": "9.2.8",
+    "typescript": "4.6.3",
+    "webpack": "5.71.0",
+    "webpack-cli": "4.9.2",
+    "webpack-dev-server": "4.8.0",
     "webpack-merge": "5.8.0",
     "webpack-notifier": "1.15.0",
-    "workbox-webpack-plugin": "6.4.2"
+    "workbox-webpack-plugin": "6.5.2"
   }
-}
+}

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

@@ -212,6 +212,7 @@
     "test": "<%= clientPackageManager %> run jest --",
     "test-ci": "<%= clientPackageManager %> run lint && <%= clientPackageManager %> run jest:update --",
     "test:watch": "<%= clientPackageManager %> run jest -- --watch",
+    "watch": "concurrently 'npm run start' npm:backend:start",
     "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",

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

@@ -21,7 +21,7 @@
 @import "~bootswatch/dist/<%= clientTheme %>/variables";
 <%_ } _%>
 // Import Bootstrap source files from node_modules
-@import "node_modules/bootstrap/scss/bootstrap";
+@import "~bootstrap/scss/bootstrap";
 <%_ if (!clientThemeNone) { _%>
 @import "~bootswatch/dist/<%= clientTheme %>/bootswatch";
 <%_ } _%>