[Property Editor] Add UI for triggering "Wrap with" refactors (#9213)

Author: elliette

flutter-candidate.txt

@@ -1 +1 @@
-dd671fae53d37eb15e0f8fc94cd52c2f2ff147ee
+63903561033d7fc2f33b67239f2002d0ee529b48

packages/devtools_app/lib/src/shared/analytics/constants/_property_editor_sidebar_constants.dart

@@ -23,6 +23,10 @@ extension PropertyEditorSidebar on Never {
     required String argType,
   }) => 'applyEditRequest-$argType-$argName';
 
+  /// Analytics event for a "Wrap with" refactor request.
+  static String applyWrapWithRefactorRequest({required String refactorName}) =>
+      'wrapWithRefactor-$refactorName';
+
   /// Analytics event on completion of an edit.
   static String applyEditComplete({
     required String argName,

packages/devtools_app/lib/src/shared/ui/common_widgets.dart

@@ -612,12 +612,14 @@ class ToolbarAction extends StatelessWidget {
     super.key,
     this.size,
     this.style,
+    this.buttonStyle,
     this.color,
     this.gaScreen,
     this.gaSelection,
   }) : assert((gaScreen == null) == (gaSelection == null));
 
   final TextStyle? style;
+  final ButtonStyle? buttonStyle;
   final IconData icon;
   final Color? color;
   final String? tooltip;
@@ -632,6 +634,7 @@ class ToolbarAction extends StatelessWidget {
       onPressed: onPressed,
       tooltip: tooltip,
       style: style,
+      buttonStyle: buttonStyle,
       gaScreen: gaScreen,
       gaSelection: gaSelection,
       child: Icon(
@@ -650,11 +653,13 @@ class SmallAction extends StatelessWidget {
     this.tooltip,
     super.key,
     this.style,
+    this.buttonStyle,
     this.gaScreen,
     this.gaSelection,
   }) : assert((gaScreen == null) == (gaSelection == null));
 
   final TextStyle? style;
+  final ButtonStyle? buttonStyle;
   final Widget child;
   final String? tooltip;
   final VoidCallback? onPressed;
@@ -664,11 +669,13 @@ class SmallAction extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final button = TextButton(
-      style: TextButton.styleFrom(
-        padding: EdgeInsets.zero,
-        tapTargetSize: MaterialTapTargetSize.shrinkWrap,
-        textStyle: style,
-      ),
+      style:
+          buttonStyle ??
+          TextButton.styleFrom(
+            padding: EdgeInsets.zero,
+            tapTargetSize: MaterialTapTargetSize.shrinkWrap,
+            textStyle: style,
+          ),
       onPressed: () {
         if (gaScreen != null && gaSelection != null) {
           ga.select(gaScreen!, gaSelection!);
@@ -2126,6 +2133,7 @@ class ContextMenuButton extends StatelessWidget {
     this.gaItem,
     this.buttonWidth = defaultWidth,
     this.icon = Icons.more_vert,
+    this.style,
     double? iconSize,
   }) : iconSize = iconSize ?? tableIconSize;
 
@@ -2138,6 +2146,7 @@ class ContextMenuButton extends StatelessWidget {
   final List<Widget> menuChildren;
   final IconData icon;
   final double iconSize;
+  final ButtonStyle? style;
   final double buttonWidth;
 
   @override
@@ -2152,6 +2161,7 @@ class ContextMenuButton extends StatelessWidget {
                 icon: icon,
                 size: iconSize,
                 color: color,
+                buttonStyle: style,
                 onPressed: () {
                   if (gaScreen != null && gaItem != null) {
                     ga.select(gaScreen!, gaItem!);

packages/devtools_app/lib/src/standalone_ui/ide_shared/property_editor/property_editor_controller.dart

@@ -171,6 +171,17 @@ class PropertyEditorController extends DisposableController
     );
   }
 
+  Future<GenericApiResponse?> executeCommand({
+    required String commandName,
+    required List<Object?> commandArgs,
+  }) {
+    return editorClient.executeCommand(
+      commandName: commandName,
+      commandArgs: commandArgs,
+      screenId: gac.PropertyEditorSidebar.id,
+    );
+  }
+
   int hashProperty(EditableProperty property) {
     final widgetData = editableWidgetData.value;
     if (widgetData == null) {
@@ -212,14 +223,18 @@ class PropertyEditorController extends DisposableController
     CodeActionResult? refactorsResult;
     // TODO(https://github.com/flutter/devtools/issues/8652): Enable refactors
     // in the Property Editor by default.
-    if (FeatureFlags.propertyEditorRefactors) {
-      // Get any supported refactors for the current position.
+    if (editableArgsResult != null && FeatureFlags.propertyEditorRefactors) {
+      // Fetch the refactors using the start of the editable arguments' range,
+      // which corresponds to the widget constructor name. This ensures that the
+      // refactors are always available, even when the cursor is within the
+      // parameter list. See https://github.com/flutter/devtools/issues/9221.
+      final position = editableArgsResult.range?.start ?? cursorPosition;
       // TODO(elliette): Consider updating the widget data immediately without
       // waiting for the refactors result, then updating the refactor buttons
       // once the refactors result is available.
       refactorsResult = await editorClient.getRefactors(
         textDocument: textDocument,
-        range: EditorRange(start: cursorPosition, end: cursorPosition),
+        range: EditorRange(start: position, end: position),
         screenId: gac.PropertyEditorSidebar.id,
       );
     }
@@ -275,6 +290,7 @@ class PropertyEditorController extends DisposableController
     TextDocument? document,
     CursorPosition? cursorPosition,
     EditorRange? range,
+    List<CodeActionCommand>? refactors,
   }) {
     setActiveFilter();
     if (editableArgsResult != null) {
@@ -283,9 +299,7 @@ class PropertyEditorController extends DisposableController
             .map(argToProperty)
             .nonNulls
             .toList(),
-        // TODO(https://github.com/flutter/devtools/issues/8652): Add tests for
-        // refactors.
-        refactors: [],
+        refactors: refactors ?? [],
         name: editableArgsResult.name,
         documentation: editableArgsResult.documentation,
         fileUri: document?.uriAsString,