generator-jhipster 8.0.0-beta.3 → 8.0.0

package/dist/generators/vue/templates/src/main/webapp/app/admin/user-management/user-management-view.component.spec.ts.ejs

@@ -5,7 +5,7 @@ import { vitest } from 'vitest';
 import { shallowMount } from '@vue/test-utils';
 import axios from 'axios';
 import sinon from 'sinon';
-import { RouteLocation, Router } from 'vue-router';
+import { type RouteLocation, type Router } from 'vue-router';
 
 import AlertService from '@/shared/alert/alert.service';
 import UserManagementView from './user-management-view.vue';

package/dist/generators/vue/templates/src/main/webapp/app/admin/user-management/user-management-view.component.ts.ejs

@@ -1,4 +1,4 @@
-import { defineComponent, inject, ref, Ref } from 'vue';
+import { defineComponent, inject, ref, type Ref } from 'vue';
 <%_ if (enableTranslation) { _%>
 import { useI18n } from 'vue-i18n';
 <%_ } _%>

package/dist/generators/vue/templates/src/main/webapp/app/admin/user-management/user-management.component.ts.ejs

@@ -1,4 +1,4 @@
-import { ComputedRef, defineComponent, inject, Ref, ref } from 'vue';
+import { type ComputedRef, defineComponent, inject, type Ref, ref } from 'vue';
 <%_ if (enableTranslation) { _%>
 import { useI18n } from 'vue-i18n';
 <%_ } _%>

package/dist/generators/vue/templates/src/main/webapp/app/admin/user-management/user-management.service.ts.ejs

@@ -3,7 +3,7 @@ import buildPaginationQueryOpts from '@/shared/sort/sorts';
 <%_ if (databaseTypeCassandra) { _%>
 import {Authority} from '@/shared/security/authority'
 <%_ } _%>
