diff --git a/frontend/src/app/shared/components/comments/comment.component.ts b/frontend/src/app/shared/components/comments/comment.component.ts index 35e546c14..1a5723062 100644 --- a/frontend/src/app/shared/components/comments/comment.component.ts +++ b/frontend/src/app/shared/components/comments/comment.component.ts @@ -70,7 +70,7 @@ export class CommentComponent extends StatefulComponent { public userToken = ''; @Input() - public currenUrl = ''; + public currentUrl = ''; @Input({ required: true }) public mentionUsers?: ReadonlyArray; @@ -133,7 +133,7 @@ export class CommentComponent extends StatefulComponent { if (text && text.length > 0 && this.commentItem.comment.id) { const replyTo = this.commentItem.comment.id!; - this.comments.create(this.userToken, text, this.currenUrl, { replyTo }); + this.comments.create(this.userToken, text, this.currentUrl, { replyTo }); } this.replyForm.submitCompleted(); diff --git a/frontend/src/app/shared/components/comments/comments.component.html b/frontend/src/app/shared/components/comments/comments.component.html index 1addfcffd..e741766ec 100644 --- a/frontend/src/app/shared/components/comments/comments.component.html +++ b/frontend/src/app/shared/components/comments/comments.component.html @@ -23,7 +23,7 @@ canFollow="false" [commentItem]="comment" [comments]="commentsState" - [currenUrl]="router.url" + [currentUrl]="router.url" [mentionConfig]="mentionConfig" [mentionUsers]="users" [scrollContainer]="'.comments-list'" diff --git a/frontend/src/app/shared/components/comments/comments.component.scss b/frontend/src/app/shared/components/comments/comments.component.scss index e722683cf..f72b1d7f4 100644 --- a/frontend/src/app/shared/components/comments/comments.component.scss +++ b/frontend/src/app/shared/components/comments/comments.component.scss @@ -4,6 +4,7 @@ :host ::ng-deep { .mention-menu { border-color: $color-border !important; + max-width: 290px; } .mention-active > a { diff --git a/frontend/src/app/shared/components/comments/comments.component.ts b/frontend/src/app/shared/components/comments/comments.component.ts index 1df669364..e2a19c84e 100644 --- a/frontend/src/app/shared/components/comments/comments.component.ts +++ b/frontend/src/app/shared/components/comments/comments.component.ts @@ -11,7 +11,7 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { Router } from '@angular/router'; import { MentionConfig, MentionModule } from 'angular-mentions'; import { BehaviorSubject } from 'rxjs'; -import { MessageBus, ResizedDirective, Subscriptions, TranslatePipe } from '@app/framework'; +import { MessageBus, Subscriptions, TranslatePipe } from '@app/framework'; import { AnnotationCreateAfterNavigate, AnnotationsSelectAfterNavigate, AuthService, CommentsState, ContributorsState, UpsertCommentForm } from '@app/shared/internal'; import { CommentComponent } from './comment.component'; @@ -26,7 +26,6 @@ import { CommentComponent } from './comment.component'; FormsModule, MentionModule, ReactiveFormsModule, - ResizedDirective, TranslatePipe, ], }) @@ -42,7 +41,7 @@ export class CommentsComponent implements OnInit { public commentsId = ''; public mentionUsers = this.contributorsState.contributors; - public mentionConfig: MentionConfig = { dropUp: true, labelKey: 'contributorEmail' }; + public mentionConfig: MentionConfig = { dropUp: false, labelKey: 'contributorEmail' }; public commentForm = new UpsertCommentForm(); public commentsItems = this.commentsState.getGroupedComments(this.selection); @@ -58,6 +57,8 @@ export class CommentsComponent implements OnInit { } public ngOnInit() { + this.contributorsState.loadIfNotLoaded(); + this.subscriptions.add( this.messageBus.of(AnnotationsSelectAfterNavigate) .subscribe(message => {