Skip to content
Snippets Groups Projects
Commit 64fdf282 authored by Albert Bruns's avatar Albert Bruns
Browse files

OZG-725-7893 button disable

parent d116a29b
No related branches found
No related tags found
1 merge request!93OZG-725-weiterleitung-suche
...@@ -44,6 +44,7 @@ type ButtonVariants = VariantProps<typeof buttonVariants>; ...@@ -44,6 +44,7 @@ type ButtonVariants = VariantProps<typeof buttonVariants>;
[size]="size" [size]="size"
[dataTestId]="dataTestId" [dataTestId]="dataTestId"
[isLoading]="isLoading" [isLoading]="isLoading"
[disabled]="disabled"
(click)="clickEmitter.emit()" (click)="clickEmitter.emit()"
> >
<ng-content icon select="[icon]" /> <ng-content icon select="[icon]" />
...@@ -57,6 +58,7 @@ export class ButtonWithSpinnerComponent { ...@@ -57,6 +58,7 @@ export class ButtonWithSpinnerComponent {
@Input() dataTestId: string = ''; @Input() dataTestId: string = '';
@Input() variant: ButtonVariants['variant'] = 'primary'; @Input() variant: ButtonVariants['variant'] = 'primary';
@Input() size: ButtonVariants['size'] = 'medium'; @Input() size: ButtonVariants['size'] = 'medium';
@Input() disabled: boolean = false;
@Output() public clickEmitter: EventEmitter<MouseEvent> = new EventEmitter<MouseEvent>(); @Output() public clickEmitter: EventEmitter<MouseEvent> = new EventEmitter<MouseEvent>();
......
...@@ -35,7 +35,7 @@ export enum ForwardingDirection { ...@@ -35,7 +35,7 @@ export enum ForwardingDirection {
standalone: true, standalone: true,
imports: [CommonModule, ForwardVorgangIconComponent], imports: [CommonModule, ForwardVorgangIconComponent],
template: `<div template: `<div
class="flex flex-col items-start items-center justify-between gap-2 rounded-lg border border-grayborder p-3 md:flex-row md:items-center md:gap-0" class="flex flex-col items-start justify-between gap-2 rounded-lg border border-grayborder p-3 md:flex-row md:items-center md:gap-0"
> >
<div class="flex gap-3"> <div class="flex gap-3">
<ods-forward-vorgang-icon class="fill-text" /> <ods-forward-vorgang-icon class="fill-text" />
......
<ods-button-with-spinner text="Weiterleiten" variant="outline" dataTestId="forwarding-button"> <ods-button-with-spinner [disabled]="disabled" text="Weiterleiten" variant="outline" dataTestId="forwarding-button">
<ods-forward-vorgang-icon icon class="fill-primary" /> <ods-forward-vorgang-icon icon class="fill-primary" />
</ods-button-with-spinner> </ods-button-with-spinner>
\ No newline at end of file
import { Component } from '@angular/core'; import { Component, Input } from '@angular/core';
import { ButtonWithSpinnerComponent } from '@ods/component'; import { ButtonWithSpinnerComponent } from '@ods/component';
import { ForwardVorgangIconComponent } from '@ods/system'; import { ForwardVorgangIconComponent } from '@ods/system';
...@@ -8,4 +8,6 @@ import { ForwardVorgangIconComponent } from '@ods/system'; ...@@ -8,4 +8,6 @@ import { ForwardVorgangIconComponent } from '@ods/system';
imports: [ButtonWithSpinnerComponent, ForwardVorgangIconComponent], imports: [ButtonWithSpinnerComponent, ForwardVorgangIconComponent],
templateUrl: './forwarding-button.component.html', templateUrl: './forwarding-button.component.html',
}) })
export class ForwardingButtonComponent {} export class ForwardingButtonComponent {
@Input() disabled: boolean;
}
<div class="block flex w-[620px] flex-col gap-4 bg-background-100 p-8"> <div class="block flex w-[620px] flex-col gap-4 bg-background-100 p-8">
<div class="flex items-center justify-between"> <div class="flex items-center justify-between">
<h1 class="text-xl font-semibold text-primary">Vorgang weiterleiten</h1> <h1 class="text-xl font-semibold text-primary">Vorgang weiterleiten</h1>
<ods-cancel-dialog-button showAsIconButton="true" /> <ods-cancel-dialog-button showAsIconButton="true" data-test-id="cancel-dialog-icon-button" />
</div> </div>
@if (isNil(selectedSearchResult)) { @if (isNil(selectedSearchResult)) {
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
} }
<div class="flex gap-4"> <div class="flex gap-4">
<alfa-forwarding-button /> <alfa-forwarding-button [disabled]="isNil(selectedSearchResult)" data-test-id="forwarding-button" />
<ods-cancel-dialog-button /> <ods-cancel-dialog-button data-test-id="cancel-dialog-button" />
</div> </div>
</div> </div>
import { existsAsHtmlElement, notExistsAsHtmlElement } from '@alfa-client/test-utils'; import { existsAsHtmlElement, getMockComponent, notExistsAsHtmlElement } from '@alfa-client/test-utils';
import { ZustaendigeStelleModule } from '@alfa-client/zustaendige-stelle'; import { ZustaendigeStelleModule } from '@alfa-client/zustaendige-stelle';
import { OrganisationsEinheitResource } from '@alfa-client/zustaendige-stelle-shared'; import { OrganisationsEinheitResource } from '@alfa-client/zustaendige-stelle-shared';
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
...@@ -16,6 +16,7 @@ describe('ForwardingDialogComponent', () => { ...@@ -16,6 +16,7 @@ describe('ForwardingDialogComponent', () => {
const zufiSearch: string = getDataTestIdOf('zufi-search'); const zufiSearch: string = getDataTestIdOf('zufi-search');
const forwardingItem: string = getDataTestIdOf('forwarding-item'); const forwardingItem: string = getDataTestIdOf('forwarding-item');
const forwardingButton: string = getDataTestIdOf('forwarding-button');
const organisationsEinheitResource: OrganisationsEinheitResource = createOrganisationsEinheitResource(); const organisationsEinheitResource: OrganisationsEinheitResource = createOrganisationsEinheitResource();
beforeEach(async () => { beforeEach(async () => {
...@@ -82,4 +83,24 @@ describe('ForwardingDialogComponent', () => { ...@@ -82,4 +83,24 @@ describe('ForwardingDialogComponent', () => {
}); });
}); });
}); });
describe('forwarding button', () => {
it('should be disabled if selectedSearchResult is null', () => {
component.selectedSearchResult = null;
fixture.detectChanges();
const forwardingButton: ForwardingButtonComponent = getMockComponent(fixture, ForwardingButtonComponent);
expect(forwardingButton.disabled).toBeTruthy();
});
it('should NOT be disabled if selectedSearchResult is NOT null', () => {
component.selectedSearchResult = organisationsEinheitResource;
fixture.detectChanges();
const forwardingButton: ForwardingButtonComponent = getMockComponent(fixture, ForwardingButtonComponent);
expect(forwardingButton.disabled).toBeFalsy();
});
});
}); });
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment