🤖 feat: promote plan primary actions (#2055)

Summary
- Right-align the plan's primary next-step actions (Implement +
Orchestrator) as prominent icon+text buttons.
- Keep utility actions (Copy/Share/Start Here/Show Text/etc.) as the
existing left-side icon buttons.

Validation
- make lint
- make typecheck

---

_Generated with `mux` • Model: `openai:gpt-5.2` • Thinking: `xhigh` •
Cost: `$0.45`_

<!-- mux-attribution: model=openai:gpt-5.2 thinking=xhigh costs=0.45 -->

Author: ibetitsmike

src/browser/components/tools/ProposePlanToolCall.tsx

@@ -16,6 +16,7 @@ import {
 import { useToolExpansion, getStatusDisplay, type ToolStatus } from "./shared/toolUtils";
 import { MarkdownRenderer } from "../Messages/MarkdownRenderer";
 import { Button } from "../ui/button";
+import { Tooltip, TooltipTrigger, TooltipContent } from "../ui/tooltip";
 import { IconActionButton, type ButtonConfig } from "../Messages/MessageWindow";
 import { formatKeybind, KEYBINDS } from "@/browser/utils/ui/keybinds";
 import { useStartHere } from "@/browser/hooks/useStartHere";
@@ -508,37 +509,43 @@ export const ProposePlanToolCall: React.FC<ProposePlanToolCallProps> = (props) =
       }
     : null;
 
-  // Start Here button: only for tool calls, not ephemeral previews
-  if (!isEphemeralPreview && workspaceId) {
-    actionButtons.push({
-      label: buttonLabel,
-      onClick: openModal,
-      disabled: startHereDisabled,
-      icon: <ListStart />,
-      tooltip: "Replace all chat history with this plan",
-    });
+  const shouldShowPrimaryActions = Boolean(
+    status === "completed" && !errorMessage && isLatest && !isEphemeralPreview && workspaceId
+  );
 
-    if (status === "completed" && !errorMessage && isLatest) {
-      actionButtons.push({
+  const implementButton: ButtonConfig | null = shouldShowPrimaryActions
+    ? {
         label: "Implement",
         onClick: () => void handleImplement(),
         disabled: !api || isImplementing || isStartingOrchestrator,
-        icon: <Play />,
+        icon: <Play className="size-4" />,
         tooltip: implementReplacesChatHistory
           ? "Replace chat history with this plan, switch to Exec, and start implementing"
           : "Switch to Exec and start implementing",
-      });
+      }
+    : null;
 
-      actionButtons.push({
+  const orchestratorButton: ButtonConfig | null = shouldShowPrimaryActions
+    ? {
         label: "Start Orchestrator",
         onClick: () => void handleStartOrchestrator(),
         disabled: !api || isStartingOrchestrator || isImplementing,
-        icon: <Workflow />,
+        icon: <Workflow className="size-4" />,
         tooltip: implementReplacesChatHistory
           ? "Replace chat history with this plan, switch to Orchestrator, and start delegating"
           : "Switch to Orchestrator and start delegating",
-      });
-    }
+      }
+    : null;
+
+  // Start Here button: only for tool calls, not ephemeral previews
+  if (!isEphemeralPreview && workspaceId) {
+    actionButtons.push({
+      label: buttonLabel,
+      onClick: openModal,
+      disabled: startHereDisabled,
+      icon: <ListStart />,
+      tooltip: "Replace all chat history with this plan",
+    });
   }
 
   // Show raw toggle
@@ -609,13 +616,61 @@ export const ProposePlanToolCall: React.FC<ProposePlanToolCallProps> = (props) =
 
       {/* Actions row at the bottom (matching MessageWindow style) */}
       <div className="mt-3 flex items-center gap-0.5">
-        {actionButtons.map((button, index) => (
-          <IconActionButton key={index} button={button} />
-        ))}
-        {/* Edit button rendered with ref for error popover positioning */}
-        {editButton && (
-          <div ref={editButtonRef}>
-            <IconActionButton button={editButton} />
+        <div className="flex min-w-0 flex-1 items-center gap-0.5">
+          {actionButtons.map((button, index) => (
+            <IconActionButton key={index} button={button} />
+          ))}
+          {/* Edit button rendered with ref for error popover positioning */}
+          {editButton && (
+            <div ref={editButtonRef}>
+              <IconActionButton button={editButton} />
+            </div>
+          )}
+        </div>
+
+        {(implementButton ?? orchestratorButton) && (
+          <div className="ml-auto flex items-center gap-1">
+            {implementButton && (
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <Button
+                    type="button"
+                    variant="outline"
+                    size="sm"
+                    className="h-7 gap-1"
+                    onClick={implementButton.onClick}
+                    disabled={implementButton.disabled}
+                  >
+                    {implementButton.icon}
+                    <span className="leading-none">{implementButton.label}</span>
+                  </Button>
+                </TooltipTrigger>
+                <TooltipContent align="center">
+                  {implementButton.tooltip ?? implementButton.label}
+                </TooltipContent>
+              </Tooltip>
+            )}
+
+            {orchestratorButton && (
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <Button
+                    type="button"
+                    variant="outline"
+                    size="sm"
+                    className="h-7 gap-1"
+                    onClick={orchestratorButton.onClick}
+                    disabled={orchestratorButton.disabled}
+                  >
+                    {orchestratorButton.icon}
+                    <span className="leading-none">{orchestratorButton.label}</span>
+                  </Button>
+                </TooltipTrigger>
+                <TooltipContent align="center">
+                  {orchestratorButton.tooltip ?? orchestratorButton.label}
+                </TooltipContent>
+              </Tooltip>
+            )}
           </div>
         )}
       </div>