UserAccount

src/main/webapp/app/entities/entities-menu.vue

@@ -16,6 +16,10 @@
       <font-awesome-icon icon="asterisk" />
       <span>Transaction</span>
     </b-dropdown-item>
+    <b-dropdown-item to="/user-account">
+      <font-awesome-icon icon="asterisk" />
+      <span>User Account</span>
+    </b-dropdown-item>
     <!-- jhipster-needle-add-entity-to-menu - JHipster will add entities to the menu here -->
   </div>
 </template>

src/main/webapp/app/entities/entities.component.ts

@@ -4,6 +4,7 @@ import ChargeService from './charge/charge.service';
 import EventService from './event/event.service';
 import RegistrationService from './registration/registration.service';
 import TransactionService from './transaction/transaction.service';
+import UserAccountService from './user-account/user-account.service';
 import UserService from '@/entities/user/user.service';
 // jhipster-needle-add-entity-service-to-entities-component-import - JHipster will import entities services here
 
@@ -16,6 +17,7 @@ export default defineComponent({
     provide('eventService', () => new EventService());
     provide('registrationService', () => new RegistrationService());
     provide('transactionService', () => new TransactionService());
+    provide('userAccountService', () => new UserAccountService());
     // jhipster-needle-add-entity-service-to-entities-component - JHipster will import entities services here
   },
 });

src/main/webapp/app/entities/event/event.service.spec.ts

