Fix small comment input when starting collapsed + editable (#198431)

Fixes #197793

Author: alexr00

src/vs/workbench/contrib/comments/browser/commentNode.ts

@@ -573,8 +573,9 @@ export class CommentNode<T extends IRange | ICellRange> extends Disposable {
 		this._commentEditContainer!.remove();
 	}
 
-	layout() {
-		this._commentEditor?.layout({ width: this._commentEditor.getLayoutInfo().width, height: this._editorHeight });
+	layout(widthInPixel?: number) {
+		const editorWidth = widthInPixel !== undefined ? widthInPixel - 72 /* - margin and scrollbar*/ : (this._commentEditor?.getLayoutInfo().width ?? 0);
+		this._commentEditor?.layout({ width: editorWidth, height: this._editorHeight });
 		const scrollWidth = this._body.scrollWidth;
 		const width = dom.getContentWidth(this._body);
 		const scrollHeight = this._body.scrollHeight;

src/vs/workbench/contrib/comments/browser/commentThreadBody.ts

@@ -122,9 +122,9 @@ export class CommentThreadBody<T extends IRange | ICellRange = IRange> extends D
 		return dom.getClientArea(this.container);
 	}
 
-	layout() {
+	layout(widthInPixel?: number) {
 		this._commentElements.forEach(element => {
-			element.layout();
+			element.layout(widthInPixel);
 		});
 	}
 

src/vs/workbench/contrib/comments/browser/commentThreadWidget.ts

@@ -342,7 +342,7 @@ export class CommentThreadWidget<T extends IRange | ICellRange = IRange> extends
 	}
 
 	layout(widthInPixel?: number) {
-		this._body.layout();
+		this._body.layout(widthInPixel);
 
 		if (widthInPixel !== undefined) {
 			this._commentReply?.layout(widthInPixel);