OZG-8129 replace pdf export icon

- remove old icon service

alfa-client/apps/alfa/src/app/app.component.spec.ts

@@ -27,7 +27,7 @@ import { ENVIRONMENT_CONFIG } from '@alfa-client/environment-shared';
 import { NavigationService } from '@alfa-client/navigation-shared';
 import { createEmptyStateResource, createStateResource } from '@alfa-client/tech-shared';
 import { mock, notExistsAsHtmlElement } from '@alfa-client/test-utils';
-import { IconService, SpinnerComponent } from '@alfa-client/ui';
+import { SpinnerComponent } from '@alfa-client/ui';
 import { registerLocaleData } from '@angular/common';
 import localeDe from '@angular/common/locales/de';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
@@ -51,7 +51,6 @@ describe('AppComponent', () => {
 
   const envConfig = { authServer: 'http://' };
   const apiRootFacade = mock(ApiRootFacade);
-  const iconService = mock(IconService);
 
   const login = Promise.resolve();
   const authService = {
@@ -86,10 +85,6 @@ describe('AppComponent', () => {
           provide: OAuthService,
           useValue: authService,
         },
-        {
-          provide: IconService,
-          useValue: iconService,
-        },
         {
           provide: NavigationService,
           useValue: navigationService,
@@ -108,10 +103,6 @@ describe('AppComponent', () => {
     expect(component).toBeTruthy();
   });
 
-  it(`should call iconService registerIcons`, () => {
-    expect(iconService.registerIcons).toHaveBeenCalled();
-  });
-
   describe('buildInfo', () => {
     it('FIXME(Von der Reihenfolge abhaengig) should NOT be rendered if api root not loaded', () => {
       // apiRootFacade.getApiRoot.mockReturnValue(of(createEmptyStateResource()));

alfa-client/apps/alfa/src/app/app.component.ts

@@ -25,7 +25,6 @@ import { ApiRootFacade, ApiRootResource } from '@alfa-client/api-root-shared';
 import { ENVIRONMENT_CONFIG } from '@alfa-client/environment-shared';
 import { NavigationService } from '@alfa-client/navigation-shared';
 import { InjectorService, StateResource, isNotNull } from '@alfa-client/tech-shared';
-import { IconService } from '@alfa-client/ui';
 import { buildPathSegmentsFromLocalStorage } from '@alfa-client/vorgang-shared';
 import { Component, Inject, OnInit } from '@angular/core';
 import { Params } from '@angular/router';
@@ -46,13 +45,10 @@ export class AppComponent implements OnInit {
   constructor(
     @Inject(ENVIRONMENT_CONFIG) private envConfig: Environment,
     private apiRootFacade: ApiRootFacade,
-    private iconService: IconService,
     private oAuthService: OAuthService,
     private navigationService: NavigationService,
     private injectorService: InjectorService,
-  ) {
-    this.iconService.registerIcons();
-  }
+  ) {}
 
   ngOnInit(): void {
     this.proceedWithLogin();

alfa-client/libs/design-system/src/assets/pdf-export.svg

+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M7.26611 8.71924H5.63574V7.69092H7.26611C7.51807 7.69092 7.72314 7.6499 7.88135 7.56787C8.03955 7.48291 8.15527 7.36572 8.22852 7.21631C8.30176 7.06689 8.33838 6.89844 8.33838 6.71094C8.33838 6.52051 8.30176 6.34326 8.22852 6.1792C8.15527 6.01514 8.03955 5.8833 7.88135 5.78369C7.72314 5.68408 7.51807 5.63428 7.26611 5.63428H6.09277V11H4.77441V4.60156H7.26611C7.76709 4.60156 8.19629 4.69238 8.55371 4.87402C8.91406 5.05273 9.18945 5.30029 9.37988 5.6167C9.57031 5.93311 9.66553 6.29492 9.66553 6.70215C9.66553 7.11523 9.57031 7.47266 9.37988 7.77441C9.18945 8.07617 8.91406 8.30908 8.55371 8.47314C8.19629 8.63721 7.76709 8.71924 7.26611 8.71924ZM12.5396 11H11.1465L11.1553 9.97168H12.5396C12.8853 9.97168 13.1768 9.89404 13.4141 9.73877C13.6514 9.58057 13.8301 9.35059 13.9502 9.04883C14.0732 8.74707 14.1348 8.38232 14.1348 7.95459V7.64258C14.1348 7.31445 14.0996 7.02588 14.0293 6.77686C13.9619 6.52783 13.8608 6.31836 13.7261 6.14844C13.5913 5.97852 13.4258 5.85107 13.2295 5.76611C13.0332 5.67822 12.8076 5.63428 12.5527 5.63428H11.1201V4.60156H12.5527C12.9805 4.60156 13.3716 4.6748 13.7261 4.82129C14.0835 4.96484 14.3926 5.17139 14.6533 5.44092C14.9141 5.71045 15.1147 6.03271 15.2554 6.40771C15.3989 6.77979 15.4707 7.19434 15.4707 7.65137V7.95459C15.4707 8.40869 15.3989 8.82324 15.2554 9.19824C15.1147 9.57324 14.9141 9.89551 14.6533 10.165C14.3955 10.4316 14.0864 10.6382 13.7261 10.7847C13.3687 10.9282 12.9731 11 12.5396 11ZM11.8936 4.60156V11H10.5752V4.60156H11.8936ZM17.7471 4.60156V11H16.4287V4.60156H17.7471ZM20.2959 7.33496V8.36328H17.3867V7.33496H20.2959ZM20.6035 4.60156V5.63428H17.3867V4.60156H20.6035Z" />
+  <path d="M13 19.099L15.59 16.4712L17 17.9073L12 23L7 17.9073L8.41 16.4712L11 19.099V13H13V19.099Z" />
+</svg>
\ No newline at end of file

alfa-client/libs/postfach/src/lib/postfach-mail-pdf-button-container/postfach-mail-pdf-button/postfach-mail-pdf-button.component.html

@@ -23,26 +23,27 @@
     unter der Lizenz sind dem Lizenztext zu entnehmen.
 
 -->
-<ng-container *ngIf="postfachMailCount != postfachNachrichtenCount.NONE">
-  <ng-container *ngIf="showButtonWithLabel; else showButton">
-    <ozgcloud-stroked-button-with-spinner
-      data-test-id="postfach-pdf-export-button"
-      [showSpinner]="isDownloadInProgress"
-      svgIcon="pdf_export"
+@if (postfachMailCount != postfachNachrichtenCount.NONE) {
+  @if (showButtonWithLabel) {
+    <ods-button
+      dataTestId="postfach-pdf-export-button"
+      variant="outline"
+      [isLoading]="isDownloadInProgress"
       [text]="label"
-      [toolTip]="label"
       (clickEmitter)="downloadPdf.emit()"
     >
-    </ozgcloud-stroked-button-with-spinner>
-  </ng-container>
-  <ng-template #showButton>
-    <ozgcloud-stroked-button-with-spinner
-      data-test-id="postfach-pdf-export-label-button"
-      [showSpinner]="isDownloadInProgress"
-      svgIcon="pdf_export"
-      [toolTip]="label"
+      <ods-icon icon name="pdf-export" />
+    </ods-button>
+  } @else {
+    <ods-button
+      dataTestId="postfach-pdf-export-label-button"
+      variant="ghost"
+      size="fit"
+      [tooltip]="label"
+      [isLoading]="isDownloadInProgress"
       (clickEmitter)="downloadPdf.emit()"
     >
-    </ozgcloud-stroked-button-with-spinner>
-  </ng-template>
-</ng-container>
+      <ods-icon icon name="pdf-export" />
+    </ods-button>
+  }
+}

alfa-client/libs/postfach/src/lib/postfach-mail-pdf-button-container/postfach-mail-pdf-button/postfach-mail-pdf-button.component.spec.ts

@@ -21,13 +21,13 @@
  * Die sprachspezifischen Genehmigungen und Beschränkungen
  * unter der Lizenz sind dem Lizenztext zu entnehmen.
  */
-import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { PostfachMailListResource, PostfachNachrichtenCount } from '@alfa-client/postfach-shared';
-import { getElementFromFixture } from '@alfa-client/test-utils';
-import { OzgcloudStrokedButtonWithSpinnerComponent } from '@alfa-client/ui';
+import { existsAsHtmlElement, notExistsAsHtmlElement } from '@alfa-client/test-utils';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ButtonComponent, IconComponent, TooltipDirective } from '@ods/system';
 import { createPostfachMailListResource } from 'libs/postfach-shared/test/postfach';
 import { getDataTestIdOf } from 'libs/tech-shared/test/data-test';
-import { MockComponent } from 'ng-mocks';
+import { MockComponent, MockDirective } from 'ng-mocks';
 import { PostfachMailPdfButtonComponent } from './postfach-mail-pdf-button.component';
 
 describe('PostfachMailPdfButtonComponent', () => {
@@ -41,7 +41,9 @@ describe('PostfachMailPdfButtonComponent', () => {
     await TestBed.configureTestingModule({
       declarations: [
         PostfachMailPdfButtonComponent,
-        MockComponent(OzgcloudStrokedButtonWithSpinnerComponent),
+        ButtonComponent,
+        MockComponent(IconComponent),
+        MockDirective(TooltipDirective),
       ],
     }).compileComponents();
 
@@ -106,18 +108,14 @@ describe('PostfachMailPdfButtonComponent', () => {
       component.showButtonWithLabel = true;
       fixture.detectChanges();
 
-      const element = getElementFromFixture(fixture, pdfExportButton);
-
-      expect(element).toBeInTheDocument();
+      existsAsHtmlElement(fixture, pdfExportButton);
     });
 
     it('should hide on non existing emails', () => {
       component.postfachMailCount = PostfachNachrichtenCount.NONE;
       fixture.detectChanges();
 
-      const element = getElementFromFixture(fixture, pdfExportButton);
-
-      expect(element).not.toBeInTheDocument();
+      notExistsAsHtmlElement(fixture, pdfExportButton);
     });
 
     it('should hide showButtonWithLabel false', () => {
@@ -125,9 +123,7 @@ describe('PostfachMailPdfButtonComponent', () => {
       component.showButtonWithLabel = false;
       fixture.detectChanges();
 
-      const element = getElementFromFixture(fixture, pdfExportButton);
-
-      expect(element).not.toBeInTheDocument();
+      notExistsAsHtmlElement(fixture, pdfExportButton);
     });
   });
 
@@ -137,18 +133,14 @@ describe('PostfachMailPdfButtonComponent', () => {
       component.showButtonWithLabel = false;
       fixture.detectChanges();
 
-      const element = getElementFromFixture(fixture, pdfExportLabelButton);
-
-      expect(element).toBeInTheDocument();
+      existsAsHtmlElement(fixture, pdfExportLabelButton);
     });
 
     it('should hide on non existing emails', () => {
       component.postfachMailCount = PostfachNachrichtenCount.NONE;
       fixture.detectChanges();
 
-      const element = getElementFromFixture(fixture, pdfExportLabelButton);
-
-      expect(element).not.toBeInTheDocument();
+      notExistsAsHtmlElement(fixture, pdfExportLabelButton);
     });
 
     it('should hide showButtonWithLabel true', () => {
@@ -156,9 +148,7 @@ describe('PostfachMailPdfButtonComponent', () => {
       component.showButtonWithLabel = true;
       fixture.detectChanges();
 
-      const element = getElementFromFixture(fixture, pdfExportLabelButton);
-
-      expect(element).not.toBeInTheDocument();
+      notExistsAsHtmlElement(fixture, pdfExportLabelButton);
     });
   });
 });

alfa-client/libs/ui/src/index.ts

@@ -22,7 +22,6 @@
  * unter der Lizenz sind dem Lizenztext zu entnehmen.
  */
 export * from './lib/icon/app-icon/app-icon.component';
-export * from './lib/icon/icon.service';
 export * from './lib/icon/postfach-icon/postfach-icon.component';
 export * from './lib/snackbar/snackbar.service';
 export * from './lib/ui/accordion/accordion.component';

alfa-client/libs/ui/src/lib/assets/pdf_export.svg

-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M7.26611 8.71924H5.63574V7.69092H7.26611C7.51807 7.69092 7.72314 7.6499 7.88135 7.56787C8.03955 7.48291 8.15527 7.36572 8.22852 7.21631C8.30176 7.06689 8.33838 6.89844 8.33838 6.71094C8.33838 6.52051 8.30176 6.34326 8.22852 6.1792C8.15527 6.01514 8.03955 5.8833 7.88135 5.78369C7.72314 5.68408 7.51807 5.63428 7.26611 5.63428H6.09277V11H4.77441V4.60156H7.26611C7.76709 4.60156 8.19629 4.69238 8.55371 4.87402C8.91406 5.05273 9.18945 5.30029 9.37988 5.6167C9.57031 5.93311 9.66553 6.29492 9.66553 6.70215C9.66553 7.11523 9.57031 7.47266 9.37988 7.77441C9.18945 8.07617 8.91406 8.30908 8.55371 8.47314C8.19629 8.63721 7.76709 8.71924 7.26611 8.71924ZM12.5396 11H11.1465L11.1553 9.97168H12.5396C12.8853 9.97168 13.1768 9.89404 13.4141 9.73877C13.6514 9.58057 13.8301 9.35059 13.9502 9.04883C14.0732 8.74707 14.1348 8.38232 14.1348 7.95459V7.64258C14.1348 7.31445 14.0996 7.02588 14.0293 6.77686C13.9619 6.52783 13.8608 6.31836 13.7261 6.14844C13.5913 5.97852 13.4258 5.85107 13.2295 5.76611C13.0332 5.67822 12.8076 5.63428 12.5527 5.63428H11.1201V4.60156H12.5527C12.9805 4.60156 13.3716 4.6748 13.7261 4.82129C14.0835 4.96484 14.3926 5.17139 14.6533 5.44092C14.9141 5.71045 15.1147 6.03271 15.2554 6.40771C15.3989 6.77979 15.4707 7.19434 15.4707 7.65137V7.95459C15.4707 8.40869 15.3989 8.82324 15.2554 9.19824C15.1147 9.57324 14.9141 9.89551 14.6533 10.165C14.3955 10.4316 14.0864 10.6382 13.7261 10.7847C13.3687 10.9282 12.9731 11 12.5396 11ZM11.8936 4.60156V11H10.5752V4.60156H11.8936ZM17.7471 4.60156V11H16.4287V4.60156H17.7471ZM20.2959 7.33496V8.36328H17.3867V7.33496H20.2959ZM20.6035 4.60156V5.63428H17.3867V4.60156H20.6035Z" fill="#000000"/>
-<path d="M13 19.099L15.59 16.4712L17 17.9073L12 23L7 17.9073L8.41 16.4712L11 19.099V13H13V19.099Z" fill="#000000"/>
-</svg>

alfa-client/libs/ui/src/lib/icon/icon.model.ts

-/*
- * Copyright (C) 2023 Das Land Schleswig-Holstein vertreten durch den
- * Ministerpräsidenten des Landes Schleswig-Holstein
- * Staatskanzlei
- * Abteilung Digitalisierung und zentrales IT-Management der Landesregierung
- *
- * Lizenziert unter der EUPL, Version 1.2 oder - sobald
- * diese von der Europäischen Kommission genehmigt wurden -
- * Folgeversionen der EUPL ("Lizenz");
- * Sie dürfen dieses Werk ausschließlich gemäß
- * dieser Lizenz nutzen.
- * Eine Kopie der Lizenz finden Sie hier:
- *
- * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
- *
- * Sofern nicht durch anwendbare Rechtsvorschriften
- * gefordert oder in schriftlicher Form vereinbart, wird
- * die unter der Lizenz verbreitete Software "so wie sie
- * ist", OHNE JEGLICHE GEWÄHRLEISTUNG ODER BEDINGUNGEN -
- * ausdrücklich oder stillschweigend - verbreitet.
- * Die sprachspezifischen Genehmigungen und Beschränkungen
- * unter der Lizenz sind dem Lizenztext zu entnehmen.
- */
-export enum Icons {
-  PDF_EXPORT = 'pdf_export',
-}

alfa-client/libs/ui/src/lib/icon/icon.service.spec.ts

-/*
- * Copyright (C) 2023 Das Land Schleswig-Holstein vertreten durch den
- * Ministerpräsidenten des Landes Schleswig-Holstein
- * Staatskanzlei
- * Abteilung Digitalisierung und zentrales IT-Management der Landesregierung
- *
- * Lizenziert unter der EUPL, Version 1.2 oder - sobald
- * diese von der Europäischen Kommission genehmigt wurden -
- * Folgeversionen der EUPL ("Lizenz");
- * Sie dürfen dieses Werk ausschließlich gemäß
- * dieser Lizenz nutzen.
- * Eine Kopie der Lizenz finden Sie hier:
- *
- * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
- *
- * Sofern nicht durch anwendbare Rechtsvorschriften
- * gefordert oder in schriftlicher Form vereinbart, wird
- * die unter der Lizenz verbreitete Software "so wie sie
- * ist", OHNE JEGLICHE GEWÄHRLEISTUNG ODER BEDINGUNGEN -
- * ausdrücklich oder stillschweigend - verbreitet.
- * Die sprachspezifischen Genehmigungen und Beschränkungen
- * unter der Lizenz sind dem Lizenztext zu entnehmen.
- */
-import { Mock, mock, useFromMock } from '@alfa-client/test-utils';
-import { MatIconRegistry } from '@angular/material/icon';
-import { Icons } from './icon.model';
-import { IconService } from './icon.service';
-
-describe('IconService', () => {
-  let service: IconService;
-  let matIconRegistry: Mock<MatIconRegistry>;
-  let domSanitizer: Mock<any>;
-
-  const iconBasePath: string = '/assets/icons/';
-  const iconsObjectLength = Object.keys(Icons).length;
-
-  beforeEach(() => {
-    matIconRegistry = mock(MatIconRegistry);
-    domSanitizer = { bypassSecurityTrustResourceUrl: jest.fn() };
-
-    service = new IconService(useFromMock(matIconRegistry), useFromMock(domSanitizer));
-  });
-
-  it('should create', () => {
-    expect(service).toBeDefined();
-  });
-
-  describe('add Icon to registry', () => {
-    it('should call registry to add SvgIgon', () => {
-      service.registerIcons();
-
-      expect(matIconRegistry.addSvgIcon).toHaveBeenCalled();
-      expect(matIconRegistry.addSvgIcon).toHaveBeenCalledTimes(iconsObjectLength);
-    });
-
-    it('should call domSanitizer', () => {
-      service.registerIcons();
-
-      expect(domSanitizer.bypassSecurityTrustResourceUrl).toHaveBeenCalled();
-      expect(domSanitizer.bypassSecurityTrustResourceUrl).toHaveBeenCalledTimes(iconsObjectLength);
-    });
-  });
-});

alfa-client/libs/ui/src/lib/icon/icon.service.ts

-/*
- * Copyright (C) 2023 Das Land Schleswig-Holstein vertreten durch den
- * Ministerpräsidenten des Landes Schleswig-Holstein
- * Staatskanzlei
- * Abteilung Digitalisierung und zentrales IT-Management der Landesregierung
- *
- * Lizenziert unter der EUPL, Version 1.2 oder - sobald
- * diese von der Europäischen Kommission genehmigt wurden -
- * Folgeversionen der EUPL ("Lizenz");
- * Sie dürfen dieses Werk ausschließlich gemäß
- * dieser Lizenz nutzen.
- * Eine Kopie der Lizenz finden Sie hier:
- *
- * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
- *
- * Sofern nicht durch anwendbare Rechtsvorschriften
- * gefordert oder in schriftlicher Form vereinbart, wird
- * die unter der Lizenz verbreitete Software "so wie sie
- * ist", OHNE JEGLICHE GEWÄHRLEISTUNG ODER BEDINGUNGEN -
- * ausdrücklich oder stillschweigend - verbreitet.
- * Die sprachspezifischen Genehmigungen und Beschränkungen
- * unter der Lizenz sind dem Lizenztext zu entnehmen.
- */
-import { Injectable } from '@angular/core';
-import { MatIconRegistry } from '@angular/material/icon';
-import { DomSanitizer } from '@angular/platform-browser';
-import { Icons } from './icon.model';
-
-@Injectable({ providedIn: 'root' })
-export class IconService {
-  constructor(
-    private matIconRegistry: MatIconRegistry,
-    private domSanitizer: DomSanitizer,
-  ) {}
-
-  public registerIcons(): void {
-    this.loadIcons(Object.values(Icons), '/assets/icons');
-  }
-
-  private loadIcons(iconKeys: string[], iconUrl: string): void {
-    iconKeys.forEach((key) =>
-      this.matIconRegistry.addSvgIcon(
-        key,
-        this.domSanitizer.bypassSecurityTrustResourceUrl(`${iconUrl}/${key}.svg`),
-      ),
-    );
-  }
-}