From f94ab75a4b678a035a4714d16fc7c5e097bc459a Mon Sep 17 00:00:00 2001 From: OZGCloud <ozgcloud@mgm-tp.com> Date: Wed, 3 Nov 2021 17:35:40 +0100 Subject: [PATCH] =?UTF-8?q?OZG-1194=20b=C3=BCroklammer=20bei=20nachrichten?= =?UTF-8?q?=20attachments=20ausrichten?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../incomming-mail.component.html | 10 +++- .../incomming-mail.component.scss | 7 +++ .../incomming-mail.component.spec.ts | 52 ++++++++++++++++++- .../incomming-mail.component.ts | 8 ++- .../postfach-mail.component.html | 9 ---- .../postfach-mail.component.spec.ts | 48 +---------------- .../postfach-mail/postfach-mail.component.ts | 6 +-- 7 files changed, 75 insertions(+), 65 deletions(-) diff --git a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.html b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.html index 1db9ff24bb..a6c3701191 100644 --- a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.html +++ b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.html @@ -6,6 +6,12 @@ </div> <goofy-client-postfach-mail-date class="date" [postfachMail]="postfachMail"></goofy-client-postfach-mail-date> </div> - - <div class="message overflow" data-test-id="mail-text">{{ postfachMail.mailBody }}</div> + <div class="second-row"> + <div class="message overflow" data-test-id="mail-text">{{ postfachMail.mailBody }}</div> + <mat-icon *ngIf="(postfachMail | hasLink: postfachNachrichtLinkRel.ATTACHMENTS) && !onPage" data-test-id="postfach-nachricht-attachment-icon">attach_file</mat-icon> + </div> </a> + +<goofy-client-postfach-nachricht-attachments *ngIf="(postfachMail | hasLink: postfachNachrichtLinkRel.ATTACHMENTS) && onPage" data-test-id="postfach-nachricht-attachments-container" + [postfachNachricht]="postfachMail"> +</goofy-client-postfach-nachricht-attachments> diff --git a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.scss b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.scss index 77749c04e4..fe32b075ac 100644 --- a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.scss +++ b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.scss @@ -37,3 +37,10 @@ a { justify-content: space-between; width: 100%; } + +.second-row { + display: flex; + white-space: nowrap; + justify-content: space-between; + width: 100%; +} diff --git a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.spec.ts b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.spec.ts index 21ca37044d..1eebf3cbe0 100644 --- a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.spec.ts +++ b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.spec.ts @@ -2,11 +2,14 @@ import { registerLocaleData } from '@angular/common'; import localeDe from '@angular/common/locales/de'; import { ComponentFixture, TestBed } from '@angular/core/testing'; import { MatIcon } from '@angular/material/icon'; -import { FormatDateWithTimePipe } from '@goofy-client/tech-shared'; +import { FormatDateWithTimePipe, HasLinkPipe } from '@goofy-client/tech-shared'; import { MockComponent } from 'ng-mocks'; import { createPostfachMailResource } from '../../../../../../../postfach-shared/test/postfach'; import { PostfachMailDateComponent } from '../postfach-mail-date/postfach-mail-date.component'; import { IncommingMailComponent } from './incomming-mail.component'; +import { getElementFromFixture } from '@goofy-client/test-utils'; +import { ON_PAGE, PostfachMailLinkRel } from '@goofy-client/postfach-shared'; +import { PostfachNachrichtAttachmentsComponent } from '../postfach-nachricht-attachments/postfach-nachricht-attachments.component'; registerLocaleData(localeDe); @@ -14,13 +17,25 @@ describe('IncommingMailComponent', () => { let component: IncommingMailComponent; let fixture: ComponentFixture<IncommingMailComponent>; + const attachmentContainer: string = '[data-test-id="postfach-nachricht-attachments-container"]'; + const attachmentIcon: string = '[data-test-id="postfach-nachricht-attachment-icon"]'; + beforeEach(async () => { await TestBed.configureTestingModule({ declarations: [ IncommingMailComponent, MatIcon, FormatDateWithTimePipe, - MockComponent(PostfachMailDateComponent) + MockComponent(PostfachMailDateComponent), + HasLinkPipe, + MatIcon, + MockComponent(PostfachNachrichtAttachmentsComponent) + ], + providers: [ + { + provide: ON_PAGE, + useValue: undefined + } ] }).compileComponents(); }); @@ -35,4 +50,37 @@ describe('IncommingMailComponent', () => { it('should create', () => { expect(component).toBeTruthy(); }); + + describe('attachments', () => { + + it('should not show attachments loaded if exists', () => { + component.onPage = true; + component.postfachMail = createPostfachMailResource(); + fixture.detectChanges(); + + const element = getElementFromFixture(fixture, attachmentContainer); + + expect(element).not.toBeInstanceOf(HTMLElement); + }) + + it('should be loaded if exists', () => { + component.onPage = true; + component.postfachMail = createPostfachMailResource([PostfachMailLinkRel.ATTACHMENTS]); + fixture.detectChanges(); + + const element = getElementFromFixture(fixture, attachmentContainer); + + expect(element).toBeInstanceOf(HTMLElement); + }) + + it('should only show attachment icon on detail', () => { + component.onPage = false; + component.postfachMail = createPostfachMailResource([PostfachMailLinkRel.ATTACHMENTS]); + fixture.detectChanges(); + + const element = getElementFromFixture(fixture, attachmentIcon); + + expect(element).toBeInstanceOf(HTMLElement); + }) + }) }); diff --git a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.ts b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.ts index e2e1b16994..69604e1167 100644 --- a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.ts +++ b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/incomming-mail/incomming-mail.component.ts @@ -1,5 +1,5 @@ -import { Component, Input } from '@angular/core'; -import { PostfachMailResource } from '@goofy-client/postfach-shared'; +import { Component, Inject, Input } from '@angular/core'; +import { ON_PAGE, PostfachMailLinkRel, PostfachMailResource } from '@goofy-client/postfach-shared'; @Component({ selector: 'goofy-client-incomming-mail', @@ -8,5 +8,9 @@ import { PostfachMailResource } from '@goofy-client/postfach-shared'; }) export class IncommingMailComponent { + readonly postfachNachrichtLinkRel = PostfachMailLinkRel; + + constructor(@Inject(ON_PAGE) public onPage: boolean) {} + @Input() postfachMail: PostfachMailResource; } diff --git a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.html b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.html index ce2f6172db..a9f29481e3 100644 --- a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.html +++ b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.html @@ -1,11 +1,2 @@ <goofy-client-incomming-mail *ngIf="isIncomingMail" [postfachMail]="postfachMail"></goofy-client-incomming-mail> <goofy-client-outgoing-mail *ngIf="!isIncomingMail" [postfachMail]="postfachMail"></goofy-client-outgoing-mail> - -<ng-container *ngIf="onPage; else icon"> - <goofy-client-postfach-nachricht-attachments *ngIf="postfachMail | hasLink: postfachNachrichtLinkRel.ATTACHMENTS" data-test-id="postfach-nachricht-attachments-container" - [postfachNachricht]="postfachMail"> - </goofy-client-postfach-nachricht-attachments> -</ng-container> -<ng-template #icon> - <mat-icon data-test-id="postfach-nachricht-attachment-icon">attach_file</mat-icon> -</ng-template> \ No newline at end of file diff --git a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.spec.ts b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.spec.ts index 710a2dc668..d7ceda062f 100644 --- a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.spec.ts +++ b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.spec.ts @@ -14,24 +14,12 @@ describe('PostfachMailComponent', () => { let component: PostfachMailComponent; let fixture: ComponentFixture<PostfachMailComponent>; - const attachmentContainer: string = '[data-test-id="postfach-nachricht-attachments-container"]'; - const attachmentIcon: string = '[data-test-id="postfach-nachricht-attachment-icon"]'; - beforeEach(async () => { await TestBed.configureTestingModule({ declarations: [ PostfachMailComponent, - HasLinkPipe, - MatIcon, MockComponent(IncommingMailComponent), - MockComponent(OutgoingMailComponent), - MockComponent(PostfachNachrichtAttachmentsComponent) - ], - providers: [ - { - provide: ON_PAGE, - useValue: undefined - } + MockComponent(OutgoingMailComponent) ] }).compileComponents(); }); @@ -46,36 +34,4 @@ describe('PostfachMailComponent', () => { it('should create', () => { expect(component).toBeTruthy(); }); - - describe('attachments', () => { - - it('should not show attachments loaded if exists', () => { - component.onPage = true; - component.postfachMail = createPostfachMailResource(); - fixture.detectChanges(); - - const element = getElementFromFixture(fixture, attachmentContainer); - - expect(element).not.toBeInstanceOf(HTMLElement); - }) - - it('should be loaded if exists', () => { - component.onPage = true; - component.postfachMail = createPostfachMailResource([PostfachMailLinkRel.ATTACHMENTS]); - fixture.detectChanges(); - - const element = getElementFromFixture(fixture, attachmentContainer); - - expect(element).toBeInstanceOf(HTMLElement); - }) - - it('should only show attachment icon on detail', () => { - component.onPage = false; - fixture.detectChanges(); - - const element = getElementFromFixture(fixture, attachmentIcon); - - expect(element).toBeInstanceOf(HTMLElement); - }) - }) -}); \ No newline at end of file +}); diff --git a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.ts b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.ts index c8746cb78c..8cce991e99 100644 --- a/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.ts +++ b/goofy-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/postfach-mail.component.ts @@ -10,11 +10,9 @@ export class PostfachMailComponent { @Input() postfachMail: PostfachMailResource; - readonly postfachNachrichtLinkRel = PostfachMailLinkRel; - - constructor(@Inject(ON_PAGE) public onPage: boolean) { } + constructor() { } get isIncomingMail(): boolean { return isIncomingMail(this.postfachMail); } -} \ No newline at end of file +} -- GitLab