@@ -107,7 +107,7 @@ describe('Service Tests', () => {
       });
 
       it('should partial update a Event', async () => {
-        const patchObject = { cost: 1, ...new Event() };
+        const patchObject = { name: 'BBBBBB', playersLimit: 1, cost: 1, ...new Event() };
         const returnedFromService = Object.assign(patchObject, elemDefault);
 
         const expected = { date: currentDate, ...returnedFromService };

src/main/webapp/app/entities/transaction/transaction.service.spec.ts

@@ -100,7 +100,7 @@ describe('Service Tests', () => {
       });
 
       it('should partial update a Transaction', async () => {
-        const patchObject = { type: 'BBBBBB', date: dayjs(currentDate).format(DATE_FORMAT), ...new Transaction() };
+        const patchObject = { ...new Transaction() };
         const returnedFromService = Object.assign(patchObject, elemDefault);
 
         const expected = { date: currentDate, ...returnedFromService };

src/main/webapp/app/entities/user-account/user-account-details.component.spec.ts

@@ -0,0 +1,89 @@
+/* tslint:disable max-line-length */
+import { vitest } from 'vitest';
+import { type MountingOptions, shallowMount } from '@vue/test-utils';
+import sinon, { type SinonStubbedInstance } from 'sinon';
+import { type RouteLocation } from 'vue-router';
+
+import UserAccountDetails from './user-account-details.vue';
+import UserAccountService from './user-account.service';
+import AlertService from '@/shared/alert/alert.service';
+
+type UserAccountDetailsComponentType = InstanceType<typeof UserAccountDetails>;
+
+let route: Partial<RouteLocation>;
+const routerGoMock = vitest.fn();
+
+vitest.mock('vue-router', () => ({
+  useRoute: () => route,
+  useRouter: () => ({ go: routerGoMock }),
+}));
+
+const userAccountSample = { id: 123 };
+
+describe('Component Tests', () => {
+  let alertService: AlertService;
+
+  afterEach(() => {
+    vitest.resetAllMocks();
+  });
+
+  describe('UserAccount Management Detail Component', () => {
+    let userAccountServiceStub: SinonStubbedInstance<UserAccountService>;
+    let mountOptions: MountingOptions<UserAccountDetailsComponentType>['global'];
+
+    beforeEach(() => {
+      route = {};
+      userAccountServiceStub = sinon.createStubInstance<UserAccountService>(UserAccountService);
+
+      alertService = new AlertService({
+        bvToast: {
+          toast: vitest.fn(),
+        } as any,
+      });
+
+      mountOptions = {
+        stubs: {
+          'font-awesome-icon': true,
+          'router-link': true,
+        },
+        provide: {
+          alertService,
+          userAccountService: () => userAccountServiceStub,
+        },
+      };
+    });
+
+    describe('Navigate to details', () => {
+      it('Should call load all on init', async () => {
+        // GIVEN
+        userAccountServiceStub.find.resolves(userAccountSample);
+        route = {
+          params: {
+            userAccountId: `${123}`,
+          },
+        };
+        const wrapper = shallowMount(UserAccountDetails, { global: mountOptions });
+        const comp = wrapper.vm;
+        // WHEN
+        await comp.$nextTick();
+
+        // THEN
+        expect(comp.userAccount).toMatchObject(userAccountSample);
+      });
+    });
+
+    describe('Previous state', () => {
+      it('Should go previous state', async () => {
+        userAccountServiceStub.find.resolves(userAccountSample);
+        const wrapper = shallowMount(UserAccountDetails, { global: mountOptions });
+        const comp = wrapper.vm;
+        await comp.$nextTick();
+
+        comp.previousState();
+        await comp.$nextTick();
+
+        expect(routerGoMock).toHaveBeenCalledWith(-1);
+      });
+    });
+  });
+});

src/main/webapp/app/entities/user-account/user-account-details.component.ts

@@ -0,0 +1,41 @@
+import { type Ref, defineComponent, inject, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+
+import UserAccountService from './user-account.service';
+import { type IUserAccount } from '@/shared/model/user-account.model';
+import { useAlertService } from '@/shared/alert/alert.service';
+
+export default defineComponent({
+  compatConfig: { MODE: 3 },
+  name: 'UserAccountDetails',
+  setup() {
+    const userAccountService = inject('userAccountService', () => new UserAccountService());
+    const alertService = inject('alertService', () => useAlertService(), true);
+
+    const route = useRoute();
+    const router = useRouter();
+
+    const previousState = () => router.go(-1);
+    const userAccount: Ref<IUserAccount> = ref({});
+
+    const retrieveUserAccount = async userAccountId => {
+      try {
+        const res = await userAccountService().find(userAccountId);
+        userAccount.value = res;
+      } catch (error) {
+        alertService.showHttpError(error.response);
+      }
+    };
+
+    if (route.params?.userAccountId) {
+      retrieveUserAccount(route.params.userAccountId);
+    }
+
+    return {
+      alertService,
+      userAccount,
+
+      previousState,
+    };
+  },
+});

src/main/webapp/app/entities/user-account/user-account-details.vue

@@ -0,0 +1,41 @@
+<template>
+  <div class="row justify-content-center">
+    <div class="col-8">
+      <div v-if="userAccount">
+        <h2 class="jh-entity-heading" data-cy="userAccountDetailsHeading"><span>User Account</span> {{ userAccount.id }}</h2>
+        <dl class="row jh-entity-details">
+          <dt>
+            <span>Name</span>
+          </dt>
+          <dd>
+            <span>{{ userAccount.name }}</span>
+          </dd>
+          <dt>
+            <span>User</span>
+          </dt>
+          <dd>
+            <span v-for="(user, i) in userAccount.users" :key="user.id"
+              >{{ i > 0 ? ', ' : '' }}
+              {{ user.login }}
+            </span>
+          </dd>
+        </dl>
+        <button type="submit" @click.prevent="previousState()" class="btn btn-info" data-cy="entityDetailsBackButton">
+          <font-awesome-icon icon="arrow-left"></font-awesome-icon>&nbsp;<span>Back</span>
+        </button>
+        <router-link
+          v-if="userAccount.id"
+          :to="{ name: 'UserAccountEdit', params: { userAccountId: userAccount.id } }"
+          custom
+          v-slot="{ navigate }"
+        >
+          <button @click="navigate" class="btn btn-primary">
+            <font-awesome-icon icon="pencil-alt"></font-awesome-icon>&nbsp;<span>Edit</span>
+          </button>
+        </router-link>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" src="./user-account-details.component.ts"></script>

src/main/webapp/app/entities/user-account/user-account-update.component.spec.ts

@@ -0,0 +1,138 @@
+/* tslint:disable max-line-length */
+import { vitest } from 'vitest';
+import { type MountingOptions, shallowMount } from '@vue/test-utils';
+import sinon, { type SinonStubbedInstance } from 'sinon';
+import { type RouteLocation } from 'vue-router';
+
+import UserAccountUpdate from './user-account-update.vue';
+import UserAccountService from './user-account.service';
+import AlertService from '@/shared/alert/alert.service';
+
+import UserService from '@/entities/user/user.service';
+
+type UserAccountUpdateComponentType = InstanceType<typeof UserAccountUpdate>;
+
+let route: Partial<RouteLocation>;
+const routerGoMock = vitest.fn();
+
+vitest.mock('vue-router', () => ({
+  useRoute: () => route,
+  useRouter: () => ({ go: routerGoMock }),
+}));
+
+const userAccountSample = { id: 123 };
+
+describe('Component Tests', () => {
+  let mountOptions: MountingOptions<UserAccountUpdateComponentType>['global'];
+  let alertService: AlertService;
+
+  describe('UserAccount Management Update Component', () => {
+    let comp: UserAccountUpdateComponentType;
+    let userAccountServiceStub: SinonStubbedInstance<UserAccountService>;
+
+    beforeEach(() => {
+      route = {};
+      userAccountServiceStub = sinon.createStubInstance<UserAccountService>(UserAccountService);
+      userAccountServiceStub.retrieve.onFirstCall().resolves(Promise.resolve([]));
+
+      alertService = new AlertService({
+        bvToast: {
+          toast: vitest.fn(),
+        } as any,
+      });
+
+      mountOptions = {
+        stubs: {
+          'font-awesome-icon': true,
+          'b-input-group': true,
+          'b-input-group-prepend': true,
+          'b-form-datepicker': true,
+          'b-form-input': true,
+        },
+        provide: {
+          alertService,
+          userAccountService: () => userAccountServiceStub,
+
+          userService: () =>
+            sinon.createStubInstance<UserService>(UserService, {
+              retrieve: sinon.stub().resolves({}),
+            } as any),
+        },
+      };
+    });
+
+    afterEach(() => {
+      vitest.resetAllMocks();
+    });
+
+    describe('save', () => {
+      it('Should call update service on save for existing entity', async () => {
+        // GIVEN
+        const wrapper = shallowMount(UserAccountUpdate, { global: mountOptions });
+        comp = wrapper.vm;
+        comp.userAccount = userAccountSample;
+        userAccountServiceStub.update.resolves(userAccountSample);
+
+        // WHEN
+        comp.save();
+        await comp.$nextTick();
+
+        // THEN
+        expect(userAccountServiceStub.update.calledWith(userAccountSample)).toBeTruthy();
+        expect(comp.isSaving).toEqual(false);
+      });
+
+      it('Should call create service on save for new entity', async () => {
+        // GIVEN
+        const entity = {};
+        userAccountServiceStub.create.resolves(entity);
+        const wrapper = shallowMount(UserAccountUpdate, { global: mountOptions });
+        comp = wrapper.vm;
+        comp.userAccount = entity;
+
+        // WHEN
+        comp.save();
+        await comp.$nextTick();
+
+        // THEN
+        expect(userAccountServiceStub.create.calledWith(entity)).toBeTruthy();
+        expect(comp.isSaving).toEqual(false);
+      });
+    });
+
+    describe('Before route enter', () => {
+      it('Should retrieve data', async () => {
+        // GIVEN
+        userAccountServiceStub.find.resolves(userAccountSample);
+        userAccountServiceStub.retrieve.resolves([userAccountSample]);
+
+        // WHEN
+        route = {
+          params: {
+            userAccountId: `${userAccountSample.id}`,
+          },
+        };
+        const wrapper = shallowMount(UserAccountUpdate, { global: mountOptions });
+        comp = wrapper.vm;
+        await comp.$nextTick();
+
+        // THEN
+        expect(comp.userAccount).toMatchObject(userAccountSample);
+      });
+    });
+
+    describe('Previous state', () => {
+      it('Should go previous state', async () => {
+        userAccountServiceStub.find.resolves(userAccountSample);
+        const wrapper = shallowMount(UserAccountUpdate, { global: mountOptions });
+        comp = wrapper.vm;
+        await comp.$nextTick();
+
+        comp.previousState();
+        await comp.$nextTick();
+
+        expect(routerGoMock).toHaveBeenCalledWith(-1);
+      });
+    });
+  });
+});

src/main/webapp/app/entities/user-account/user-account-update.component.ts

@@ -0,0 +1,112 @@
+import { type Ref, computed, defineComponent, inject, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { useVuelidate } from '@vuelidate/core';
+
+import UserAccountService from './user-account.service';
+import { useValidation } from '@/shared/composables';
+import { useAlertService } from '@/shared/alert/alert.service';
+
+import UserService from '@/entities/user/user.service';
+import { type IUserAccount, UserAccount } from '@/shared/model/user-account.model';
+
+export default defineComponent({
+  compatConfig: { MODE: 3 },
+  name: 'UserAccountUpdate',
+  setup() {
+    const userAccountService = inject('userAccountService', () => new UserAccountService());
+    const alertService = inject('alertService', () => useAlertService(), true);
+
+    const userAccount: Ref<IUserAccount> = ref(new UserAccount());
+    const userService = inject('userService', () => new UserService());
+    const users: Ref<Array<any>> = ref([]);
+    const isSaving = ref(false);
+    const currentLanguage = inject('currentLanguage', () => computed(() => navigator.language ?? 'en'), true);
+
+    const route = useRoute();
+    const router = useRouter();
+
+    const previousState = () => router.go(-1);
+
+    const retrieveUserAccount = async userAccountId => {
+      try {
+        const res = await userAccountService().find(userAccountId);
+        userAccount.value = res;
+      } catch (error) {
+        alertService.showHttpError(error.response);
+      }
+    };
+
+    if (route.params?.userAccountId) {
+      retrieveUserAccount(route.params.userAccountId);
+    }
+
+    const initRelationships = () => {
+      userService()
+        .retrieve()
+        .then(res => {
+          users.value = res.data;
+        });
+    };
+
+    initRelationships();
+
+    const validations = useValidation();
+    const validationRules = {
+      name: {},
+      users: {},
+    };
+    const v$ = useVuelidate(validationRules, userAccount as any);
+    v$.value.$validate();
+
+    return {
+      userAccountService,
+      alertService,
+      userAccount,
+      previousState,
+      isSaving,
+      currentLanguage,
+      users,
+      v$,
+    };
+  },
+  created(): void {
+    this.userAccount.users = [];
+  },
+  methods: {
+    save(): void {
+      this.isSaving = true;
+      if (this.userAccount.id) {
+        this.userAccountService()
+          .update(this.userAccount)
+          .then(param => {
+            this.isSaving = false;
+            this.previousState();
+            this.alertService.showInfo(`A UserAccount is updated with identifier ${param.id}`);
+          })
+          .catch(error => {
+            this.isSaving = false;
+            this.alertService.showHttpError(error.response);
+          });
+      } else {
+        this.userAccountService()
+          .create(this.userAccount)
+          .then(param => {
+            this.isSaving = false;
+            this.previousState();
+            this.alertService.showSuccess(`A UserAccount is created with identifier ${param.id}`);
+          })
+          .catch(error => {
+            this.isSaving = false;
+            this.alertService.showHttpError(error.response);
+          });
+      }
+    },
+
+    getSelected(selectedVals, option, pkField = 'id'): any {
+      if (selectedVals) {
+        return selectedVals.find(value => option[pkField] === value[pkField]) ?? option;
+      }
+      return option;
+    },
+  },
+});

src/main/webapp/app/entities/user-account/user-account-update.vue

@@ -0,0 +1,58 @@
+<template>
+  <div class="row justify-content-center">
+    <div class="col-8">
+      <form name="editForm" novalidate @submit.prevent="save()">
+        <h2 id="sasiedziApp.userAccount.home.createOrEditLabel" data-cy="UserAccountCreateUpdateHeading">Create or edit a User Account</h2>
+        <div>
+          <div class="form-group" v-if="userAccount.id">
+            <label for="id">ID</label>
+            <input type="text" class="form-control" id="id" name="id" v-model="userAccount.id" readonly />
+          </div>
+          <div class="form-group">
+            <label class="form-control-label" for="user-account-name">Name</label>
+            <input
+              type="text"
+              class="form-control"
+              name="name"
+              id="user-account-name"
+              data-cy="name"
+              :class="{ valid: !v$.name.$invalid, invalid: v$.name.$invalid }"
+              v-model="v$.name.$model"
+            />
+          </div>
+          <div class="form-group">
+            <label for="user-account-user">User</label>
+            <select
+              class="form-control"
+              id="user-account-users"
+              data-cy="user"
+              multiple
+              name="user"
+              v-if="userAccount.users !== undefined"
+              v-model="userAccount.users"
+            >
+              <option :value="getSelected(userAccount.users, userOption, 'id')" v-for="userOption in users" :key="userOption.id">
+                {{ userOption.login }}
+              </option>
+            </select>
+          </div>
+        </div>
+        <div>
+          <button type="button" id="cancel-save" data-cy="entityCreateCancelButton" class="btn btn-secondary" @click="previousState()">
+            <font-awesome-icon icon="ban"></font-awesome-icon>&nbsp;<span>Cancel</span>
+          </button>
+          <button
+            type="submit"
+            id="save-entity"
+            data-cy="entityCreateSaveButton"
+            :disabled="v$.$invalid || isSaving"
+            class="btn btn-primary"
+          >
+            <font-awesome-icon icon="save"></font-awesome-icon>&nbsp;<span>Save</span>
+          </button>
+        </div>
+      </form>
+    </div>
+  </div>
+</template>
+<script lang="ts" src="./user-account-update.component.ts"></script>

src/main/webapp/app/entities/user-account/user-account.component.spec.ts

@@ -0,0 +1,100 @@
+/* tslint:disable max-line-length */
+import { vitest } from 'vitest';
+import { type MountingOptions, shallowMount } from '@vue/test-utils';
+import sinon, { type SinonStubbedInstance } from 'sinon';
+
+import UserAccount from './user-account.vue';
+import UserAccountService from './user-account.service';
+import AlertService from '@/shared/alert/alert.service';
+
+type UserAccountComponentType = InstanceType<typeof UserAccount>;
+
+const bModalStub = {
+  render: () => {},
+  methods: {
+    hide: () => {},
+    show: () => {},
+  },
+};
+
+describe('Component Tests', () => {
+  let alertService: AlertService;
+
+  describe('UserAccount Management Component', () => {
+    let userAccountServiceStub: SinonStubbedInstance<UserAccountService>;
+    let mountOptions: MountingOptions<UserAccountComponentType>['global'];
+
+    beforeEach(() => {
+      userAccountServiceStub = sinon.createStubInstance<UserAccountService>(UserAccountService);
+      userAccountServiceStub.retrieve.resolves({ headers: {} });
+
+      alertService = new AlertService({
+        bvToast: {
+          toast: vitest.fn(),
+        } as any,
+      });
+
+      mountOptions = {
+        stubs: {
+          bModal: bModalStub as any,
+          'font-awesome-icon': true,
+          'b-badge': true,
+          'b-button': true,
+          'router-link': true,
+        },
+        directives: {
+          'b-modal': {},
+        },
+        provide: {
+          alertService,
+          userAccountService: () => userAccountServiceStub,
+        },
+      };
+    });
+
+    describe('Mount', () => {
+      it('Should call load all on init', async () => {
+        // GIVEN
+        userAccountServiceStub.retrieve.resolves({ headers: {}, data: [{ id: 123 }] });
+
+        // WHEN
+        const wrapper = shallowMount(UserAccount, { global: mountOptions });
+        const comp = wrapper.vm;
+        await comp.$nextTick();
+
+        // THEN
+        expect(userAccountServiceStub.retrieve.calledOnce).toBeTruthy();
+        expect(comp.userAccounts[0]).toEqual(expect.objectContaining({ id: 123 }));
+      });
+    });
+    describe('Handles', () => {
+      let comp: UserAccountComponentType;
+
+      beforeEach(async () => {
+        const wrapper = shallowMount(UserAccount, { global: mountOptions });
+        comp = wrapper.vm;
+        await comp.$nextTick();
+        userAccountServiceStub.retrieve.reset();
+        userAccountServiceStub.retrieve.resolves({ headers: {}, data: [] });
+      });
+
+      it('Should call delete service on confirmDelete', async () => {
+        // GIVEN
+        userAccountServiceStub.delete.resolves({});
+
+        // WHEN
+        comp.prepareRemove({ id: 123 });
+
+        comp.removeUserAccount();
+        await comp.$nextTick(); // clear components
+
+        // THEN
+        expect(userAccountServiceStub.delete.called).toBeTruthy();
+
+        // THEN
+        await comp.$nextTick(); // handle component clear watch
+        expect(userAccountServiceStub.retrieve.callCount).toEqual(1);
+      });
+    });
+  });
+});

src/main/webapp/app/entities/user-account/user-account.component.ts

@@ -0,0 +1,75 @@
+import { type Ref, defineComponent, inject, onMounted, ref } from 'vue';
+
+import UserAccountService from './user-account.service';
+import { type IUserAccount } from '@/shared/model/user-account.model';
+import { useAlertService } from '@/shared/alert/alert.service';
+
+export default defineComponent({
+  compatConfig: { MODE: 3 },
+  name: 'UserAccount',
+  setup() {
+    const userAccountService = inject('userAccountService', () => new UserAccountService());
+    const alertService = inject('alertService', () => useAlertService(), true);
+
+    const userAccounts: Ref<IUserAccount[]> = ref([]);
+
+    const isFetching = ref(false);
+
+    const clear = () => {};
+
+    const retrieveUserAccounts = async () => {
+      isFetching.value = true;
+      try {
+        const res = await userAccountService().retrieve();
+        userAccounts.value = res.data;
+      } catch (err) {
+        alertService.showHttpError(err.response);
+      } finally {
+        isFetching.value = false;
+      }
+    };
+
+    const handleSyncList = () => {
+      retrieveUserAccounts();
+    };
+
+    onMounted(async () => {
+      await retrieveUserAccounts();
+    });
+
+    const removeId: Ref<number> = ref(null);
+    const removeEntity = ref<any>(null);
+    const prepareRemove = (instance: IUserAccount) => {
+      removeId.value = instance.id;
+      removeEntity.value.show();
+    };
+    const closeDialog = () => {
+      removeEntity.value.hide();
+    };
+    const removeUserAccount = async () => {
+      try {
+        await userAccountService().delete(removeId.value);
+        const message = `A UserAccount is deleted with identifier ${removeId.value}`;
+        alertService.showInfo(message, { variant: 'danger' });
+        removeId.value = null;
+        retrieveUserAccounts();
+        closeDialog();
+      } catch (error) {
+        alertService.showHttpError(error.response);
+      }
+    };
+
+    return {
+      userAccounts,
+      handleSyncList,
+      isFetching,
+      retrieveUserAccounts,
+      clear,
+      removeId,
+      removeEntity,
+      prepareRemove,
+      closeDialog,
+      removeUserAccount,
+    };
+  },
+});

src/main/webapp/app/entities/user-account/user-account.service.spec.ts

@@ -0,0 +1,160 @@
+/* tslint:disable max-line-length */
+import axios from 'axios';
+import sinon from 'sinon';
+
+import UserAccountService from './user-account.service';
+import { UserAccount } from '@/shared/model/user-account.model';
+
+const error = {
+  response: {
+    status: null,
+    data: {
+      type: null,
+    },
+  },
+};
+
+const axiosStub = {
+  get: sinon.stub(axios, 'get'),
+  post: sinon.stub(axios, 'post'),
+  put: sinon.stub(axios, 'put'),
+  patch: sinon.stub(axios, 'patch'),
+  delete: sinon.stub(axios, 'delete'),
+};
+
+describe('Service Tests', () => {
+  describe('UserAccount Service', () => {
+    let service: UserAccountService;
+    let elemDefault;
+
+    beforeEach(() => {
+      service = new UserAccountService();
+      elemDefault = new UserAccount(123, 'AAAAAAA');
+    });
+
+    describe('Service methods', () => {
+      it('should find an element', async () => {
+        const returnedFromService = { ...elemDefault };
+        axiosStub.get.resolves({ data: returnedFromService });
+
+        return service.find(123).then(res => {
+          expect(res).toMatchObject(elemDefault);
+        });
+      });
+
+      it('should not find an element', async () => {
+        axiosStub.get.rejects(error);
+        return service
+          .find(123)
+          .then()
+          .catch(err => {
+            expect(err).toMatchObject(error);
+          });
+      });
+
+      it('should create a UserAccount', async () => {
+        const returnedFromService = { id: 123, ...elemDefault };
+        const expected = { ...returnedFromService };
+
+        axiosStub.post.resolves({ data: returnedFromService });
+        return service.create({}).then(res => {
+          expect(res).toMatchObject(expected);
+        });
+      });
+
+      it('should not create a UserAccount', async () => {
+        axiosStub.post.rejects(error);
+
+        return service
+          .create({})
+          .then()
+          .catch(err => {
+            expect(err).toMatchObject(error);
+          });
+      });
+
+      it('should update a UserAccount', async () => {
+        const returnedFromService = { name: 'BBBBBB', ...elemDefault };
+
+        const expected = { ...returnedFromService };
+        axiosStub.put.resolves({ data: returnedFromService });
+
+        return service.update(expected).then(res => {
+          expect(res).toMatchObject(expected);
+        });
+      });
+
+      it('should not update a UserAccount', async () => {
+        axiosStub.put.rejects(error);
+
+        return service
+          .update({})
+          .then()
+          .catch(err => {
+            expect(err).toMatchObject(error);
+          });
+      });
+
+      it('should partial update a UserAccount', async () => {
+        const patchObject = { name: 'BBBBBB', ...new UserAccount() };
+        const returnedFromService = Object.assign(patchObject, elemDefault);
+
+        const expected = { ...returnedFromService };
+        axiosStub.patch.resolves({ data: returnedFromService });
+
+        return service.partialUpdate(patchObject).then(res => {
+          expect(res).toMatchObject(expected);
+        });
+      });
+
+      it('should not partial update a UserAccount', async () => {
+        axiosStub.patch.rejects(error);
+
+        return service
+          .partialUpdate({})
+          .then()
+          .catch(err => {
+            expect(err).toMatchObject(error);
+          });
+      });
+
+      it('should return a list of UserAccount', async () => {
+        const returnedFromService = { name: 'BBBBBB', ...elemDefault };
+        const expected = { ...returnedFromService };
+        axiosStub.get.resolves([returnedFromService]);
+        return service.retrieve().then(res => {
+          expect(res).toContainEqual(expected);
+        });
+      });
+
+      it('should not return a list of UserAccount', async () => {
+        axiosStub.get.rejects(error);
+
+        return service
+          .retrieve()
+          .then()
+          .catch(err => {
+            expect(err).toMatchObject(error);
+          });
+      });
+
+      it('should delete a UserAccount', async () => {
+        axiosStub.delete.resolves({ ok: true });
+        return service.delete(123).then(res => {
+          expect(res.ok).toBeTruthy();
+        });
+      });
+
+      it('should not delete a UserAccount', async () => {
+        axiosStub.delete.rejects(error);
+
+        return service
+          .delete(123)
+          .then()
+          .catch(err => {
+            expect(err).toMatchObject(error);
+          });
+      });
+    });
+  });
+});

src/main/webapp/app/entities/user-account/user-account.service.ts

@@ -0,0 +1,85 @@
+import axios from 'axios';
+
+import { type IUserAccount } from '@/shared/model/user-account.model';
+
+const baseApiUrl = 'api/user-accounts';
+
+export default class UserAccountService {
+  public find(id: number): Promise<IUserAccount> {
+    return new Promise<IUserAccount>((resolve, reject) => {
+      axios
+        .get(`${baseApiUrl}/${id}`)
+        .then(res => {
+          resolve(res.data);
+        })
+        .catch(err => {
+          reject(err);
+        });
+    });
+  }
+
+  public retrieve(): Promise<any> {
+    return new Promise<any>((resolve, reject) => {
+      axios
+        .get(baseApiUrl)
+        .then(res => {
+          resolve(res);
+        })
+        .catch(err => {
+          reject(err);
+        });
+    });
+  }
+
+  public delete(id: number): Promise<any> {
+    return new Promise<any>((resolve, reject) => {
+      axios
+        .delete(`${baseApiUrl}/${id}`)
+        .then(res => {
+          resolve(res);
+        })
+        .catch(err => {
+          reject(err);
+        });
+    });
+  }
+
+  public create(entity: IUserAccount): Promise<IUserAccount> {
+    return new Promise<IUserAccount>((resolve, reject) => {
+      axios
+        .post(`${baseApiUrl}`, entity)
+        .then(res => {
+          resolve(res.data);
+        })
+        .catch(err => {
+          reject(err);
+        });
+    });
+  }
+
+  public update(entity: IUserAccount): Promise<IUserAccount> {
+    return new Promise<IUserAccount>((resolve, reject) => {
+      axios
+        .put(`${baseApiUrl}/${entity.id}`, entity)
+        .then(res => {
+          resolve(res.data);
+        })
+        .catch(err => {
+          reject(err);
+        });
+    });
+  }
+
+  public partialUpdate(entity: IUserAccount): Promise<IUserAccount> {
+    return new Promise<IUserAccount>((resolve, reject) => {
+      axios
+        .patch(`${baseApiUrl}/${entity.id}`, entity)
+        .then(res => {
+          resolve(res.data);
+        })
+        .catch(err => {
+          reject(err);
+        });
+    });
+  }
+}

src/main/webapp/app/entities/user-account/user-account.vue

@@ -0,0 +1,103 @@
+<template>
+  <div>
+    <h2 id="page-heading" data-cy="UserAccountHeading">
+      <span id="user-account-heading">User Accounts</span>
+      <div class="d-flex justify-content-end">
+        <button class="btn btn-info mr-2" @click="handleSyncList" :disabled="isFetching">
+          <font-awesome-icon icon="sync" :spin="isFetching"></font-awesome-icon> <span>Refresh list</span>
+        </button>
+        <router-link :to="{ name: 'UserAccountCreate' }" custom v-slot="{ navigate }">
+          <button
+            @click="navigate"
+            id="jh-create-entity"
+            data-cy="entityCreateButton"
+            class="btn btn-primary jh-create-entity create-user-account"
+          >
+            <font-awesome-icon icon="plus"></font-awesome-icon>
+            <span>Create a new User Account</span>
+          </button>
+        </router-link>
+      </div>
+    </h2>
+    <br />
+    <div class="alert alert-warning" v-if="!isFetching && userAccounts && userAccounts.length === 0">
+      <span>No User Accounts found</span>
+    </div>
+    <div class="table-responsive" v-if="userAccounts && userAccounts.length > 0">
+      <table class="table table-striped" aria-describedby="userAccounts">
+        <thead>
+          <tr>
+            <th scope="row"><span>ID</span></th>
+            <th scope="row"><span>Name</span></th>
+            <th scope="row"><span>User</span></th>
+            <th scope="row"></th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-for="userAccount in userAccounts" :key="userAccount.id" data-cy="entityTable">
+            <td>
+              <router-link :to="{ name: 'UserAccountView', params: { userAccountId: userAccount.id } }">{{ userAccount.id }}</router-link>
+            </td>
+            <td>{{ userAccount.name }}</td>
+            <td>
+              <span v-for="(user, i) in userAccount.users" :key="user.id"
+                >{{ i > 0 ? ', ' : '' }}
+                {{ user.login }}
+              </span>
+            </td>
+            <td class="text-right">
+              <div class="btn-group">
+                <router-link :to="{ name: 'UserAccountView', params: { userAccountId: userAccount.id } }" custom v-slot="{ navigate }">
+                  <button @click="navigate" class="btn btn-info btn-sm details" data-cy="entityDetailsButton">
+                    <font-awesome-icon icon="eye"></font-awesome-icon>
+                    <span class="d-none d-md-inline">View</span>
+                  </button>
+                </router-link>
+                <router-link :to="{ name: 'UserAccountEdit', params: { userAccountId: userAccount.id } }" custom v-slot="{ navigate }">
+                  <button @click="navigate" class="btn btn-primary btn-sm edit" data-cy="entityEditButton">
+                    <font-awesome-icon icon="pencil-alt"></font-awesome-icon>
+                    <span class="d-none d-md-inline">Edit</span>
+                  </button>
+                </router-link>
+                <b-button
+                  @click="prepareRemove(userAccount)"
+                  variant="danger"
+                  class="btn btn-sm"
+                  data-cy="entityDeleteButton"
+                  v-b-modal.removeEntity
+                >
+                  <font-awesome-icon icon="times"></font-awesome-icon>
+                  <span class="d-none d-md-inline">Delete</span>
+                </b-button>
+              </div>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <b-modal ref="removeEntity" id="removeEntity">
+      <template #modal-title>
+        <span id="sasiedziApp.userAccount.delete.question" data-cy="userAccountDeleteDialogHeading">Confirm delete operation</span>
+      </template>
+      <div class="modal-body">
+        <p id="jhi-delete-userAccount-heading">Are you sure you want to delete User Account {{ removeId }}?</p>
+      </div>
+      <template #modal-footer>
+        <div>
+          <button type="button" class="btn btn-secondary" @click="closeDialog()">Cancel</button>
+          <button
+            type="button"
+            class="btn btn-primary"
+            id="jhi-confirm-delete-userAccount"
+            data-cy="entityConfirmDeleteButton"
+            @click="removeUserAccount()"
+          >
+            Delete
+          </button>
+        </div>
+      </template>
+    </b-modal>
+  </div>
+</template>
+
+<script lang="ts" src="./user-account.component.ts"></script>