diff --git a/src/main/webapp/app/shared/metis/answer-post/answer-post.component.html b/src/main/webapp/app/shared/metis/answer-post/answer-post.component.html index 073e4e907593..6682f5c146c0 100644 --- a/src/main/webapp/app/shared/metis/answer-post/answer-post.component.html +++ b/src/main/webapp/app/shared/metis/answer-post/answer-post.component.html @@ -5,7 +5,6 @@ [isReadOnlyMode]="isReadOnlyMode" [isCommunicationPage]="isCommunicationPage" [lastReadDate]="lastReadDate" - [hasChannelModerationRights]="hasChannelModerationRights" [isDeleted]="isDeleted" /> } diff --git a/src/main/webapp/app/shared/metis/post/post.component.html b/src/main/webapp/app/shared/metis/post/post.component.html index 1fcad5a5987f..42352bdfa0d6 100644 --- a/src/main/webapp/app/shared/metis/post/post.component.html +++ b/src/main/webapp/app/shared/metis/post/post.component.html @@ -6,7 +6,6 @@ [posting]="posting" [isDeleted]="isDeleted" [isCommunicationPage]="isCommunicationPage" - [hasChannelModerationRights]="hasChannelModerationRights" (isModalOpen)="displayInlineInput = true" [lastReadDate]="lastReadDate" /> @@ -68,6 +67,7 @@ >
@if (!previewMode) { + - + @if (!previewMode) { } - diff --git a/src/main/webapp/app/shared/metis/post/post.component.scss b/src/main/webapp/app/shared/metis/post/post.component.scss index 1a6cf4b3ace2..10cb7ef83132 100644 --- a/src/main/webapp/app/shared/metis/post/post.component.scss +++ b/src/main/webapp/app/shared/metis/post/post.component.scss @@ -20,6 +20,7 @@ top: -1.8rem; right: 1%; display: flex; + max-height: 2.2rem; gap: 10px; visibility: hidden; transition: diff --git a/src/main/webapp/app/shared/metis/post/post.component.ts b/src/main/webapp/app/shared/metis/post/post.component.ts index d70c13abae68..bd502fbea1ac 100644 --- a/src/main/webapp/app/shared/metis/post/post.component.ts +++ b/src/main/webapp/app/shared/metis/post/post.component.ts @@ -90,7 +90,7 @@ export class PostComponent extends PostingDirective implements OnInit, OnC isConsecutive = input(false); dropdownPosition = { x: 0, y: 0 }; - @ViewChild(PostReactionsBarComponent) private reactionsBarComponent!: PostReactionsBarComponent; + @ViewChild(PostReactionsBarComponent) protected reactionsBarComponent!: PostReactionsBarComponent; constructor( public metisService: MetisService, @@ -218,6 +218,13 @@ export class PostComponent extends PostingDirective implements OnInit, OnC this.postFooterComponent.openCreateAnswerPostModal(); } + /** + * Close create answer modal + */ + closeCreateAnswerPostModal() { + this.postFooterComponent.closeCreateAnswerPostModal(); + } + /** * sorts answerPosts by two criteria * 1. criterion: resolvesPost -> true comes first diff --git a/src/main/webapp/app/shared/metis/posting-footer/post-footer/post-footer.component.ts b/src/main/webapp/app/shared/metis/posting-footer/post-footer/post-footer.component.ts index 7f6d3b0531a5..5808a9b342ba 100644 --- a/src/main/webapp/app/shared/metis/posting-footer/post-footer/post-footer.component.ts +++ b/src/main/webapp/app/shared/metis/posting-footer/post-footer/post-footer.component.ts @@ -173,6 +173,13 @@ export class PostFooterComponent extends PostingFooterDirective implements this.createAnswerPostModalComponent.open(); } + /** + * Close create answer modal + */ + closeCreateAnswerPostModal() { + this.createAnswerPostModalComponent.close(); + } + protected postsTrackByFn(index: number, post: Post): number { return post.id!; } diff --git a/src/main/webapp/app/shared/metis/posting-header/answer-post-header/answer-post-header.component.ts b/src/main/webapp/app/shared/metis/posting-header/answer-post-header/answer-post-header.component.ts index 9871b3bbee8f..bb1ff3cbbbd2 100644 --- a/src/main/webapp/app/shared/metis/posting-header/answer-post-header/answer-post-header.component.ts +++ b/src/main/webapp/app/shared/metis/posting-header/answer-post-header/answer-post-header.component.ts @@ -2,7 +2,7 @@ import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angu import { AnswerPost } from 'app/entities/metis/answer-post.model'; import { PostingHeaderDirective } from 'app/shared/metis/posting-header/posting-header.directive'; import { MetisService } from 'app/shared/metis/metis.service'; -import { faCheck, faCog, faPencilAlt } from '@fortawesome/free-solid-svg-icons'; +import { faCheck, faPencilAlt } from '@fortawesome/free-solid-svg-icons'; import dayjs from 'dayjs/esm'; import { AccountService } from 'app/core/auth/account.service'; @@ -18,13 +18,9 @@ export class AnswerPostHeaderComponent extends PostingHeaderDirective(); - isAuthorOfOriginalPost: boolean; - isAnswerOfAnnouncement: boolean; - // Icons - faCheck = faCheck; - faPencilAlt = faPencilAlt; - faCog = faCog; + readonly faCheck = faCheck; + readonly faPencilAlt = faPencilAlt; constructor( protected metisService: MetisService, diff --git a/src/main/webapp/app/shared/metis/posting-header/post-header/post-header.component.ts b/src/main/webapp/app/shared/metis/posting-header/post-header/post-header.component.ts index 3463b66456fc..fe4bc129addd 100644 --- a/src/main/webapp/app/shared/metis/posting-header/post-header/post-header.component.ts +++ b/src/main/webapp/app/shared/metis/posting-header/post-header/post-header.component.ts @@ -3,7 +3,7 @@ import { Post } from 'app/entities/metis/post.model'; import { PostingHeaderDirective } from 'app/shared/metis/posting-header/posting-header.directive'; import { MetisService } from 'app/shared/metis/metis.service'; import { PostCreateEditModalComponent } from 'app/shared/metis/posting-create-edit-modal/post-create-edit-modal/post-create-edit-modal.component'; -import { faCheckSquare, faCog, faPencilAlt } from '@fortawesome/free-solid-svg-icons'; +import { faCheckSquare, faPencilAlt } from '@fortawesome/free-solid-svg-icons'; import dayjs from 'dayjs/esm'; import { CachingStrategy } from 'app/shared/image/secured-image.component'; import { AccountService } from 'app/core/auth/account.service'; @@ -22,9 +22,8 @@ export class PostHeaderComponent extends PostingHeaderDirective implements isAtLeastInstructorInCourse: boolean; // Icons - faPencilAlt = faPencilAlt; - faCheckSquare = faCheckSquare; - faCog = faCog; + readonly faPencilAlt = faPencilAlt; + readonly faCheckSquare = faCheckSquare; constructor( protected metisService: MetisService, diff --git a/src/main/webapp/app/shared/metis/posting-reactions-bar/answer-post-reactions-bar/answer-post-reactions-bar.component.html b/src/main/webapp/app/shared/metis/posting-reactions-bar/answer-post-reactions-bar/answer-post-reactions-bar.component.html index 86a4a499a599..e0ed87168dc9 100644 --- a/src/main/webapp/app/shared/metis/posting-reactions-bar/answer-post-reactions-bar/answer-post-reactions-bar.component.html +++ b/src/main/webapp/app/shared/metis/posting-reactions-bar/answer-post-reactions-bar/answer-post-reactions-bar.component.html @@ -89,13 +89,4 @@ } }
- - @if (isLastAnswer && !isThreadSidebar) { -
- -
- } diff --git a/src/main/webapp/app/shared/metis/posting-reactions-bar/post-reactions-bar/post-reactions-bar.component.html b/src/main/webapp/app/shared/metis/posting-reactions-bar/post-reactions-bar/post-reactions-bar.component.html index 5ba32fbe573e..500954b38df8 100644 --- a/src/main/webapp/app/shared/metis/posting-reactions-bar/post-reactions-bar/post-reactions-bar.component.html +++ b/src/main/webapp/app/shared/metis/posting-reactions-bar/post-reactions-bar/post-reactions-bar.component.html @@ -1,10 +1,18 @@ -
+
+ @if (hoverBar && sortedAnswerPosts.length === 0) { +
+ +
+ } @if (!isCommunicationPage) { @if (sortedAnswerPosts.length) { @if (showAnswers) {
- @@ -12,8 +20,8 @@ } @else {
-
} - } @else { - -
- -
} } @else { @if (!isThreadSidebar) { - - @if (hoverBar && sortedAnswerPosts.length === 0) { -
- -
- } @if (!showAnswers && sortedAnswerPosts.length) {
@@ -142,7 +133,7 @@ }
- @if (getShowNewMessageIcon()) { + @if (isEmojiCount && getShowNewMessageIcon()) {
}
diff --git a/src/main/webapp/app/shared/metis/posting-reactions-bar/post-reactions-bar/post-reactions-bar.component.ts b/src/main/webapp/app/shared/metis/posting-reactions-bar/post-reactions-bar/post-reactions-bar.component.ts index 1d039326b20b..2ff96f282a6b 100644 --- a/src/main/webapp/app/shared/metis/posting-reactions-bar/post-reactions-bar/post-reactions-bar.component.ts +++ b/src/main/webapp/app/shared/metis/posting-reactions-bar/post-reactions-bar/post-reactions-bar.component.ts @@ -41,6 +41,7 @@ export class PostReactionsBarComponent extends PostingsReactionsBarDirective(); @Output() openPostingCreateEditModal = new EventEmitter(); + @Output() closePostingCreateEditModal = new EventEmitter(); @Output() openThread = new EventEmitter(); @Input() previewMode: boolean; isAtLeastInstructorInCourse: boolean; @@ -63,6 +64,16 @@ export class PostReactionsBarComponent extends PostingsReactionsBarDirective reaction.count >= 1); } + openAnswerView() { + this.showAnswersChange.emit(true); + this.openPostingCreateEditModal.emit(); + } + + closeAnswerView() { + this.showAnswersChange.emit(false); + this.closePostingCreateEditModal.emit(); + } + /** * on initialization: call resetTooltipsAndPriority */ diff --git a/src/main/webapp/app/shared/metis/posting-reactions-bar/posting-reactions-bar.component.scss b/src/main/webapp/app/shared/metis/posting-reactions-bar/posting-reactions-bar.component.scss index 0a289a54ceaa..bc7fbfc61165 100644 --- a/src/main/webapp/app/shared/metis/posting-reactions-bar/posting-reactions-bar.component.scss +++ b/src/main/webapp/app/shared/metis/posting-reactions-bar/posting-reactions-bar.component.scss @@ -13,6 +13,7 @@ border-radius: 1rem; align-items: center; height: 1.2rem; + display: inline-flex; &.open-selector { box-shadow: inset 0 0 0 1px var(--metis-gray); diff --git a/src/test/javascript/spec/component/shared/metis/post/post.component.spec.ts b/src/test/javascript/spec/component/shared/metis/post/post.component.spec.ts index cdcc598b7988..c7c9cf4f24db 100644 --- a/src/test/javascript/spec/component/shared/metis/post/post.component.spec.ts +++ b/src/test/javascript/spec/component/shared/metis/post/post.component.spec.ts @@ -170,6 +170,15 @@ describe('PostComponent', () => { expect(postFooterOpenCreateAnswerPostModal).toHaveBeenCalledOnce(); }); + it('should close create answer post modal', () => { + component.posting = metisPostExerciseUser1; + component.ngOnInit(); + fixture.detectChanges(); + const postFooterOpenCreateAnswerPostModal = jest.spyOn(component.postFooterComponent, 'closeCreateAnswerPostModal'); + component.closeCreateAnswerPostModal(); + expect(postFooterOpenCreateAnswerPostModal).toHaveBeenCalledOnce(); + }); + it('should create or navigate to oneToOneChat when not on messaging page', () => { const navigateSpy = jest.spyOn(router, 'navigate'); const oneToOneChatService = TestBed.inject(OneToOneChatService); diff --git a/src/test/javascript/spec/component/shared/metis/postings-footer/post-footer/post-footer.component.spec.ts b/src/test/javascript/spec/component/shared/metis/postings-footer/post-footer/post-footer.component.spec.ts index 45c38925db52..8071b5a84a95 100644 --- a/src/test/javascript/spec/component/shared/metis/postings-footer/post-footer/post-footer.component.spec.ts +++ b/src/test/javascript/spec/component/shared/metis/postings-footer/post-footer/post-footer.component.spec.ts @@ -151,4 +151,13 @@ describe('PostFooterComponent', () => { component.openCreateAnswerPostModal(); expect(createAnswerPostModalOpen).toHaveBeenCalledOnce(); }); + + it('should close create answer post modal', () => { + component.posting = metisPostExerciseUser1; + component.ngOnInit(); + fixture.detectChanges(); + const createAnswerPostModalClose = jest.spyOn(component.createAnswerPostModalComponent, 'close'); + component.closeCreateAnswerPostModal(); + expect(createAnswerPostModalClose).toHaveBeenCalledOnce(); + }); }); diff --git a/src/test/javascript/spec/component/shared/metis/postings-reactions-bar/answer-post-reactions-bar/answer-post-reactions-bar.component.spec.ts b/src/test/javascript/spec/component/shared/metis/postings-reactions-bar/answer-post-reactions-bar/answer-post-reactions-bar.component.spec.ts index 8e5b51590166..a3b889e8d146 100644 --- a/src/test/javascript/spec/component/shared/metis/postings-reactions-bar/answer-post-reactions-bar/answer-post-reactions-bar.component.spec.ts +++ b/src/test/javascript/spec/component/shared/metis/postings-reactions-bar/answer-post-reactions-bar/answer-post-reactions-bar.component.spec.ts @@ -193,15 +193,6 @@ describe('AnswerPostReactionsBarComponent', () => { expect(answerNowButton).toBeNull(); }); - it('answer now button should be visible if answer is the last one', () => { - component.posting = post; - component.isLastAnswer = true; - component.ngOnInit(); - fixture.detectChanges(); - const answerNowButton = fixture.debugElement.query(By.css('.reply-btn')).nativeElement; - expect(answerNowButton.innerHTML).toContain('reply'); - }); - it('should invoke metis service when toggle resolve is clicked', () => { metisServiceUserPostingAuthorMock.mockReturnValue(true); fixture.detectChanges(); diff --git a/src/test/javascript/spec/component/shared/metis/postings-reactions-bar/post-reactions-bar/post-reactions-bar.component.spec.ts b/src/test/javascript/spec/component/shared/metis/postings-reactions-bar/post-reactions-bar/post-reactions-bar.component.spec.ts index f5ccda3ada15..d1b1607ffb1d 100644 --- a/src/test/javascript/spec/component/shared/metis/postings-reactions-bar/post-reactions-bar/post-reactions-bar.component.spec.ts +++ b/src/test/javascript/spec/component/shared/metis/postings-reactions-bar/post-reactions-bar/post-reactions-bar.component.spec.ts @@ -3,7 +3,7 @@ import { MetisService } from 'app/shared/metis/metis.service'; import { DebugElement } from '@angular/core'; import { Post } from 'app/entities/metis/post.model'; import { MockComponent, MockDirective, MockModule, MockPipe, MockProvider } from 'ng-mocks'; -import { getElement, getElements } from '../../../../../helpers/utils/general.utils'; +import { getElement } from '../../../../../helpers/utils/general.utils'; import { PostReactionsBarComponent } from 'app/shared/metis/posting-reactions-bar/post-reactions-bar/post-reactions-bar.component'; import { OverlayModule } from '@angular/cdk/overlay'; import { Reaction } from 'app/entities/metis/reaction.model'; @@ -239,9 +239,8 @@ describe('PostReactionsBarComponent', () => { component.posting = post; component.ngOnInit(); + component.isEmojiCount = true; fixture.detectChanges(); - const reactions = getElements(debugElement, 'jhi-emoji'); - expect(reactions).toHaveLength(2); expect(component.reactionMetaDataMap).toEqual({ smile: { count: 1, @@ -311,14 +310,6 @@ describe('PostReactionsBarComponent', () => { expect(component.pinTooltip).toBe('artemisApp.metis.pinnedPostTooltip'); }); - it('start discussion button should be visible if post does not yet have any answers', () => { - component.posting = post; - component.sortedAnswerPosts = []; - fixture.detectChanges(); - const startDiscussion = fixture.debugElement.query(By.css('.reply-btn')).nativeElement; - expect(startDiscussion.innerHTML).toContain('reply'); - }); - it('should display button to show single answer', () => { component.posting = post; component.sortedAnswerPosts = [metisPostExerciseUser1]; @@ -343,4 +334,24 @@ describe('PostReactionsBarComponent', () => { const answerNowButton = fixture.debugElement.query(By.css('.collapse-answers-btn')).nativeElement; expect(answerNowButton.innerHTML).toContain('collapseAnswers'); }); + + it('should emit showAnswersChange and openPostingCreateEditModal when openAnswerView is called', () => { + const showAnswersChangeSpy = jest.spyOn(component.showAnswersChange, 'emit'); + const openPostingCreateEditModalSpy = jest.spyOn(component.openPostingCreateEditModal, 'emit'); + + component.openAnswerView(); + + expect(showAnswersChangeSpy).toHaveBeenCalledWith(true); + expect(openPostingCreateEditModalSpy).toHaveBeenCalled(); + }); + + it('should emit showAnswersChange and closePostingCreateEditModal when closeAnswerView is called', () => { + const showAnswersChangeSpy = jest.spyOn(component.showAnswersChange, 'emit'); + const closePostingCreateEditModalSpy = jest.spyOn(component.closePostingCreateEditModal, 'emit'); + + component.closeAnswerView(); + + expect(showAnswersChangeSpy).toHaveBeenCalledWith(false); + expect(closePostingCreateEditModalSpy).toHaveBeenCalled(); + }); });