diff --git a/apps/webapp/app/components/BlankStatePanels.tsx b/apps/webapp/app/components/BlankStatePanels.tsx
index d2d1a4e88b0..686c01e36e8 100644
--- a/apps/webapp/app/components/BlankStatePanels.tsx
+++ b/apps/webapp/app/components/BlankStatePanels.tsx
@@ -5,11 +5,11 @@ import {
ChatBubbleLeftRightIcon,
PlusIcon,
QuestionMarkCircleIcon,
- SparklesIcon,
Squares2X2Icon,
} from "@heroicons/react/20/solid";
import { AIChatIcon } from "~/assets/icons/AIChatIcon";
import { AIPenIcon } from "~/assets/icons/AIPenIcon";
+import { AISparkleIcon } from "~/assets/icons/AISparkleIcon";
import { BranchEnvironmentIconSmall } from "~/assets/icons/EnvironmentIcons";
import { WaitpointTokenIcon } from "~/assets/icons/WaitpointTokenIcon";
import openBulkActionsPanel from "~/assets/images/open-bulk-actions-panel.png";
@@ -132,8 +132,8 @@ export function HasNoTasksDev({ initializedAt }: { initializedAt: Date | string
{!initialized && (
<>
-
-
+
+
Set it up with your AI agent
@@ -142,7 +142,7 @@ export function HasNoTasksDev({ initializedAt }: { initializedAt: Date | string
includes your project reference.
-
+
@@ -181,7 +181,6 @@ export function HasNoTasksDev({ initializedAt }: { initializedAt: Date | string
stepNumber="2"
title={devConnected ? "Dev server connected" : "Start the dev server"}
complete={devConnected}
- displaySpinner={!devConnected}
/>
{devConnected ? (
diff --git a/apps/webapp/app/components/SetupCommands.tsx b/apps/webapp/app/components/SetupCommands.tsx
index 1e9cda1255e..12c25b49925 100644
--- a/apps/webapp/app/components/SetupCommands.tsx
+++ b/apps/webapp/app/components/SetupCommands.tsx
@@ -1,4 +1,4 @@
-import { CheckIcon, SparklesIcon } from "@heroicons/react/20/solid";
+import { CheckIcon } from "@heroicons/react/20/solid";
import { createContext, useContext, useMemo, useRef, useState } from "react";
import { useAppOrigin } from "~/hooks/useAppOrigin";
import { useProject } from "~/hooks/useProject";
@@ -180,19 +180,25 @@ export function InitAgentPromptV3() {
void navigator.clipboard.writeText(prompt).catch(() => {});
};
+ // The idle label is the longest, so reserve its width to stop the button from
+ // resizing when it briefly swaps to the shorter "Copied prompt".
+ const idleLabel = "Copy AI agent prompt";
+
return (
- {copied ? "Copied prompt" : "Copy AI agent prompt"}
+
}
content="Copies a setup prompt to paste into Claude Code, Cursor, or any coding agent"