diff --git a/goofy-client/apps/goofy/src/styles/main.scss b/goofy-client/apps/goofy/src/styles/main.scss index d8ddf0d508ef43f5689497a99d46ec870124a853..7f0e1954f36942047bfd236a9a369817ce1c3909 100644 --- a/goofy-client/apps/goofy/src/styles/main.scss +++ b/goofy-client/apps/goofy/src/styles/main.scss @@ -20,7 +20,6 @@ @import "~libs/user-profile/src/lib/user-profile-in-vorgang-container/user-profile-in-vorgang/user-profile-in-vorgang.theme"; @import "~libs/user-profile/src/lib/user-profile-search-container/user-profile-search-container.theme"; @import "~libs/vorgang-shared-ui/src/lib/vorgang-nummer/vorgang-nummer.component.theme"; -@import "~libs/ui/src/lib/ui/postfach-status/postfach-status.component.theme"; @include mat.core(); diff --git a/goofy-client/libs/ui/src/index.ts b/goofy-client/libs/ui/src/index.ts index 74eb1036a3d0a5db1c1463870dd3af0177e67565..bd76d70b402922f7ed3cd363d71184a6b93ed619 100644 --- a/goofy-client/libs/ui/src/index.ts +++ b/goofy-client/libs/ui/src/index.ts @@ -12,7 +12,6 @@ export * from './lib/ui/file-upload/file-upload.component'; export * from './lib/ui/fixed-dialog/fixed-dialog-data.model'; export * from './lib/ui/fixed-dialog/fixed-dialog.component'; export * from './lib/ui/icon-button-with-spinner/icon-button-with-spinner.component'; -export * from './lib/ui/postfach-status/postfach-status.component'; export * from './lib/ui/spinner/spinner.component'; export * from './lib/ui/subnavigation/subnavigation.component'; export * from './lib/ui/ui.module'; diff --git a/goofy-client/libs/ui/src/lib/ui/postfach-status/_postfach-status.component.theme.scss b/goofy-client/libs/ui/src/lib/ui/postfach-status/_postfach-status.component.theme.scss deleted file mode 100644 index 5683c0a05d9add430153c01e3a56d643d210f58f..0000000000000000000000000000000000000000 --- a/goofy-client/libs/ui/src/lib/ui/postfach-status/_postfach-status.component.theme.scss +++ /dev/null @@ -1,10 +0,0 @@ -goofy-client-postfach-status { - .mat-badge-small.mat-badge-above .mat-badge-content { - top: -3px; - } - .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content { - width: 12px; - height: 12px; - right: -4px; - } -} diff --git a/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.html b/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.html deleted file mode 100644 index fb5b07c981d3a4b6603f7c3650b65ea63c08f4ed..0000000000000000000000000000000000000000 --- a/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.html +++ /dev/null @@ -1,7 +0,0 @@ -<mat-icon data-test-class="postfach-status" - svgIcon="mail" - matBadge="⁠" - [matBadgeHidden]="!showBadge" - matBadgeSize="small" - matBadgeDescription="Neue Postfachnachrichten"> -</mat-icon> \ No newline at end of file diff --git a/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.ts b/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.ts deleted file mode 100644 index e852391a2cc2d105f80e0d80ac5ddc0cff6e8794..0000000000000000000000000000000000000000 --- a/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { Component, Input } from '@angular/core'; - -@Component({ - selector: 'goofy-client-postfach-status', - templateUrl: './postfach-status.component.html', - styleUrls: ['./postfach-status.component.scss'], -}) -export class PostfachStatusComponent { - - @Input() showBadge: boolean = false; - -} diff --git a/goofy-client/libs/ui/src/lib/ui/ui.module.ts b/goofy-client/libs/ui/src/lib/ui/ui.module.ts index 2b491a749e5909254273ea532069ffd7a20fd28d..c482f7fc5c5248928f8c0ac3a5b03f48d66ed7fe 100644 --- a/goofy-client/libs/ui/src/lib/ui/ui.module.ts +++ b/goofy-client/libs/ui/src/lib/ui/ui.module.ts @@ -4,7 +4,6 @@ import { NgModule } from '@angular/core'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { DateFnsAdapter, MatDateFnsModule } from '@angular/material-date-fns-adapter'; import { MatAutocompleteModule } from '@angular/material/autocomplete'; -import { MatBadgeModule } from '@angular/material/badge'; import { MatButtonModule } from '@angular/material/button'; import { MatCheckboxModule } from '@angular/material/checkbox'; import { DateAdapter, MatRippleModule, MAT_DATE_LOCALE } from '@angular/material/core'; @@ -43,7 +42,6 @@ import { ConnectionTimeoutRetryFailDialogComponent } from './http-error-dialog/c import { IconButtonWithSpinnerComponent } from './icon-button-with-spinner/icon-button-with-spinner.component'; import { MattooltipClassDirective, MattooltipDirective, MattooltipDisabledDirective } from './mattooltip/mattooltip.directive'; import { InternalServerErrorDialogComponent } from './notification/internal-server-error-dialog/internal-server-error-dialog.component'; -import { PostfachStatusComponent } from './postfach-status/postfach-status.component'; import { ProgressBarComponent } from './progress-bar/progress-bar.component'; import { SpinnerComponent } from './spinner/spinner.component'; import { SubnavigationComponent } from './subnavigation/subnavigation.component'; @@ -71,8 +69,7 @@ const components = [ FileUploadEditorComponent, MattooltipDirective, MattooltipDisabledDirective, - MattooltipClassDirective, - PostfachStatusComponent + MattooltipClassDirective ]; const modules = [ @@ -96,7 +93,6 @@ const modules = [ MatAutocompleteModule, MatDialogModule, MatTabsModule, - MatBadgeModule, CommonModule, TechSharedModule ]; diff --git a/goofy-client/libs/vorgang-shared-ui/src/index.ts b/goofy-client/libs/vorgang-shared-ui/src/index.ts index d151c0ad220a42a5f018ccc31baaa506fd4a48c5..af2fd02f43797a7441a8a4a24e2941286b860349 100644 --- a/goofy-client/libs/vorgang-shared-ui/src/index.ts +++ b/goofy-client/libs/vorgang-shared-ui/src/index.ts @@ -1,6 +1,7 @@ export * from './lib/aktenzeichen/aktenzeichen.component'; export * from './lib/vorgang-in-postfach-breadcrumb-container/vorgang-in-postfach-breadcrumb-container.component'; export * from './lib/vorgang-nummer/vorgang-nummer.component'; +export * from './lib/vorgang-postfach-status/vorgang-postfach-status.component'; export * from './lib/vorgang-search-container/vorgang-search-container.component'; export * from './lib/vorgang-shared-ui.module'; export * from './lib/vorgang-status-dot/vorgang-status-dot.component'; diff --git a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.html b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.html new file mode 100644 index 0000000000000000000000000000000000000000..5d88b6c0d9d07abd69c2ea863e1c90c6bb15ee85 --- /dev/null +++ b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.html @@ -0,0 +1,3 @@ +<mat-icon *ngIf="vorgang.hasPostfachNachricht === true" data-test-class="postfach-status" + svgIcon="mail"> +</mat-icon> \ No newline at end of file diff --git a/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.scss b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.scss similarity index 100% rename from goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.scss rename to goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.scss diff --git a/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.spec.ts b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.spec.ts similarity index 57% rename from goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.spec.ts rename to goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.spec.ts index 18e5ea00a1e8723e73e66c02d541054a542e6f01..02635cfeada795d467a954afd56836416bd98586 100644 --- a/goofy-client/libs/ui/src/lib/ui/postfach-status/postfach-status.component.spec.ts +++ b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.spec.ts @@ -1,35 +1,36 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { MatBadge, MatBadgeModule } from '@angular/material/badge'; import { MatIcon } from '@angular/material/icon'; import { MatIconTestingModule } from '@angular/material/icon/testing'; import { getElementFromFixture } from '@goofy-client/test-utils'; +import { VorgangResource } from '@goofy-client/vorgang-shared'; import { getDataTestClassOf } from 'libs/tech-shared/test/data-test'; -import { PostfachStatusComponent } from './postfach-status.component'; +import { createVorgangResource } from 'libs/vorgang-shared/test/vorgang'; +import { VorgangPostfachStatusComponent } from './vorgang-postfach-status.component'; -describe('PostfachStatusComponent', () => { - let component: PostfachStatusComponent; - let fixture: ComponentFixture<PostfachStatusComponent>; +describe('VorgangPostfachStatusComponent', () => { + let component: VorgangPostfachStatusComponent; + let fixture: ComponentFixture<VorgangPostfachStatusComponent>; + const vorgang: VorgangResource = createVorgangResource(); const postfachStatus: string = getDataTestClassOf('postfach-status'); beforeEach(async () => { await TestBed.configureTestingModule({ declarations: [ MatIcon, - PostfachStatusComponent, - MatBadge, + VorgangPostfachStatusComponent ], imports: [ MatIconTestingModule, - MatBadgeModule, ], }).compileComponents(); }); beforeEach(() => { - fixture = TestBed.createComponent(PostfachStatusComponent); + fixture = TestBed.createComponent(VorgangPostfachStatusComponent); component = fixture.componentInstance; + component.vorgang = vorgang; fixture.detectChanges(); }); @@ -39,19 +40,21 @@ describe('PostfachStatusComponent', () => { describe('mail icon', () => { it('should show mail icon', () => { + component.vorgang.hasPostfachNachricht = true; + fixture.detectChanges(); + const icon: HTMLElement = getElementFromFixture(fixture, postfachStatus); expect(icon).toHaveClass('mat-icon'); - expect(icon).toHaveClass('mat-badge-hidden'); }); - it('should show mail icon with badge', () => { - component.showBadge = true; + it('should not show mail icon', () => { + component.vorgang.hasPostfachNachricht = false; fixture.detectChanges(); const icon: HTMLElement = getElementFromFixture(fixture, postfachStatus); - expect(icon).toHaveClass('mat-badge'); + expect(icon).toBeNull(); }); }); }); diff --git a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.ts b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.ts new file mode 100644 index 0000000000000000000000000000000000000000..012bb0a3d13c2d7db58e31e5143644b4bb50591a --- /dev/null +++ b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-postfach-status/vorgang-postfach-status.component.ts @@ -0,0 +1,13 @@ +import { Component, Input } from '@angular/core'; +import { Vorgang } from '@goofy-client/vorgang-shared'; + +@Component({ + selector: 'goofy-client-vorgang-postfach-status', + templateUrl: './vorgang-postfach-status.component.html', + styleUrls: ['./vorgang-postfach-status.component.scss'], +}) +export class VorgangPostfachStatusComponent { + + @Input() vorgang: Vorgang; + +} diff --git a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-shared-ui.module.ts b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-shared-ui.module.ts index cc32dc47b59ffa44b249b317f177cb5f559239ce..e0e957351d94cc0d9a45d68134e4d358da5e4245 100644 --- a/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-shared-ui.module.ts +++ b/goofy-client/libs/vorgang-shared-ui/src/lib/vorgang-shared-ui.module.ts @@ -14,6 +14,7 @@ import { VorgangSearchClearButtonComponent } from './vorgang-search-container/vo import { VorgangSearchComponent } from './vorgang-search-container/vorgang-search/vorgang-search.component'; import { VorgangStatusDotComponent } from './vorgang-status-dot/vorgang-status-dot.component'; import { VorgangStatusTextComponent } from './vorgang-status-text/vorgang-status-text.component'; +import { VorgangPostfachStatusComponent } from './vorgang-postfach-status/vorgang-postfach-status.component'; @NgModule({ imports: [ @@ -34,6 +35,7 @@ import { VorgangStatusTextComponent } from './vorgang-status-text/vorgang-status VorgangSearchClearButtonComponent, VorgangNummerComponent, VorgangStatusTextComponent, + VorgangPostfachStatusComponent, ], exports: [ VorgangSearchContainerComponent, @@ -43,6 +45,7 @@ import { VorgangStatusTextComponent } from './vorgang-status-text/vorgang-status VorgangSearchAutocompleteOptionsContentComponent, VorgangNummerComponent, VorgangStatusTextComponent, + VorgangPostfachStatusComponent, ], }) export class VorgangSharedUiModule {} diff --git a/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.html b/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.html index 7e791004d8b00dfdcc478a8fd3337dfa260c6f11..36c4396861b501bd5799f551fc82ed18110214be 100644 --- a/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.html +++ b/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.html @@ -10,11 +10,7 @@ class="status-text"></goofy-client-vorgang-status-text> </div> - <goofy-client-postfach-status data-test-class="postfach-status" - *ngIf="vorgang.hasPostfachNachricht === true" - [showBadge]="vorgang.hasNewPostfachNachricht" - class="postfach-status"> - </goofy-client-postfach-status> + <goofy-client-vorgang-postfach-status class="postfach-status" [vorgang]="vorgang"></goofy-client-vorgang-postfach-status> <div class="aktenzeichen"> <mat-icon svgIcon="az"></mat-icon> diff --git a/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.spec.ts b/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.spec.ts index c524584c3ea70a60bf9ba5d092968a3538cf7d92..2140033efe67d131e597170a758e63a390428ebf 100644 --- a/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.spec.ts +++ b/goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.spec.ts @@ -9,13 +9,11 @@ import { MatIconTestingModule } from '@angular/material/icon/testing'; import { MatTooltipModule } from '@angular/material/tooltip'; import { RouterTestingModule } from '@angular/router/testing'; import { convertForDataTest, ConvertForDataTestPipe, EnumToLabelPipe, FormatDateWithTimePipe, FormatToPrettyDatePipe, HasLinkPipe, ToResourceUriPipe } from '@goofy-client/tech-shared'; -import { getElementFromFixture } from '@goofy-client/test-utils'; -import { PostfachStatusComponent } from '@goofy-client/ui'; import { UserProfileInVorgangListItemContainerComponent } from '@goofy-client/user-profile'; import { VorgangHeaderLinkRel } from '@goofy-client/vorgang-shared'; -import { AktenzeichenComponent, VorgangNummerComponent, VorgangStatusDotComponent, VorgangStatusTextComponent } from '@goofy-client/vorgang-shared-ui'; +import { AktenzeichenComponent, VorgangNummerComponent, VorgangPostfachStatusComponent, VorgangStatusDotComponent, VorgangStatusTextComponent } from '@goofy-client/vorgang-shared-ui'; import { WiedervorlageListInVorgangListContainerComponent } from '@goofy-client/wiedervorlage'; -import { getDataTestClassOf, getDataTestIdOf } from 'libs/tech-shared/test/data-test'; +import { getDataTestIdOf } from 'libs/tech-shared/test/data-test'; import { createVorgangResource } from 'libs/vorgang-shared/test/vorgang'; import { MockComponent } from 'ng-mocks'; import { VorgangListItemComponent } from './vorgang-list-item.component'; @@ -27,8 +25,7 @@ describe('VorgangListItemComponent', () => { let component: VorgangListItemComponent; let fixture: ComponentFixture<VorgangListItemComponent>; - const user: string = getDataTestIdOf('vorgang-user-icon'); - const postfachStatus: string = getDataTestClassOf('postfach-status'); + const user: string = '[data-test-id="vorgang-user-icon"]'; beforeEach(async () => { await TestBed.configureTestingModule({ @@ -48,7 +45,7 @@ describe('VorgangListItemComponent', () => { ConvertForDataTestPipe, MockComponent(AktenzeichenComponent), MockComponent(VorgangNummerComponent), - MockComponent(PostfachStatusComponent), + MockComponent(VorgangPostfachStatusComponent), MockComponent(VorgangStatusDotComponent), MockComponent(VorgangStatusTextComponent), MockComponent(WiedervorlageListInVorgangListContainerComponent), @@ -132,32 +129,4 @@ describe('VorgangListItemComponent', () => { }) }) - - describe('mail icon', () => { - beforeEach(() => { - component.vorgang = createVorgangResource([VorgangHeaderLinkRel.VORGANG_WITH_EINGANG, VorgangHeaderLinkRel.POSTFACH_MAILS]); - }) - - it('should show mail icon if Vorgang has new Postfachnachricht', () => { - component.vorgang.hasPostfachNachricht = true; - fixture.detectChanges(); - - const listItem: string = getDataTestIdOf(`vorgang-list-item-${convertForDataTest(component.vorgang.name)}`); - const element: HTMLDivElement = fixture.nativeElement.querySelector(listItem); - const statusElement = getElementFromFixture(fixture, postfachStatus); - - expect(element).toContainElement(statusElement); - }) - - it('should not show mail icon if Vorgang has no new Postfachnachricht', () => { - component.vorgang.hasPostfachNachricht = false; - fixture.detectChanges(); - - const listItem: string = getDataTestIdOf(`vorgang-list-item-${convertForDataTest(component.vorgang.name)}`); - const element: HTMLDivElement = fixture.nativeElement.querySelector(listItem); - const statusElement = getElementFromFixture(fixture, postfachStatus); - - expect(element).not.toContainElement(statusElement); - }) - }) }); diff --git a/goofy-client/libs/vorgang/src/test-setup.ts b/goofy-client/libs/vorgang/src/test-setup.ts index 82178098b34faeb3a94a8268bd072d4db95371a3..08ef82b5d5efa87cb27257314075f6a16eb7a63e 100644 --- a/goofy-client/libs/vorgang/src/test-setup.ts +++ b/goofy-client/libs/vorgang/src/test-setup.ts @@ -1,10 +1,9 @@ -import '@testing-library/jest-dom'; import 'jest-preset-angular/setup-jest'; import { getTestBed } from '@angular/core/testing'; import { BrowserDynamicTestingModule, - platformBrowserDynamicTesting + platformBrowserDynamicTesting, } from '@angular/platform-browser-dynamic/testing'; getTestBed().resetTestEnvironment();