OZG-7474 Replace loesch anforderung zuruecknehmen button

alfa-client/libs/loesch-anforderung/src/lib/loesch-anforderung-zuruecknehmen-button-container/loesch-anforderung-zuruecknehmen-button/loesch-anforderung-zuruecknehmen-button.component.html

@@ -23,22 +23,25 @@
     unter der Lizenz sind dem Lizenztext zu entnehmen.
 
 -->
-<ozgcloud-stroked-button-with-spinner
-  *ngIf="!showAsIconButton"
-  data-test-id="loesch-anforderung-zuruecknehmen-button"
-  text="Löschanforderung zurücknehmen"
-  svgIcon="undo_request_deletion"
+@if (showAsIconButton) {
+  <ods-button-with-spinner
     [stateResource]="loeschAnforderungZuruecknehmenCommand"
+    data-test-id="loesch-anforderung-zuruecknehmen-icon-button"
+    tooltip="Löschanforderung zurücknehmen"
+    variant="icon"
+    size="fit"
     (clickEmitter)="loeschAnforderungZuruecknehmen.emit()"
   >
-</ozgcloud-stroked-button-with-spinner>
-
-<ozgcloud-icon-button-with-spinner
-  *ngIf="showAsIconButton"
-  data-test-id="loesch-anforderung-zuruecknehmen-icon-button"
-  svgIcon="undo_request_deletion"
-  toolTip="Löschanforderung zurücknehmen"
+    <ods-undo-request-deletion-icon icon class="fill-text" />
+  </ods-button-with-spinner>
+} @else {
+  <ods-button-with-spinner
     [stateResource]="loeschAnforderungZuruecknehmenCommand"
+    data-test-id="loesch-anforderung-zuruecknehmen-button"
+    text="Löschanforderung zurücknehmen"
+    variant="outline"
     (clickEmitter)="loeschAnforderungZuruecknehmen.emit()"
   >
-</ozgcloud-icon-button-with-spinner>
+    <ods-undo-request-deletion-icon icon />
+  </ods-button-with-spinner>
+}

alfa-client/libs/loesch-anforderung/src/lib/loesch-anforderung-zuruecknehmen-button-container/loesch-anforderung-zuruecknehmen-button/loesch-anforderung-zuruecknehmen-button.component.spec.ts

@@ -21,12 +21,10 @@
  * Die sprachspezifischen Genehmigungen und Beschränkungen
  * unter der Lizenz sind dem Lizenztext zu entnehmen.
  */
-import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { existsAsHtmlElement, notExistsAsHtmlElement } from '@alfa-client/test-utils';
-import {
-  IconButtonWithSpinnerComponent,
-  OzgcloudStrokedButtonWithSpinnerComponent,
-} from '@alfa-client/ui';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ButtonWithSpinnerComponent } from '@ods/component';
+import { UndoRequestDeletionIconComponent } from 'libs/design-system/src/lib/icons/undo-request-delition-icon/undo-request-deletion-icon.component';
 import { getDataTestIdOf } from 'libs/tech-shared/test/data-test';
 import { MockComponent } from 'ng-mocks';
 import { LoeschAnforderungZuruecknehmenButtonComponent } from './loesch-anforderung-zuruecknehmen-button.component';
@@ -35,19 +33,15 @@ describe('LoeschAnforderungZuruecknehmenButtonComponent', () => {
   let component: LoeschAnforderungZuruecknehmenButtonComponent;
   let fixture: ComponentFixture<LoeschAnforderungZuruecknehmenButtonComponent>;
 
-  const loeschenAnfordernZuruecknehmenButton: string = getDataTestIdOf(
-    'loesch-anforderung-zuruecknehmen-button',
-  );
-  const loeschenAnfordernZuruecknehmenIconButton: string = getDataTestIdOf(
-    'loesch-anforderung-zuruecknehmen-icon-button',
-  );
+  const loeschenAnfordernZuruecknehmenButton: string = getDataTestIdOf('loesch-anforderung-zuruecknehmen-button');
+  const loeschenAnfordernZuruecknehmenIconButton: string = getDataTestIdOf('loesch-anforderung-zuruecknehmen-icon-button');
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       declarations: [
         LoeschAnforderungZuruecknehmenButtonComponent,
-        MockComponent(OzgcloudStrokedButtonWithSpinnerComponent),
-        MockComponent(IconButtonWithSpinnerComponent),
+        MockComponent(ButtonWithSpinnerComponent),
+        MockComponent(UndoRequestDeletionIconComponent),
       ],
     }).compileComponents();
 

alfa-client/libs/loesch-anforderung/src/lib/loesch-anforderung.module.ts

@@ -30,6 +30,7 @@ import { NgModule } from '@angular/core';
 import { ButtonWithSpinnerComponent } from '@ods/component';
 import { DeleteFinallyIconComponent } from '../../../design-system/src/lib/icons/delete-finally-icon/delete-finally-icon.component';
 import { RequestDeletionIconComponent } from '../../../design-system/src/lib/icons/request-deletion-icon/request-deletion-icon.component';
+import { UndoRequestDeletionIconComponent } from '../../../design-system/src/lib/icons/undo-request-delition-icon/undo-request-deletion-icon.component';
 import { EndgueltigLoeschenButtonContainerComponent } from './endgueltig-loeschen-button-container/endgueltig-loeschen-button-container.component';
 import { EndgueltigLoeschenButtonComponent } from './endgueltig-loeschen-button-container/endgueltig-loeschen-button/endgueltig-loeschen-button.component';
 import { LoeschAnforderungZuruecknehmenButtonContainerComponent } from './loesch-anforderung-zuruecknehmen-button-container/loesch-anforderung-zuruecknehmen-button-container.component';
@@ -47,6 +48,7 @@ import { LoeschenAnfordernButtonComponent } from './loeschen-anfordern-button-co
     RequestDeletionIconComponent,
     ButtonWithSpinnerComponent,
     DeleteFinallyIconComponent,
+    UndoRequestDeletionIconComponent,
   ],
   declarations: [
     LoeschenAnfordernButtonContainerComponent,