comment thread can be updated by draft mode change.

src/vs/editor/common/modes.ts

@@ -1223,6 +1223,11 @@ export interface CommentThreadChangedEvent {
 	 * Changed comment threads.
 	 */
 	readonly changed: CommentThread[];
+
+	/**
+	 * changed draft mode.
+	 */
+	readonly draftMode: DraftMode;
 }
 
 /**

src/vs/workbench/api/node/extHostComments.ts

@@ -180,7 +180,8 @@ export class ExtHostComments implements ExtHostCommentsShape {
 			this._proxy.$onDidCommentThreadsChange(handle, {
 				changed: event.changed.map(thread => convertToCommentThread(provider, thread, this._commandsConverter)),
 				added: event.added.map(thread => convertToCommentThread(provider, thread, this._commandsConverter)),
-				removed: event.removed.map(thread => convertToCommentThread(provider, thread, this._commandsConverter))
+				removed: event.removed.map(thread => convertToCommentThread(provider, thread, this._commandsConverter)),
+				draftMode: !!(provider as vscode.DocumentCommentProvider).startDraft && !!(provider as vscode.DocumentCommentProvider).finishDraft ? (event.inDraftMode ? modes.DraftMode.InDraft : modes.DraftMode.NotInDraft) : modes.DraftMode.NotSupported
 			});
 		});
 	}
@@ -190,7 +191,7 @@ function convertCommentInfo(owner: number, provider: vscode.DocumentCommentProvi
 	return {
 		threads: vscodeCommentInfo.threads.map(x => convertToCommentThread(provider, x, commandsConverter)),
 		commentingRanges: vscodeCommentInfo.commentingRanges ? vscodeCommentInfo.commentingRanges.map(range => extHostTypeConverter.Range.from(range)) : [],
-		draftMode: provider.startDraft ? (vscodeCommentInfo.inDraftMode ? modes.DraftMode.InDraft : modes.DraftMode.NotInDraft) : modes.DraftMode.NotSupported
+		draftMode: provider.startDraft && provider.finishDraft ? (vscodeCommentInfo.inDraftMode ? modes.DraftMode.InDraft : modes.DraftMode.NotInDraft) : modes.DraftMode.NotSupported
 	};
 }
 

src/vs/workbench/parts/comments/electron-browser/commentNode.ts

@@ -46,6 +46,7 @@ export class CommentNode extends Disposable {
 	private _commentEditorModel: ITextModel;
 	private _updateCommentButton: Button;
 	private _errorEditingContainer: HTMLElement;
+	private _isPendingLabel: HTMLElement;
 
 	private _deleteAction: Action;
 	private _onDidDelete = new Emitter<CommentNode>();
@@ -99,9 +100,10 @@ export class CommentNode extends Disposable {
 		const author = dom.append(header, dom.$('strong.author'));
 		author.innerText = this.comment.userName;
 
+		this._isPendingLabel = dom.append(header, dom.$('span.isPending'));
+
 		if (this.comment.isDraft) {
-			const isPendingLabel = dom.append(header, dom.$('span.isPending'));
-			isPendingLabel.innerText = 'Pending';
+			this._isPendingLabel.innerText = 'Pending';
 		}
 
 		const actions: Action[] = [];
@@ -281,6 +283,12 @@ export class CommentNode extends Disposable {
 			this._body.appendChild(this._md);
 		}
 
+		if (newComment.isDraft) {
+			this._isPendingLabel.innerText = 'Pending';
+		} else {
+			this._isPendingLabel.innerText = '';
+		}
+
 		this.comment = newComment;
 	}
 

src/vs/workbench/parts/comments/electron-browser/commentThreadWidget.ts

@@ -71,6 +71,7 @@ export class ReviewZoneWidget extends ZoneWidget {
 	private _globalToDispose: IDisposable[];
 	private _markdownRenderer: MarkdownRenderer;
 	private _styleElement: HTMLStyleElement;
+	private _formActions: HTMLElement;
 	private _error: HTMLElement;
 
 	public get owner(): string {
@@ -105,6 +106,7 @@ export class ReviewZoneWidget extends ZoneWidget {
 		this._isCollapsed = commentThread.collapsibleState !== modes.CommentThreadCollapsibleState.Expanded;
 		this._globalToDispose = [];
 		this._localToDispose = [];
+		this._formActions = null;
 		this.create();
 
 		this._styleElement = dom.createStyleSheet(this.domNode);
@@ -262,6 +264,16 @@ export class ReviewZoneWidget extends ZoneWidget {
 		this.createThreadLabel();
 	}
 
+	updateDraftMode(draftMode: modes.DraftMode) {
+		this._draftMode = draftMode;
+
+		if (this._formActions) {
+			let model = this._commentEditor.getModel();
+			dom.clearNode(this._formActions);
+			this.createCommentWidgetActions(this._formActions, model);
+		}
+	}
+
 	protected _doLayout(heightInPixel: number, widthInPixel: number): void {
 		this._commentEditor.layout({ height: (this._commentEditor.hasWidgetFocus() ? 5 : 1) * 18, width: widthInPixel - 54 /* margin 20px * 10 + scrollbar 14px*/ });
 	}
@@ -332,8 +344,8 @@ export class ReviewZoneWidget extends ZoneWidget {
 
 		this._error = dom.append(this._commentForm, dom.$('.validation-error.hidden'));
 
-		const formActions = dom.append(this._commentForm, dom.$('.form-actions'));
-		this.createCommentWidgetActions(formActions, model);
+		this._formActions = dom.append(this._commentForm, dom.$('.form-actions'));
+		this.createCommentWidgetActions(this._formActions, model);
 
 		this._resizeObserver = new MutationObserver(this._refresh.bind(this));
 
@@ -401,6 +413,8 @@ export class ReviewZoneWidget extends ZoneWidget {
 				submitdraftButton.enabled = true;
 
 				submitdraftButton.onDidClick(async () => {
+					let lineNumber = this._commentGlyph.getPosition().position.lineNumber;
+					await this.createComment(lineNumber);
 					await this.commentService.finishDraft(this._owner);
 				});
 

src/vs/workbench/parts/comments/electron-browser/commentsEditorContribution.ts

@@ -380,11 +380,13 @@ export class ReviewController implements IEditorContribution {
 				return;
 			}
 
-			let draftMode = commentInfo[0].draftMode;
-
 			let added = e.added.filter(thread => thread.resource.toString() === editorURI.toString());
 			let removed = e.removed.filter(thread => thread.resource.toString() === editorURI.toString());
 			let changed = e.changed.filter(thread => thread.resource.toString() === editorURI.toString());
+			let draftMode = e.draftMode;
+
+			commentInfo.forEach(info => info.draftMode = draftMode);
+			this._commentWidgets.filter(ZoneWidget => ZoneWidget.owner === e.owner).forEach(widget => widget.updateDraftMode(draftMode));
 
 			removed.forEach(thread => {
 				let matchedZones = this._commentWidgets.filter(zoneWidget => zoneWidget.owner === e.owner && zoneWidget.commentThread.threadId === thread.threadId);
@@ -408,6 +410,7 @@ export class ReviewController implements IEditorContribution {
 				this._commentWidgets.push(zoneWidget);
 				this._commentInfos.filter(info => info.owner === e.owner)[0].threads.push(thread);
 			});
+
 		}));
 
 		this.beginCompute();