OZG-4995 OZG-5230 Add edit and delete outputs for oeid-list

alfa-client/libs/admin-settings/src/lib/admin-settings.module.ts

@@ -21,7 +21,7 @@ import { OrganisationseinheitNavigationItemComponent } from './organisationseinh
 import KcAdminClient from '@keycloak/keycloak-admin-client';
 import { Environment, ENVIRONMENT_CONFIG } from '@alfa-client/environment-shared';
 import { MoreMenuComponent } from './shared/more-menu/more-menu.component';
-import { MoreItemButtonComponent } from './shared/more-menu/menu-item-button/more-item-button.component';
+import { MoreItemButtonComponent } from './shared/more-menu/more-item-button/more-item-button.component';
 
 @NgModule({
   declarations: [

alfa-client/libs/admin-settings/src/lib/organisationseinheit/organisationseinheit-container/organisationseinheit-list/organisationseinheit-list.component.html

@@ -21,8 +21,18 @@
     >
       OrganisationseinheitID: {{ group.organisationseinheitIds.join(', ') }}
       <admin-more-menu class="float-right">
-        <admin-menu-item-button more-menu-item label="Bearbeiten"></admin-menu-item-button>
-        <admin-menu-item-button more-menu-item label="Löschen"></admin-menu-item-button>
+        <admin-more-item-button
+          (clickEmitter)="editGroup.emit(group)"
+          more-menu-item
+          [attr.data-test-id]="'organisationseinheit-edit-' + group.id | convertForDataTest"
+          label="Bearbeiten"
+        ></admin-more-item-button>
+        <admin-more-item-button
+          (clickEmitter)="deleteGroup.emit(group)"
+          more-menu-item
+          [attr.data-test-id]="'organisationseinheit-delete-' + group.id | convertForDataTest"
+          label="Löschen"
+        ></admin-more-item-button>
       </admin-more-menu>
     </td>
   </tr>

alfa-client/libs/admin-settings/src/lib/organisationseinheit/organisationseinheit-container/organisationseinheit-list/organisationseinheit-list.component.spec.ts

@@ -2,6 +2,7 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { OrganisationseinheitListComponent } from './organisationseinheit-list.component';
 import { getDataTestIdOf } from 'libs/tech-shared/test/data-test';
 import {
+  dispatchEventFromFixture,
   existsAsHtmlElement,
   getElementFromFixture,
   notExistsAsHtmlElement,
@@ -9,6 +10,9 @@ import {
 import { createKeycloakGroup } from '../../../../../test/keycloak/keycloak';
 import { KeycloakGroup } from '../../../keycloak/keycloak.model';
 import { convertForDataTest, ConvertForDataTestPipe } from '@alfa-client/tech-shared';
+import { MockComponent } from 'ng-mocks';
+import { MoreMenuComponent } from '../../../shared/more-menu/more-menu.component';
+import { MoreItemButtonComponent } from '../../../shared/more-menu/more-item-button/more-item-button.component';
 
 describe('OrganisationseinheitListComponent', () => {
   let component: OrganisationseinheitListComponent;
@@ -17,12 +21,17 @@ describe('OrganisationseinheitListComponent', () => {
   const emptyMessage = getDataTestIdOf('organisationseinheit-empty-message');
   const tableSelector = getDataTestIdOf('organisationseinheit-table');
 
-  const groupCellSelector = (group: KeycloakGroup, cell: string) =>
+  const groupElementSelector = (group: KeycloakGroup, cell: string) =>
     getDataTestIdOf(convertForDataTest(`organisationseinheit-${cell}-${group.id}`));
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [OrganisationseinheitListComponent, ConvertForDataTestPipe],
+      declarations: [
+        OrganisationseinheitListComponent,
+        ConvertForDataTestPipe,
+        MockComponent(MoreMenuComponent),
+        MockComponent(MoreItemButtonComponent),
+      ],
     }).compileComponents();
 
     fixture = TestBed.createComponent(OrganisationseinheitListComponent);
@@ -67,15 +76,33 @@ describe('OrganisationseinheitListComponent', () => {
       });
 
       it.each(groups)('should show name of group %#', (group) => {
-        const nameTableCell = getElementFromFixture(fixture, groupCellSelector(group, 'name'));
+        const nameTableCell = getElementFromFixture(fixture, groupElementSelector(group, 'name'));
 
         expect(nameTableCell.textContent.trim()).toBe(group.name);
       });
 
       it.each(groups)('should show organisationseinheitId of group %#', (group) => {
-        const attrTableCell = getElementFromFixture(fixture, groupCellSelector(group, 'attr'));
+        const attrTableCell = getElementFromFixture(fixture, groupElementSelector(group, 'attr'));
 
-        expect(attrTableCell.textContent.trim()).toBe(`OrganisationseinheitID: ${group.organisationseinheitIds.join(', ')}`);
+        expect(attrTableCell.textContent.trim()).toBe(
+          `OrganisationseinheitID: ${group.organisationseinheitIds.join(', ')}`,
+        );
+      });
+
+      it.each(groups)('should emit editGroup %# on edit button click ', (group) => {
+        component.editGroup.emit = jest.fn();
+
+        dispatchEventFromFixture(fixture, groupElementSelector(group, 'edit'), 'clickEmitter');
+
+        expect(component.editGroup.emit).toHaveBeenCalledWith(group);
+      });
+
+      it.each(groups)('should emit deleteGroup %# on delete button click ', (group) => {
+        component.deleteGroup.emit = jest.fn();
+
+        dispatchEventFromFixture(fixture, groupElementSelector(group, 'delete'), 'clickEmitter');
+
+        expect(component.deleteGroup.emit).toHaveBeenCalledWith(group);
       });
     });
   });

alfa-client/libs/admin-settings/src/lib/organisationseinheit/organisationseinheit-container/organisationseinheit-list/organisationseinheit-list.component.ts

-import { Component, Input } from '@angular/core';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
 import { KeycloakGroup } from '../../../keycloak/keycloak.model';
 
 @Component({
@@ -8,4 +8,10 @@ import { KeycloakGroup } from '../../../keycloak/keycloak.model';
 export class OrganisationseinheitListComponent {
   @Input()
   groups: KeycloakGroup[] = [];
+
+  @Output()
+  editGroup: EventEmitter<KeycloakGroup> = new EventEmitter();
+
+  @Output()
+  deleteGroup: EventEmitter<KeycloakGroup> = new EventEmitter();
 }

alfa-client/libs/admin-settings/src/lib/shared/more-menu/menu-item-button/more-item-button.component.ts → alfa-client/libs/admin-settings/src/lib/shared/more-menu/more-item-button/more-item-button.component.ts

 import { Component, EventEmitter, Input, Output } from '@angular/core';
 
 @Component({
-  selector: 'admin-menu-item-button',
+  selector: 'admin-more-item-button',
   templateUrl: './more-item-button.component.html',
   styles: [],
 })