Merge pull request #1 from jhipster/main

add

.github/workflows/devserver.yml

@@ -154,7 +154,7 @@ jobs:
           name: screenshots-${{ matrix.app-sample }}
           path: ${{ steps.setup.outputs.application-path }}/*/cypress/screenshots
       - name: 'ANALYSIS: Sonar analysis'
-        if: steps.compare.outputs.equals != 'true' && matrix.sonar-analyse != 'false'
+        if: steps.compare.outputs.equals != 'true' && matrix.sonar-analyse == 'true'
         run: $JHI_SCRIPTS/25-sonar-analyze.sh
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/docker-image-publish-github-registry.yml

@@ -67,7 +67,7 @@ jobs:
 
       - name: Extract Docker metadata
         id: meta
-        uses: docker/metadata-action@v3.6.1
+        uses: docker/metadata-action@v3.6.2
         with:
           images: ghcr.io/${{ github.repository }}${{ (steps.login-hub.outcome == 'success' && ',jhipster/jhipster') || ''}}
 

generators/app/index.js

@@ -250,10 +250,15 @@ module.exports = class JHipsterAppGenerator extends BaseBlueprintGenerator {
     });
 
     this.option('microfrontend', {
-      desc: 'Use experimental microfrontend support',
+      desc: 'Force generation of experimental microfrontend support',
       type: Boolean,
     });
 
+    this.option('test-frameworks', {
+      desc: 'Test frameworks to be generated',
+      type: Array,
+    });
+
     this.option('reactive', {
       desc: 'Generate a reactive backend',
       type: Boolean,

generators/client/files-angular.js

@@ -74,6 +74,7 @@ const files = {
       path: ANGULAR_DIR,
       templates: [
         // entities
+        'entities/entity-navbar-items.ts',
         'entities/entity-routing.module.ts',
         // home module
         'home/home.module.ts',
@@ -382,7 +383,11 @@ const files = {
     {
       condition: generator => generator.enableTranslation,
       path: ANGULAR_DIR,
-      templates: ['shared/language/find-language-from-key.pipe.ts', 'shared/language/translate.directive.ts'],
+      templates: [
+        'shared/language/translation.module.ts',
+        'shared/language/find-language-from-key.pipe.ts',
+        'shared/language/translate.directive.ts',
+      ],
     },
   ],
   angularAuthService: [

generators/client/templates/angular/package.json

@@ -12,7 +12,7 @@
     "ngx-infinite-scroll": "10.0.1",
     "ngx-webstorage": "8.0.0",
     "rxjs": "6.6.7",
-    "swagger-ui-dist": "4.1.2",
+    "swagger-ui-dist": "4.1.3",
     "tslib": "2.3.1",
     "zone.js": "0.11.4"
   },
@@ -21,24 +21,24 @@
     "@angular-builders/custom-webpack": "12.1.3",
     "@angular-builders/jest": "12.1.2",
     "@angular-eslint/eslint-plugin": "12.7.0",
-    "@types/node": "16.11.12",
+    "@types/node": "17.0.0",
     "@types/jest": "27.0.3",
-    "@typescript-eslint/eslint-plugin": "5.6.0",
+    "@typescript-eslint/eslint-plugin": "5.7.0",
     "browser-sync": "2.27.7",
     "browser-sync-webpack-plugin": "2.3.0",
-    "copy-webpack-plugin": "10.0.0",
+    "copy-webpack-plugin": "10.2.0",
     "eslint": "7.32.0",
     "eslint-config-prettier": "8.3.0",
     "eslint-webpack-plugin": "3.1.1",
     "folder-hash": "4.0.1",
-    "jest": "27.4.4",
+    "jest": "27.4.5",
     "jest-preset-angular": "10.1.0",
     "jest-date-mock": "1.0.8",
     "jest-junit": "13.0.0",
     "jest-sonar-reporter": "2.0.0",
     "merge-jsons-webpack-plugin": "2.0.1",
     "rimraf": "3.0.2",
-    "ts-jest": "27.1.1",
+    "ts-jest": "27.1.2",
     "typescript": "4.3.5",
     "webpack": "5.50.0",
     "webpack-bundle-analyzer": "4.5.0",

generators/client/templates/angular/src/main/webapp/app/app-routing.module.ts.ejs

@@ -26,8 +26,6 @@ import { Authority } from 'app/config/authority.constants';
 
 import { UserRouteAccessService } from 'app/core/auth/user-route-access.service';
 
-const LAYOUT_ROUTES = [navbarRoute, ...errorRoute];
-
 @NgModule({
   imports: [
     RouterModule.forRoot(
@@ -54,7 +52,20 @@ const LAYOUT_ROUTES = [navbarRoute, ...errorRoute];
           loadChildren: () => import('./login/login.module').then(m => m.LoginModule),
         },
 <%_ } _%>
-        ...LAYOUT_ROUTES,
+        {
+          path: '<%= applicationTypeMicroservice ? lowercaseBaseName : '' %>',
+          loadChildren: () => import(`./entities/entity-routing.module`).then(m => m.EntityRoutingModule),
+        },
+<%_ if (applicationTypeGateway) { _%>
+  <%_ for (const remote of microfrontends) { _%>
+        {
+          path: '<%= remote.lowercaseBaseName %>',
+          loadChildren: () => import(`<%= remote.lowercaseBaseName %>/entity-routing`).then(m => m.EntityRoutingModule),
+        },
+  <%_ } _%>
+<%_ } _%>
+        navbarRoute,
+        ...errorRoute,
       ],
       { enableTracing: DEBUG_INFO_ENABLED }
     ),

generators/client/templates/angular/src/main/webapp/app/app.module.ts.ejs

@@ -21,37 +21,33 @@
 _%>
 import { NgModule, LOCALE_ID } from '@angular/core';
 import { registerLocaleData } from '@angular/common';
-import { <% if (enableTranslation) { %>HttpClient, <% } %>HttpClientModule } from '@angular/common/http';
+import { HttpClientModule } from '@angular/common/http';
 import locale from '@angular/common/locales/<%= localeId %>';
 import { BrowserModule, Title } from '@angular/platform-browser';
 import { ServiceWorkerModule } from '@angular/service-worker';
 import { FaIconLibrary } from '@fortawesome/angular-fontawesome';
 <%_ if (authenticationTypeSession && communicationSpringWebsocket) { _%>
 import { CookieService } from 'ngx-cookie-service';
 <%_ } _%>
-<%_ if (enableTranslation) { _%>
-import { TranslateModule, TranslateService, TranslateLoader, MissingTranslationHandler } from '@ngx-translate/core';
-<%_ } _%>
 import { NgxWebstorageModule<% if (enableTranslation) { %>, SessionStorageService<% } %> } from 'ngx-webstorage';
 import * as dayjs from 'dayjs';
 import { NgbDateAdapter, NgbDatepickerConfig } from '@ng-bootstrap/ng-bootstrap';
 
 import { ApplicationConfigService } from 'app/core/config/application-config.service';
 import './config/dayjs';
 import { SharedModule } from 'app/shared/shared.module';
+<%_ if (enableTranslation) { _%>
+import { TranslationModule } from 'app/shared/language/translation.module';
+<%_ } _%>
 import { AppRoutingModule } from './app-routing.module';
 import { HomeModule } from './home/home.module';
-import { EntityRoutingModule } from './entities/entity-routing.module';
 // jhipster-needle-angular-add-module-import JHipster will add new module here
 import { NgbDateDayjsAdapter } from './config/datepicker-adapter';
 import { fontAwesomeIcons } from './config/font-awesome-icons';
 import { httpInterceptorProviders } from 'app/core/interceptor/index';
 <%_ if (enableI18nRTL) { _%>
 import { FindLanguageFromKeyPipe } from 'app/shared/language/find-language-from-key.pipe';
 <%_ } _%>
-<%_ if (enableTranslation) { _%>
-import { translatePartialLoader, missingTranslationHandler } from './config/translation.config';
-<%_ } _%>
 import { MainComponent } from './layouts/main/main.component';
 import { NavbarComponent } from './layouts/navbar/navbar.component';
 import { FooterComponent } from './layouts/footer/footer.component';
@@ -67,24 +63,13 @@ import { ErrorComponent } from './layouts/error/error.component';
     SharedModule,
     HomeModule,
     // jhipster-needle-angular-add-module JHipster will add new module here
-    EntityRoutingModule,
     AppRoutingModule,
     // Set this to true to enable service worker (PWA)
     ServiceWorkerModule.register('ngsw-worker.js', { enabled: false }),
     HttpClientModule,
     NgxWebstorageModule.forRoot({ prefix: '<%= jhiPrefixDashed %>', separator: '-', caseSensitive: true }),
 <%_ if (enableTranslation) { _%>
-    TranslateModule.forRoot({
-      loader: {
-        provide: TranslateLoader,
-        useFactory: translatePartialLoader,
-        deps: [HttpClient],
-      },
-      missingTranslationHandler: {
-        provide: MissingTranslationHandler,
-        useFactory: missingTranslationHandler,
-      },
-    }),
+    TranslationModule,
 <%_ } _%>
   ],
   providers: [
@@ -112,19 +97,13 @@ import { ErrorComponent } from './layouts/error/error.component';
   bootstrap: [MainComponent],
 })
 export class AppModule {
-  constructor(applicationConfigService: ApplicationConfigService, iconLibrary: FaIconLibrary, dpConfig: NgbDatepickerConfig<% if (enableTranslation) { %>, translateService: TranslateService, sessionStorageService: SessionStorageService<% } %>) {
+  constructor(applicationConfigService: ApplicationConfigService, iconLibrary: FaIconLibrary, dpConfig: NgbDatepickerConfig) {
 <%_ if (applicationTypeMicroservice) { _%>
     applicationConfigService.setMicrofrontend();
 <%_ } _%>
     applicationConfigService.setEndpointPrefix(SERVER_API_URL);
     registerLocaleData(locale);
     iconLibrary.addIcons(...fontAwesomeIcons);
     dpConfig.minDate = { year: dayjs().subtract(100, 'year').year(), month: 1, day: 1 };
-<%_ if (enableTranslation) { _%>
-    translateService.setDefaultLang('<%= nativeLanguage %>');
-    // if user have changed language and navigates away from the application and back to the application then use previously choosed language
-    const langKey = sessionStorageService.retrieve('locale') ?? '<%= nativeLanguage %>';
-    translateService.use(langKey);
-<%_ } _%>
   }
 }

generators/client/templates/angular/src/main/webapp/app/entities/entity-navbar-items.ts.ejs

@@ -0,0 +1,29 @@
+<%#
+ Copyright 2013-2021 the original author or authors from the JHipster project.
+
+ This file is part of the JHipster project, see https://www.jhipster.tech/
+ for more information.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+      https://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+-%>
+export const EntityNavbarItems = [
+<%_ for (const entity of localEntities) { _%>
+  {
+    name: '<%= entity.entityAngularName %>',
+    route: '<%= entity.entityPage %>',
+  <%_ if (enableTranslation) { _%>
+    translationKey: 'global.menu.entities.<%= entity.entityTranslationKey %>',
+  <%_ } _%>
+  },
+<%_ } _%>
+];

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

@@ -60,6 +60,26 @@
           </span>
         </a>
         <ul class="dropdown-menu" ngbDropdownMenu aria-labelledby="entity-menu">
+<%_ if (applicationTypeGateway) { _%>
+  <%_ for (const remote of microfrontends) { _%>
+          <li *ngFor="let entityNavbarItem of <%= remote.lowercaseBaseName %>EntityNavbarItems">
+            <a
+              class="dropdown-item"
+              [routerLink]="entityNavbarItem.route"
+              routerLinkActive="active"
+              [routerLinkActiveOptions]="{ exact: true }"
+              (click)="collapseNavbar()"
+            >
+              <fa-icon icon="asterisk" [fixedWidth]="true"></fa-icon>
+              <span
+    <%_ if (enableTranslation) { _%>
+              [jhiTranslate]="entityNavbarItem.translationKey"
+    <%_ } _%>
+              >{{entityNavbarItem.name}}</span>
+            </a>
+          </li>
+  <%_ } _%>
+<%_ } _%>
           <!-- jhipster-needle-add-entity-to-menu - JHipster will add entities to the menu here -->
         </ul>
       </li>

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

@@ -16,7 +16,7 @@
  See the License for the specific language governing permissions and
  limitations under the License.
 -%>
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit<% if (enableTranslation && applicationTypeGateway) { %>, Compiler, Injector, NgModuleFactory, Type<% } %> } from '@angular/core';
 import { Router } from '@angular/router';
 <%_ if (enableTranslation) { _%>
 import { TranslateService } from '@ngx-translate/core';
@@ -31,6 +31,7 @@ import { Account } from 'app/core/auth/account.model';
 import { AccountService } from 'app/core/auth/account.service';
 import { LoginService } from 'app/login/login.service';
 import { ProfileService } from 'app/layouts/profiles/profile.service';
+import { EntityNavbarItems } from 'app/entities/entity-navbar-items';
 
 @Component({
   selector: '<%= jhiPrefixDashed %>-navbar',
@@ -46,12 +47,22 @@ export class NavbarComponent implements OnInit {
   openAPIEnabled?: boolean;
   version = '';
   account: Account | null = null;
+  entitiesNavbarItems: any[] = [];
+<%_ if (applicationTypeGateway) { _%>
+  <%_ for (const remote of microfrontends) { _%>
+  <%= remote.lowercaseBaseName %>EntityNavbarItems: any[] = [];
+  <%_ } _%>
+<%_ } _%>
 
   constructor(
     private loginService: LoginService,
 <%_ if (enableTranslation) { _%>
     private translateService: TranslateService,
     private sessionStorageService: SessionStorageService,
+  <%_ if (applicationTypeGateway) { _%>
+    private compiler: Compiler,
+    private injector: Injector,
+  <%_ } _%>
 <%_ } _%>
     private accountService: AccountService,
     private profileService: ProfileService,
@@ -63,11 +74,32 @@ export class NavbarComponent implements OnInit {
   }
 
   ngOnInit(): void {
+    this.entitiesNavbarItems = EntityNavbarItems;
     this.profileService.getProfileInfo().subscribe(profileInfo => {
       this.inProduction = profileInfo.inProduction;
       this.openAPIEnabled = profileInfo.openAPIEnabled;
     });
-    this.accountService.getAuthenticationState().subscribe(account => (this.account = account));
+
+    this.accountService.getAuthenticationState().subscribe(account => {
+      this.account = account;
+    <%_ if (applicationTypeGateway) { _%>
+  <%_ for (const remote of microfrontends) { _%>
+      import('<%= remote.lowercaseBaseName %>/entity-navbar-items').then(
+        <%= enableTranslation ? 'async ' : '' %>({ EntityNavbarItems: <%= remote.capitalizedBaseName %>EntityNavbarItems }) => {
+          this.<%= remote.lowercaseBaseName %>EntityNavbarItems = <%= remote.capitalizedBaseName %>EntityNavbarItems;
+    <%_ if (enableTranslation) { _%>
+          const { LazyTranslationModule } = await import('<%= remote.lowercaseBaseName %>/translation-module');
+          this.loadModule(LazyTranslationModule as Type<any>);
+    <%_ } _%>
+        },
+        () => {
+          // eslint-disable-next-line no-console
+          console.log('Error loading <%= remote.lowercaseBaseName %> entities');
+        }
+      );
+  <%_ } _%>
+<%_ } _%>
+    });
   }
 
 <%_ if (enableTranslation) { _%>
@@ -98,4 +130,11 @@ export class NavbarComponent implements OnInit {
   toggleNavbar(): void {
     this.isNavbarCollapsed = !this.isNavbarCollapsed;
   }
+<%_ if (enableTranslation && applicationTypeGateway) { _%>
+
+  private loadModule(moduleType: Type<any>): void {
+    const moduleFactory = this.compiler.compileModuleAndAllComponentsSync(moduleType);
+    moduleFactory.ngModuleFactory.create(this.injector);
+  }
+<%_ } _%>
 }