fix(48109) - 'Convert to arrow function' refactoring adds extra indent (#48440)

* fix(48109) - Remove extra indent when converting to arrow function

* fix(48109) - Only treat curly brace in object literal as block

* Apply suggestions from code review

Co-authored-by: Daniel Rosenwasser <[email protected]>

Author: Minh Quy

src/services/formatting/smartIndenter.ts

@@ -56,9 +56,9 @@ namespace ts.formatting {
             // for block indentation, we should look for a line which contains something that's not
             // whitespace.
             const currentToken = getTokenAtPosition(sourceFile, position);
-            // for object literal, we want to the indentation work like block
-            // if { starts in any position (can be in the middle of line)
-            // the following indentation should treat { as starting of that line (including leading whitespace)
+            // For object literals, we want indentation to work just like with blocks.
+            // If the `{` starts in any position (even in the middle of a line), then
+            // the following indentation should treat `{` as the start of that line (including leading whitespace).
             // ```
             //     const a: { x: undefined, y: undefined } = {}       // leading 4 whitespaces and { starts in the middle of line
             // ->
@@ -76,7 +76,8 @@ namespace ts.formatting {
             //          y: undefined,
             //      }
             // ```
-            if (options.indentStyle === IndentStyle.Block || currentToken.kind === SyntaxKind.OpenBraceToken) {
+            const isObjectLiteral = currentToken.kind === SyntaxKind.OpenBraceToken && currentToken.parent.kind === SyntaxKind.ObjectLiteralExpression;
+            if (options.indentStyle === IndentStyle.Block || isObjectLiteral) {
                 return getBlockIndent(sourceFile, position, options);
             }
 
@@ -91,7 +92,9 @@ namespace ts.formatting {
             const containerList = getListByPosition(position, precedingToken.parent, sourceFile);
             // use list position if the preceding token is before any list items
             if (containerList && !rangeContainsRange(containerList, precedingToken)) {
-                return getActualIndentationForListStartLine(containerList, sourceFile, options) + options.indentSize!; // TODO: GH#18217
+                const useTheSameBaseIndentation = [SyntaxKind.FunctionExpression, SyntaxKind.ArrowFunction].indexOf(currentToken.parent.kind) !== -1;
+                const indentSize = useTheSameBaseIndentation ? 0 : options.indentSize!;
+                return getActualIndentationForListStartLine(containerList, sourceFile, options) + indentSize; // TODO: GH#18217
             }
 
             return getSmartIndent(sourceFile, position, precedingToken, lineAtPosition, assumeNewLineBeforeCloseBrace, options);

tests/cases/fourslash/refactorConvertArrowFunctionOrFunctionExpression_ToAnon_FnArgument.ts

@@ -10,6 +10,6 @@ edit.applyRefactor({
     actionDescription: "Convert to anonymous function",
     newContent: `function doSomething(a){}
 doSomething(function() {
-        return 1 + 1;
-    });`,
+    return 1 + 1;
+});`,
 });

tests/cases/fourslash/refactorConvertArrowFunctionOrFunctionExpression_ToArrow_FnArgIndent.ts

@@ -0,0 +1,19 @@
+/// <reference path='fourslash.ts' />
+
+////console.log(function /*a*/()/*b*/ {
+////    console.log(1);
+////    console.log(2);
+////    return 3;
+////})
+
+goTo.select("a", "b");
+edit.applyRefactor({
+    refactorName: "Convert arrow function or function expression",
+    actionName: "Convert to arrow function",
+    actionDescription: "Convert to arrow function",
+    newContent: `console.log(() => {
+    console.log(1);
+    console.log(2);
+    return 3;
+})`,
+});

tests/cases/fourslash/refactorConvertArrowFunctionOrFunctionExpression_ToArrow_FunctionFnArgIndent.ts

@@ -0,0 +1,28 @@
+/// <reference path='fourslash.ts' />
+
+////function foo() {
+////    const a = {
+////        b: builder.create(function /*a*/()/*b*/ {
+////            console.log(1);
+////            console.log(2);
+////            return 3;
+////        })
+////    }
+////}
+
+
+goTo.select("a", "b");
+edit.applyRefactor({
+    refactorName: "Convert arrow function or function expression",
+    actionName: "Convert to arrow function",
+    actionDescription: "Convert to arrow function",
+    newContent: `function foo() {
+    const a = {
+        b: builder.create(() => {
+            console.log(1);
+            console.log(2);
+            return 3;
+        })
+    }
+}`,
+});