Conversations
+This Review has no comments
+
+
+
+ {{ apiRevision.pullRequestNo }}
+ version: {{ apiRevision.packageVersion }}
+
+ {{ apiRevision.createdBy }}
+ released: {{ apiRevision.releasedOn | timeago }}
+ created: {{ apiRevision.createdOn | timeago }}
+ last updated: {{ apiRevision | lastUpdatedOn | timeago }}
+ {{ apiRevision.label }}
+
+
+
+
-
+
+
+
+
+
This thread is marked resolved by {{ threadResolvedBy }} {{threadResolvedStateToggleText}} Resolved
-
+
diff --git a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.scss b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.scss
index 285c4f75d8b..d0256c539c8 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.scss
+++ b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.scss
@@ -1,5 +1,9 @@
:host ::ng-deep {
font-family: var(--font-family);
+
+ .comment-thread-container {
+ max-width: 1000px;
+ }
.user-avartar {
border: 2px solid var(--border-color);
diff --git a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.spec.ts b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.spec.ts
index 8f1d1b409f3..3f8cf2ccf42 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.spec.ts
+++ b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.spec.ts
@@ -3,8 +3,9 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
import { CommentThreadComponent } from './comment-thread.component';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { SharedAppModule } from 'src/app/_modules/shared/shared-app.module';
-import { CodePanelRowData } from 'src/app/_models/codePanelModels';
import { ReviewPageModule } from 'src/app/_modules/review-page/review-page.module';
+import { CommentItemModel } from 'src/app/_models/commentItemModel';
+import { CodePanelRowData } from 'src/app/_models/codePanelModels';
describe('CommentThreadComponent', () => {
let component: CommentThreadComponent;
@@ -28,4 +29,35 @@ describe('CommentThreadComponent', () => {
it('should create', () => {
expect(component).toBeTruthy();
});
+
+ describe('setCommentResolutionState', () => {
+ it ('should select latest user to resolve comment thread', () => {
+ const comment1 = {
+ id: '1',
+ isResolved: true,
+ changeHistory: [ {
+ changeAction: 'resolved',
+ changedBy: 'test user 1',
+ }]
+ } as CommentItemModel;
+ const comment2 = {
+ id: '2',
+ isResolved: true,
+ changeHistory: [ {
+ changeAction: 'resolved',
+ changedBy: 'test user 1',
+ },
+ {
+ changeAction: 'resolved',
+ changedBy: 'test user 2',
+ }]
+ } as CommentItemModel;
+
+ component.codePanelRowData!.comments = [comment1, comment2];
+ component.codePanelRowData!.isResolvedCommentThread = true;
+ fixture.detectChanges();
+ component.setCommentResolutionState();
+ expect(component.threadResolvedBy).toBe('test user 2');
+ });
+ });
});
diff --git a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.ts b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.ts
index 4580f03808a..f9c5490e591 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.ts
+++ b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.ts
@@ -18,6 +18,7 @@ import { UserProfile } from 'src/app/_models/userProfile';
export class CommentThreadComponent {
@Input() codePanelRowData: CodePanelRowData | undefined = undefined;
@Input() associatedCodeLine: CodePanelRowData | undefined;
+ @Input() instanceLocation: "code-panel" | "conversations" = "code-panel";
@Output() cancelCommentActionEmitter : EventEmitter = new EventEmitter();
@Output() saveCommentActionEmitter : EventEmitter = new EventEmitter();
@Output() deleteCommentActionEmitter : EventEmitter = new EventEmitter();
@@ -109,13 +110,19 @@ export class CommentThreadComponent {
setCommentResolutionState() {
if (this.codePanelRowData?.isResolvedCommentThread) {
- this.threadResolvedBy = this.codePanelRowData?.commentThreadIsResolvedBy ?? this.codePanelRowData?.comments?.find(comment => comment.isResolved)?.changeHistory.find(ch => ch.changeAction === 'resolved')?.changedBy;
- this.spacingBasedOnResolvedState = 'mb-2';
+ this.threadResolvedBy = this.codePanelRowData?.commentThreadIsResolvedBy;
+ if (!this.threadResolvedBy) {
+ const lastestResolvedComment = Array.from(this.codePanelRowData?.comments || []).reverse().find(comment => comment.isResolved && comment.changeHistory && comment.changeHistory.some(ch => ch.changeAction === 'resolved'));
+ if (lastestResolvedComment) {
+ this.threadResolvedBy = lastestResolvedComment.changeHistory.reverse().find(ch => ch.changeAction === 'resolved')?.changedBy;
+ }
+ }
+ this.spacingBasedOnResolvedState = (this.instanceLocation === "code-panel") ? 'mb-2' : "";
this.resolveThreadButtonText = 'Unresolve';
}
else {
this.threadResolvedBy = '';
- this.spacingBasedOnResolvedState = 'my-2';
+ this.spacingBasedOnResolvedState = (this.instanceLocation === "code-panel") ? 'my-2' : "";
this.resolveThreadButtonText = 'Resolve';
}
}
@@ -171,14 +178,16 @@ export class CommentThreadComponent {
const commentId = target.getAttribute("data-item-id");
const commentData = this.codePanelRowData?.comments?.find(comment => comment.id === commentId)?.commentText.replace(/<[^>]*>/g, '').trim();
- console.log(this.associatedCodeLine);
-
- const codeLineContent = this.associatedCodeLine
+ let codeLineContent = this.associatedCodeLine
? this.associatedCodeLine.rowOfTokens
.map(token => token.value)
.join('')
: '';
+ if (!codeLineContent) {
+ codeLineContent = this.codePanelRowData?.comments[0].elementId!;
+ }
+
const nodeId: string = this.codePanelRowData?.nodeId ?? 'defaultNodeId';
const apiViewUrl = `${window.location.href.split("#")[0]}&nId=${encodeURIComponent(nodeId)}`;
const issueBody = encodeURIComponent(`\`\`\`${event.item?.title}\n${codeLineContent}\n\`\`\`\n#\n${commentData}\n#\n[Created from ApiView comment](${apiViewUrl})`);
@@ -226,17 +235,25 @@ export class CommentThreadComponent {
saveCommentAction(event: Event) {
const target = event.target as Element;
const replyEditorContainer = target.closest(".reply-editor-container") as Element;
+ let revisionIdForConversationGroup: string | null | undefined = null;
+ let elementIdForConversationGroup: string | null | undefined = null;
+
+ if (this.instanceLocation === "conversations") {
+ revisionIdForConversationGroup = target.closest(".conversation-group-revision-id")?.getAttribute("data-conversation-group-revision-id");
+ elementIdForConversationGroup = (target.closest(".conversation-group-threads")?.getElementsByClassName("conversation-group-element-id")[0] as HTMLElement).innerText;
+ }
if (replyEditorContainer) {
const replyEditor = this.editor.find(e => e.editorId === "replyEditor");
const content = replyEditor?.getEditorContent();
this.saveCommentActionEmitter.emit(
{
- nodeId: this.codePanelRowData!.nodeId,
+ nodeId: (this.instanceLocation === "conversations") ? elementIdForConversationGroup : this.codePanelRowData!.nodeId,
nodeIdHashed: this.codePanelRowData!.nodeIdHashed,
commentText: content,
allowAnyOneToResolve: this.allowAnyOneToResolve,
- associatedRowPositionInGroup: this.codePanelRowData!.associatedRowPositionInGroup
+ associatedRowPositionInGroup: this.codePanelRowData!.associatedRowPositionInGroup,
+ revisionIdForConversationGroup: revisionIdForConversationGroup
}
);
this.codePanelRowData!.showReplyTextBox = false;
@@ -247,11 +264,12 @@ export class CommentThreadComponent {
const content = replyEditor?.getEditorContent();
this.saveCommentActionEmitter.emit(
{
- nodeId: this.codePanelRowData!.nodeId,
+ nodeId: (this.instanceLocation === "conversations") ? elementIdForConversationGroup : this.codePanelRowData!.nodeId,
nodeIdHashed: this.codePanelRowData!.nodeIdHashed,
commentId: commentId,
commentText: content,
- associatedRowPositionInGroup: this.codePanelRowData!.associatedRowPositionInGroup
+ associatedRowPositionInGroup: this.codePanelRowData!.associatedRowPositionInGroup,
+ revisionIdForConversationGroup: revisionIdForConversationGroup
}
);
this.codePanelRowData!.comments!.find(comment => comment.id === commentId)!.isInEditMode = false;
diff --git a/src/dotnet/APIView/ClientSPA/src/app/_helpers/common-helpers.ts b/src/dotnet/APIView/ClientSPA/src/app/_helpers/common-helpers.ts
index b9abf5b92e3..86e6d5b908b 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/_helpers/common-helpers.ts
+++ b/src/dotnet/APIView/ClientSPA/src/app/_helpers/common-helpers.ts
@@ -6,6 +6,9 @@ export const SCROLL_TO_NODE_QUERY_PARAM = "nId";
export const FULL_DIFF_STYLE = "full";
export const TREE_DIFF_STYLE = "trees";
export const NODE_DIFF_STYLE = "nodes";
+export const MANUAL_ICON = "fa-solid fa-arrow-up-from-bracket";
+export const PR_ICON = "fa-solid fa-code-pull-request";
+export const AUTOMATIC_ICON = "fa-solid fa-robot";
export function getLanguageCssSafeName(language: string): string {
switch (language.toLowerCase()) {
@@ -29,4 +32,20 @@ export function mapLanguageAliases(languages: Iterable): string[] {
result.add(language);
}
return Array.from(result);
+}
+
+export function getTypeClass(type: string): string {
+ let result = "";
+ switch (type) {
+ case 'manual':
+ result = MANUAL_ICON;
+ break;
+ case 'pullRequest':
+ result = PR_ICON;
+ break;
+ case 'automatic':
+ result = AUTOMATIC_ICON;
+ break;
+ }
+ return result;
}
\ No newline at end of file
diff --git a/src/dotnet/APIView/ClientSPA/src/app/_helpers/router-helpers.ts b/src/dotnet/APIView/ClientSPA/src/app/_helpers/router-helpers.ts
index 6200da84d04..10ac49c1f6f 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/_helpers/router-helpers.ts
+++ b/src/dotnet/APIView/ClientSPA/src/app/_helpers/router-helpers.ts
@@ -1,6 +1,7 @@
import { ActivatedRoute } from "@angular/router";
+import { SCROLL_TO_NODE_QUERY_PARAM } from "./common-helpers";
-export function getQueryParams(route: ActivatedRoute, excludedKeys: string[] = ["nId"]) {
+export function getQueryParams(route: ActivatedRoute, excludedKeys: string[] = [SCROLL_TO_NODE_QUERY_PARAM]) {
return route.snapshot.queryParamMap.keys.reduce((params: { [key: string]: any; }, key) => {
if (!excludedKeys.includes(key)) {
params[key] = route.snapshot.queryParamMap.get(key);
diff --git a/src/dotnet/APIView/ClientSPA/src/app/_models/commentItemModel.ts b/src/dotnet/APIView/ClientSPA/src/app/_models/commentItemModel.ts
index 5af7fe0474e..fd5a15c7139 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/_models/commentItemModel.ts
+++ b/src/dotnet/APIView/ClientSPA/src/app/_models/commentItemModel.ts
@@ -8,7 +8,7 @@ export enum CommentType {
export class CommentItemModel {
id: string = '';
reviewId: string = '';
- aPIRevisionId: string = '';
+ apiRevisionId: string = '';
elementId: string = '';
sectionClass: string = '';
commentText: string = '';
@@ -28,7 +28,7 @@ export class CommentItemModel {
constructor() {
this.id = '';
this.reviewId = '';
- this.aPIRevisionId = '';
+ this.apiRevisionId = '';
this.elementId = '';
this.sectionClass = '';
this.commentText = '';
diff --git a/src/dotnet/APIView/ClientSPA/src/app/_modules/review-page/review-page.module.ts b/src/dotnet/APIView/ClientSPA/src/app/_modules/review-page/review-page.module.ts
index 3023b546676..cadbd3ecfa9 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/_modules/review-page/review-page.module.ts
+++ b/src/dotnet/APIView/ClientSPA/src/app/_modules/review-page/review-page.module.ts
@@ -14,14 +14,15 @@ import { MenuModule } from 'primeng/menu';
import { TimelineModule } from 'primeng/timeline';
import { SharedAppModule } from '../shared/shared-app.module';
import { ButtonModule } from 'primeng/button';
+import { DividerModule } from 'primeng/divider';
import { UiScrollModule } from 'ngx-ui-scroll' ;
import { PageOptionsSectionComponent } from 'src/app/_components/shared/page-options-section/page-options-section.component';
import { ApiRevisionOptionsComponent } from 'src/app/_components/api-revision-options/api-revision-options.component';
import { MarkdownToHtmlPipe } from 'src/app/_pipes/markdown-to-html.pipe';
import { EditorComponent } from 'src/app/_components/shared/editor/editor.component';
-import { SelectButtonModule } from 'primeng/selectbutton';
import { ReviewPageOptionsComponent } from 'src/app/_components/review-page-options/review-page-options.component';
import { InputSwitchModule } from 'primeng/inputswitch';
+import { ConversationsComponent } from 'src/app/_components/conversations/conversations.component';
const routes: Routes = [
{ path: '', component: ReviewPageComponent }
@@ -34,11 +35,12 @@ const routes: Routes = [
ReviewInfoComponent,
CodePanelComponent,
CommentThreadComponent,
+ ConversationsComponent,
PageOptionsSectionComponent,
ReviewPageOptionsComponent,
ApiRevisionOptionsComponent,
MarkdownToHtmlPipe,
- EditorComponent
+ EditorComponent,
],
imports: [
SharedAppModule,
@@ -52,6 +54,7 @@ const routes: Routes = [
ButtonModule,
InputSwitchModule,
UiScrollModule,
+ DividerModule,
RouterModule.forChild(routes),
]
})
diff --git a/src/dotnet/APIView/ClientSPA/src/app/_modules/shared/shared-app.module.ts b/src/dotnet/APIView/ClientSPA/src/app/_modules/shared/shared-app.module.ts
index 971a28d4928..2474e4426a8 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/_modules/shared/shared-app.module.ts
+++ b/src/dotnet/APIView/ClientSPA/src/app/_modules/shared/shared-app.module.ts
@@ -20,6 +20,7 @@ import { SelectButtonModule } from 'primeng/selectbutton';
import { FileUploadModule } from 'primeng/fileupload';
import { InputTextModule } from 'primeng/inputtext';
import { MessagesModule } from 'primeng/messages';
+import { BadgeModule } from 'primeng/badge';
@NgModule({
@@ -38,6 +39,7 @@ import { MessagesModule } from 'primeng/messages';
LanguageNamesPipe,
LastUpdatedOnPipe,
ApprovalPipe,
+ BadgeModule,
ContextMenuModule,
TableModule,
ChipModule,
@@ -52,9 +54,10 @@ import { MessagesModule } from 'primeng/messages';
SplitterModule,
SidebarModule,
TimeagoModule,
- InputTextModule
+ InputTextModule,
],
imports: [
+ BadgeModule,
CommonModule,
ContextMenuModule,
TableModule,
diff --git a/src/dotnet/APIView/ClientSPA/src/app/app.module.ts b/src/dotnet/APIView/ClientSPA/src/app/app.module.ts
index b69e9dcc59c..b90f72292d8 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/app.module.ts
+++ b/src/dotnet/APIView/ClientSPA/src/app/app.module.ts
@@ -2,17 +2,14 @@ import { NgModule, APP_INITIALIZER } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
-import { ReactiveFormsModule } from '@angular/forms';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { IndexPageComponent } from './_components/index-page/index-page.component';
import { ReviewsListComponent } from './_components/reviews-list/reviews-list.component';
-import { InputTextModule } from 'primeng/inputtext';
import { TabMenuModule } from 'primeng/tabmenu';
import { ToolbarModule } from 'primeng/toolbar';
import { BadgeModule } from 'primeng/badge';
-import { FileUploadModule } from 'primeng/fileupload';
import { Observable } from 'rxjs';
import { ConfigService } from './_services/config/config.service';
import { CookieService } from 'ngx-cookie-service';
diff --git a/src/dotnet/APIView/ClientSPA/src/ng-prime-overrides.scss b/src/dotnet/APIView/ClientSPA/src/ng-prime-overrides.scss
index 49c864c7826..6511967b38a 100644
--- a/src/dotnet/APIView/ClientSPA/src/ng-prime-overrides.scss
+++ b/src/dotnet/APIView/ClientSPA/src/ng-prime-overrides.scss
@@ -163,6 +163,10 @@ p-contextmenusub {
outline-offset: 0.15rem;
}
+.p-divider.p-divider-horizontal:before {
+ border-top: 1px solid var(--border-color);
+}
+
.p-editor-container .p-editor-toolbar {
background: var(--base-bg-color);
}
diff --git a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.scss b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.scss
index 285c4f75d8b..d0256c539c8 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.scss
+++ b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.scss
@@ -1,5 +1,9 @@
:host ::ng-deep {
font-family: var(--font-family);
+
+ .comment-thread-container {
+ max-width: 1000px;
+ }
.user-avartar {
border: 2px solid var(--border-color);
diff --git a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.spec.ts b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.spec.ts
index 8f1d1b409f3..3f8cf2ccf42 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.spec.ts
+++ b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.spec.ts
@@ -3,8 +3,9 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
import { CommentThreadComponent } from './comment-thread.component';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { SharedAppModule } from 'src/app/_modules/shared/shared-app.module';
-import { CodePanelRowData } from 'src/app/_models/codePanelModels';
import { ReviewPageModule } from 'src/app/_modules/review-page/review-page.module';
+import { CommentItemModel } from 'src/app/_models/commentItemModel';
+import { CodePanelRowData } from 'src/app/_models/codePanelModels';
describe('CommentThreadComponent', () => {
let component: CommentThreadComponent;
@@ -28,4 +29,35 @@ describe('CommentThreadComponent', () => {
it('should create', () => {
expect(component).toBeTruthy();
});
+
+ describe('setCommentResolutionState', () => {
+ it ('should select latest user to resolve comment thread', () => {
+ const comment1 = {
+ id: '1',
+ isResolved: true,
+ changeHistory: [ {
+ changeAction: 'resolved',
+ changedBy: 'test user 1',
+ }]
+ } as CommentItemModel;
+ const comment2 = {
+ id: '2',
+ isResolved: true,
+ changeHistory: [ {
+ changeAction: 'resolved',
+ changedBy: 'test user 1',
+ },
+ {
+ changeAction: 'resolved',
+ changedBy: 'test user 2',
+ }]
+ } as CommentItemModel;
+
+ component.codePanelRowData!.comments = [comment1, comment2];
+ component.codePanelRowData!.isResolvedCommentThread = true;
+ fixture.detectChanges();
+ component.setCommentResolutionState();
+ expect(component.threadResolvedBy).toBe('test user 2');
+ });
+ });
});
diff --git a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.ts b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.ts
index 4580f03808a..f9c5490e591 100644
--- a/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.ts
+++ b/src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.ts
@@ -18,6 +18,7 @@ import { UserProfile } from 'src/app/_models/userProfile';
export class CommentThreadComponent {
@Input() codePanelRowData: CodePanelRowData | undefined = undefined;
@Input() associatedCodeLine: CodePanelRowData | undefined;
+ @Input() instanceLocation: "code-panel" | "conversations" = "code-panel";
@Output() cancelCommentActionEmitter : EventEmitter