-import { IUser } from '@/shared/model/user.model';
+import { type IUser } from '@/shared/model/user.model';
 
 export default class UserManagementService {
 

package/dist/generators/vue/templates/src/main/webapp/app/core/error/error.component.spec.ts.ejs

@@ -1,11 +1,11 @@
 import { vitest } from 'vitest';
-import { Ref, ref } from 'vue';
+import { type Ref, ref } from 'vue';
 import { shallowMount } from '@vue/test-utils';
-import { RouteLocation } from 'vue-router';
+import { type RouteLocation } from 'vue-router';
 
 import Error from './error.vue';
 
-import LoginService from '@/account/login.service';
+import <% if (authenticationTypeOauth2) { %>type <% } %>LoginService from '@/account/login.service';
 
 type ErrorComponentType = InstanceType<typeof Error>;
 

package/dist/generators/vue/templates/src/main/webapp/app/core/error/error.component.ts.ejs

@@ -1,8 +1,8 @@
-import { ComputedRef, defineComponent, inject, Ref, ref } from 'vue';
+import { type ComputedRef, defineComponent, inject, type Ref, ref } from 'vue';
 <%_ if (enableTranslation) { _%>
 import { useI18n } from 'vue-i18n';
 <%_ } _%>
-import LoginService from '@/account/login.service';
+import type LoginService from '@/account/login.service';
 import { useRoute } from 'vue-router';
 
 export default defineComponent({

package/dist/generators/vue/templates/src/main/webapp/app/core/home/home.component.ts.ejs

@@ -1,9 +1,9 @@
-import { ComputedRef, defineComponent, inject } from 'vue';
+import { type ComputedRef, defineComponent, inject } from 'vue';
 <%_ if (enableTranslation) { _%>
 import { useI18n } from 'vue-i18n';
 <%_ } _%>
 
-import LoginService from '@/account/login.service';
+import type LoginService from '@/account/login.service';
 
 export default defineComponent({
   compatConfig: { MODE: 3 },

package/dist/generators/vue/templates/src/main/webapp/app/core/jhi-navbar/jhi-navbar.component.spec.ts.ejs

@@ -2,12 +2,12 @@ import { vitest } from 'vitest';
 import { computed } from 'vue';
 import { shallowMount } from '@vue/test-utils';
 import JhiNavbar from './jhi-navbar.vue';
-import { Router } from 'vue-router';
+import { type Router } from 'vue-router';
 import { createTestingPinia } from '@pinia/testing';
 
 import { useStore } from '@/store';
 import { createRouter } from '@/router';
-import LoginService from '@/account/login.service';
+import <% if (authenticationTypeOauth2) { %>type <% } %>LoginService from '@/account/login.service';
 
 type JhiNavbarComponentType = InstanceType<typeof JhiNavbar>;
 

package/dist/generators/vue/templates/src/main/webapp/app/core/jhi-navbar/jhi-navbar.component.ts.ejs

@@ -1,8 +1,8 @@
-import { computed, <% if (applicationTypeGateway && microfrontend) { %>defineAsyncComponent, <% } %>defineComponent, inject, ref, Ref } from 'vue';
+import { computed, <% if (applicationTypeGateway && microfrontend) { %>defineAsyncComponent, <% } %>defineComponent, inject, ref, type Ref } from 'vue';
 <%_ if (enableTranslation) { _%>
 import { useI18n } from 'vue-i18n';
 <%_ } _%>
-import LoginService from '@/account/login.service';
+import type LoginService from '@/account/login.service';
 import type AccountService from '@/account/account.service';
 <%_ if (enableTranslation) { _%>
 import languages from '@/shared/config/languages';
@@ -11,6 +11,9 @@ import EntitiesMenu from '@/entities/entities-menu.vue';
 
 import { useStore } from '@/store';
 import { useRouter } from 'vue-router';
+<%_ if (applicationTypeGateway && microfrontend) { _%>
+import { importRemote } from '@module-federation/utilities';
+<%_ } _%>
 
 export default defineComponent({
   compatConfig: { MODE: 3 },
@@ -18,9 +21,13 @@ export default defineComponent({
   components: {
     'entities-menu': EntitiesMenu,
 <%_ if (applicationTypeGateway && microfrontend) { _%>
-  <%_ for (const microfrontend of microfrontends) { _%>
-    '<%= microfrontend.lowercaseBaseName %>-menu': defineAsyncComponent(() => {
-      return import('@<%= microfrontend.lowercaseBaseName %>/entities-menu').catch(() => import('@/core/error/error-loading.vue'));
+  <%_ for (const remote of microfrontends) { _%>
+    '<%= remote.lowercaseBaseName %>-menu': defineAsyncComponent(() => {
+      return importRemote<any>({
+        url: `./<%= remote.endpointPrefix %>`,
+        scope: '<%= remote.lowercaseBaseName %>',
+        module: './entities-menu',
+      }).catch(() => import('@/core/error/error-loading.vue'));
     }),
   <%_ } _%>
 <%_ } _%>
@@ -40,7 +47,7 @@ export default defineComponent({
     const router = useRouter();
     const store = useStore();
 
-    const version = 'v' + VERSION;
+    const version = 'v' + APP_VERSION;
     const hasAnyAuthorityValues: Ref<any> = ref({});
 
     const openAPIEnabled = computed(() => store.activeProfiles.indexOf('api-docs') > -1);

package/dist/generators/vue/templates/src/main/webapp/app/core/jhi-navbar/jhi-navbar.vue.ejs

@@ -177,7 +177,7 @@
     Navbar
     ========================================================================== */
   .navbar-version {
-    font-size: 10px;
+    font-size: 0.65em;
 <%_ if (clientThemeNone) { _%>
     color: #ccc;
 <%_ } _%>
@@ -243,7 +243,6 @@
 
   .navbar-title {
     display: inline-block;
-    vertical-align: middle;
 <%_ if (clientThemeNone && !clientThemeDark) { _%>
     color: white;
 <%_ } _%>
@@ -253,14 +252,14 @@
     Logo styles
     ========================================================================== */
   .navbar-brand.logo {
-    padding: 5px 15px;
+    padding: 0 7px;
   }
 
   .logo .logo-img {
     height: 45px;
     display: inline-block;
     vertical-align: middle;
-    width: 70px;
+    width: 45px;
   }
 
   .logo-img {

package/dist/generators/vue/templates/src/main/webapp/app/core/ribbon/ribbon.component.spec.ts.ejs

@@ -2,7 +2,7 @@ import { shallowMount } from "@vue/test-utils";
 import Ribbon from './ribbon.vue';
 
 import { createTestingPinia } from '@pinia/testing';
-import { AccountStore, useStore } from '@/store';
+import { type AccountStore, useStore } from '@/store';
 
 type RibbonComponentType = InstanceType<typeof Ribbon>;
 

package/dist/generators/vue/templates/src/main/webapp/app/declarations.d.ts.ejs

@@ -21,7 +21,7 @@
 // If you change the values in the webpack config files, you need to re run webpack to update the application
 
 declare const SERVER_API_URL: string;
-declare const VERSION: string;
+declare const APP_VERSION: string;
 <%_ if (enableTranslation) { _%>
 declare const I18N_HASH: string;
 <%_ } _%>

package/dist/generators/vue/templates/src/main/webapp/app/entities/_entityFolder_/_entityFile_-details.component.spec.ts.ejs

@@ -0,0 +1,113 @@
+<%#
+ Copyright 2013-2023 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.
+-%>
+<%_
+const tsKeyId = this.generateTestEntityId(primaryKey.type);
+_%>
+/* tslint:disable max-line-length */
+import { vitest } from 'vitest';
+import { shallowMount, type MountingOptions } from '@vue/test-utils';
+import sinon, { type SinonStubbedInstance } from 'sinon';
+import { type RouteLocation } from 'vue-router';
+
+import <%= entityAngularName %>Details from './<%= entityFileName %>-details.vue';
+import <%= entityAngularName %>Service from './<%= entityFileName %>.service';
+import AlertService from '@/shared/alert/alert.service';
+
+type <%= entityAngularName %>DetailsComponentType = InstanceType<typeof <%= entityAngularName %>Details>;
+
+let route: Partial<RouteLocation>;
+const routerGoMock = vitest.fn();
+
+vitest.mock('vue-router', () => ({
+  useRoute: () => route,
+  useRouter: () => ({ go: routerGoMock }),
+}));
+
+const <%= entityInstance %>Sample = { id: <%- tsKeyId %> };
+
+describe('Component Tests', () => {
+  let alertService: AlertService;
+
+  afterEach(() => {
+    vitest.resetAllMocks();
+  });
+
+  describe('<%= entityAngularName %> Management Detail Component', () => {
+    let <%= entityInstance %>ServiceStub: SinonStubbedInstance<<%= entityAngularName %>Service>;
+    let mountOptions: MountingOptions<<%= entityAngularName %>DetailsComponentType>['global'];
+
+    beforeEach(() => {
+      route = {};
+      <%= entityInstance %>ServiceStub = sinon.createStubInstance<<%= entityAngularName %>Service>(<%= entityAngularName %>Service);
+
+      alertService = new AlertService({
+<%_ if (enableTranslation) { _%>
+        i18n: { t: vitest.fn() } as any,
+<%_ } _%>
+        bvToast: {
+          toast: vitest.fn(),
+        } as any,
+      });
+
+      mountOptions = {
+        stubs: {
+          'font-awesome-icon': true,
+          'router-link': true,
+        },
+        provide: {
+          alertService,
+          <%= entityInstance %>Service: () => <%= entityInstance %>ServiceStub,
+        },
+      };
+    });
+
+    describe('Navigate to details', () => {
+      it('Should call load all on init', async () => {
+        // GIVEN
+        <%= entityInstance %>ServiceStub.find.resolves(<%= entityInstance %>Sample);
+        route = {
+          params: {
+            <%= entityInstance %>Id: '' + <%- tsKeyId %>,
+          },
+        };
+        const wrapper = shallowMount(<%= entityAngularName %>Details, { global: mountOptions });
+        const comp = wrapper.vm;
+        // WHEN
+        await comp.$nextTick();
+
+        // THEN
+        expect(comp.<%= entityInstance %>).toMatchObject(<%= entityInstance %>Sample);
+      });
+    });
+
+    describe('Previous state', () => {
+      it('Should go previous state', async () => {
+        <%= entityInstance %>ServiceStub.find.resolves(<%= entityInstance %>Sample);
+        const wrapper = shallowMount(<%= entityAngularName %>Details, { global: mountOptions });
+        const comp = wrapper.vm;
+        await comp.$nextTick();
+
+        comp.previousState();
+        await comp.$nextTick();
+
+        expect(routerGoMock).toHaveBeenCalledWith(-1);
+      });
+    });
+  });
+});

package/dist/generators/vue/templates/src/main/webapp/app/entities/_entityFolder_/_entityFile_-details.component.ts.ejs

@@ -0,0 +1,64 @@
+import { defineComponent, inject, ref, type Ref } from 'vue';
+<%_ if (enableTranslation) { _%>
+import { useI18n } from 'vue-i18n';
+<%_ } _%>
+import { useRoute, useRouter } from 'vue-router';
+
+<%_ if (anyFieldIsBlobDerived) { _%>
+import useDataUtils from '@/shared/data/data-utils.service';
+<%_ } _%>
+<%_ if (anyFieldIsDuration || anyFieldIsTimeDerived) { _%>
+import { useDateFormat } from '@/shared/composables'
+<%_ } _%>
+import { type I<%= entityAngularName %> } from '@/shared/model/<%= entityModelFileName %>.model';
+import <%= entityAngularName %>Service from './<%= entityFileName %>.service';
+import { useAlertService } from '@/shared/alert/alert.service';
+
+export default defineComponent({
+  compatConfig: { MODE: 3 },
+  name: '<%= entityAngularName %>Details',
+  setup() {
+<%_ if (anyFieldIsDuration || anyFieldIsTimeDerived) { _%>
+    const dateFormat = useDateFormat();
+<%_ } _%>
+    const <%= entityInstance %>Service = inject('<%= entityInstance %>Service', () => new <%= entityAngularName %>Service());
+    const alertService = inject('alertService', () => useAlertService(), true);
+
+<% if (anyFieldIsBlobDerived) { %>
+    const dataUtils = useDataUtils();
+<% } %>
+    const route = useRoute();
+    const router = useRouter();
+
+    const previousState = () => router.go(-1);
+    const <%= entityInstance %>: Ref<I<%= entityAngularName %>> = ref({});
+
+    const retrieve<%= entityAngularName %> = async <%= entityInstance %>Id => {
+      try {
+        const res = await <%= entityInstance %>Service().find(<%= entityInstance %>Id);
+        <%= entityInstance %>.value = res;
+      } catch (error) {
+        alertService.showHttpError(error.response);
+      }
+    };
+
+    if (route.params?.<%= entityInstance %>Id) {
+      retrieve<%= entityAngularName %>(route.params.<%= entityInstance %>Id);
+    }
+
+    return {
+<%_ if (anyFieldIsDuration || anyFieldIsTimeDerived) { _%>
+      ...dateFormat,
+<%_ } _%>
+      alertService,
+      <%= entityInstance %>,
+<% if (anyFieldIsBlobDerived) { %>
+      ...dataUtils,
+<% } %>
+      previousState,
+<%_ if (enableTranslation) { _%>
+      t$: useI18n().t,
+<%_ } _%>
+    };
+  },
+});

package/dist/generators/vue/templates/src/main/webapp/app/entities/_entityFolder_/_entityFile_-details.vue.ejs

@@ -0,0 +1,93 @@
+<template>
+    <div class="row justify-content-center">
+        <div class="col-8">
+            <div v-if="<%= entityInstance %>">
+                <h2 class="jh-entity-heading" data-cy="<%= entityInstance %>DetailsHeading"><span v-text="t$('<%= i18nKeyPrefix %>.detail.title')"><%= entityAngularName %></span> {{<%= entityInstance %>.id}}</h2>
+                <dl class="row jh-entity-details">
+<%_ for (field of fields.filter(field => !field.id)) {
+    const fieldName = field.fieldName;
+    const fieldType = field.fieldType;_%>
+                    <dt>
+                        <span v-text="t$('<%= i18nKeyPrefix %>.<%= fieldName %>')"><%= field.fieldNameHumanized %></span>
+                    </dt>
+                    <dd>
+  <%_ if (field.fieldIsEnum) { _%>
+                        <span v-text="t$('<%= frontendAppName %>.<%= fieldType %>.' + <%= entityInstance %>.<%= fieldName %>)">{{<%= entityInstance %>.<%= fieldName %>}}</span>
+  <%_ } else if (field.fieldTypeBinary && field.blobContentTypeImage) { _%>
+                        <div v-if="<%= entityInstance %>.<%= fieldName %>">
+                            <a v-on:click="openFile(<%= entityInstance %>.<%= fieldName %>ContentType, <%= entityInstance %>.<%= fieldName %>)">
+                                <img v-bind:src="'data:' + <%=entityInstance %>.<%= fieldName %>ContentType + ';base64,' + <%= entityInstance %>.<%= fieldName %>" style="max-width: 100%;" alt="<%=entityInstance %> image"/>
+                            </a>
+                            {{<%= entityInstance %>.<%= fieldName %>ContentType}}, {{byteSize(<%= entityInstance %>.<%= fieldName %>)}}
+                        </div>
+  <%_ } else if (field.fieldTypeBinary && field.blobContentTypeAny) { _%>
+                        <div v-if="<%= entityInstance %>.<%= fieldName %>">
+                            <a v-on:click="openFile(<%= entityInstance %>.<%= fieldName %>ContentType, <%= entityInstance %>.<%= fieldName %>)" v-text="t$('entity.action.open')">open</a>
+                            {{<%= entityInstance %>.<%= fieldName %>ContentType}}, {{byteSize(<%= entityInstance %>.<%= fieldName %>)}}
+                        </div>
+  <%_ } else if (field.fieldTypeDuration) { _%>
+                        <span>{{formatDuration(<%= entityInstance %>.<%= fieldName %>)}} ({{<%= entityInstance %>.<%= fieldName %>}})</span>
+  <%_ } else if (field.fieldTypeTimed) { _%>
+                        <span v-if="<%= entityInstance %>.<%=fieldName %>">{{formatDateLong(<%= entityInstance %>.<%=fieldName %>)}}</span>
+  <%_ } else { _%>
+                        <span>{{<%= entityInstance %>.<%= fieldName %>}}</span>
+  <%_ } _%>
+                    </dd>
+<%_ } _%>
+<%_ for (relationship of relationships) {
+    const ownerSide = relationship.ownerSide;
+    const relationshipName = relationship.relationshipName;
+    const relationshipFieldName = relationship.relationshipFieldName;
+    const relationshipFieldNamePlural = relationship.relationshipFieldNamePlural;
+    const relationshipNameHumanized = relationship.relationshipNameHumanized;
+    const otherEntityName = relationship.otherEntityName;
+    const otherEntityField = relationship.otherEntityField;
+    const otherEntityAngularName = relationship.otherEntityAngularName; _%>
+  <%_ if (ownerSide) { _%>
+                    <dt>
+                        <span v-text="t$('<%= i18nKeyPrefix %>.<%= relationshipName %>')"><%= relationshipNameHumanized %></span>
+                    </dt>
+                    <dd>
+    <%_ if (relationship.otherEntityUser) { _%>
+      <%_ if (relationship.relationshipManyToMany) { _%>
+                        <span v-for="(<%= relationshipFieldName %>, i) in <%= entityInstance %>.<%= relationshipFieldNamePlural %>" :key="<%= relationshipFieldName %>.id">{{i > 0 ? ', ' : ''}}
+                            {{<%= relationshipFieldName %>.<%= otherEntityField %>}}
+                        </span>
+      <%_ } else { _%>
+                        {{<%= entityInstance + "." + relationshipFieldName %> ? <%= entityInstance + "." + relationshipFieldName + "." + otherEntityField%> : ''}}
+      <%_ } _%>
+    <%_ } else { _%>
+      <%_ if (relationship.relationshipManyToMany) { _%>
+                        <span v-for="(<%= relationshipFieldName %>, i) in <%= entityInstance %>.<%= relationshipFieldNamePlural %>" :key="<%= relationshipFieldName %>.id">{{i > 0 ? ', ' : ''}}
+                            <router-link :to="{name: '<%= otherEntityAngularName %>View', params: {<%= otherEntityName %>Id: <%= relationshipFieldName %>.id}}">{{<%= relationshipFieldName + "." + otherEntityField %>}}</router-link>
+                        </span>
+      <%_ } else { _%>
+                        <div v-if="<%= entityInstance + '.' + relationshipFieldName %>">
+                            <router-link :to="{name: '<%= otherEntityAngularName %>View', params: {<%= otherEntityName %>Id: <%= entityInstance + "." + relationshipFieldName %>.id}}">{{<%= entityInstance + "." + relationshipFieldName + "." + otherEntityField %>}}</router-link>
+                        </div>
+      <%_ } _%>
+    <%_ } _%>
+                    </dd>
+  <%_ } _%>
+<%_ } _%>
+                </dl>
+                <button type="submit"
+                        v-on:click.prevent="previousState()"
+                        class="btn btn-info"
+                        data-cy="entityDetailsBackButton">
+                    <font-awesome-icon icon="arrow-left"></font-awesome-icon>&nbsp;<span v-text="t$('entity.action.back')"> Back</span>
+                </button>
+<%_ if (!readOnly) { _%>
+                <router-link v-if="<%= entityInstance %>.id" :to="{name: '<%= entityAngularName %>Edit', params: {<%= entityInstance %>Id: <%= entityInstance %>.id}}" custom v-slot="{ navigate }">
+                    <button @click="navigate" class="btn btn-primary">
+                        <font-awesome-icon icon="pencil-alt"></font-awesome-icon>&nbsp;<span v-text="t$('entity.action.edit')"> Edit</span>
+                    </button>
+                    </router-link>
+<%_ } _%>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script lang="ts" src="./<%= entityFileName %>-details.component.ts">
+</script>