fix(web): move home quick-action pills back under the greeting

After unifying the home onto the shared workspace shell, the composer became an
in-flow element pinned at the bottom — and HomeQuickActions lives inside the
composer, so the pills dropped down there too (owner flagged: they belong under
'cheatcode ready to build').

HomeContentPane now exposes a quickActionsSlot (a div after HomeHeadline, captured
by callback ref) threaded through HomeComposerFromSearchParams to HomeComposer,
which renders <HomeQuickActions/> into it via createPortal. The pills stay in the
composer's React subtree — so intentId, the active-pill highlight, and every click
side effect (placeholder/surface/skill/repo/project + textarea focus) are unchanged;
only the DOM position moved. Verified live: pills sit 29px under the greeting, and
clicking 'Mobile app' still switches the composer placeholder. Composer stays pinned
at the bottom so the computer-open layout still matches the chat. Gate green (15/15).

Author: iamjr15

apps/web/src/components/home/home-composer-from-search-params.tsx

@@ -15,7 +15,11 @@ type InitialComposerParams = {
   tool?: IntegrationName | undefined;
 };
 
-export function HomeComposerFromSearchParams() {
+export function HomeComposerFromSearchParams({
+  quickActionsSlot,
+}: {
+  quickActionsSlot?: HTMLElement | null | undefined;
+}) {
   const [params, setParams] = useState<InitialComposerParams | null>(null);
 
   useEffect(() => {
@@ -30,7 +34,7 @@ export function HomeComposerFromSearchParams() {
   }, []);
 
   if (!params) {
-    return <HomeComposer />;
+    return <HomeComposer quickActionsSlot={quickActionsSlot} />;
   }
 
   return (
@@ -40,6 +44,7 @@ export function HomeComposerFromSearchParams() {
       initialSkill={params.skill}
       initialTool={params.tool}
       key={`${params.promptKey ?? ""}:${params.skill ?? ""}:${params.tool ?? ""}:${params.skillCreator ? "sc" : ""}`}
+      quickActionsSlot={quickActionsSlot}
       skillCreator={params.skillCreator}
     />
   );

apps/web/src/components/home/home-composer.tsx

@@ -21,6 +21,7 @@ import {
   useRef,
   useState,
 } from "react";
+import { createPortal } from "react-dom";
 import { toast } from "sonner";
 import { AuthModal } from "@/components/auth/auth-modal";
 import { UpgradeDialog } from "@/components/billing/upgrade-dialog";
@@ -161,12 +162,14 @@ export function HomeComposer({
   initialPromptKey,
   initialSkill,
   initialTool,
+  quickActionsSlot,
   skillCreator = false,
 }: {
   initialPrompt?: string | undefined;
   initialPromptKey?: string | undefined;
   initialSkill?: string | undefined;
   initialTool?: IntegrationName | undefined;
+  quickActionsSlot?: HTMLElement | null | undefined;
   skillCreator?: boolean | undefined;
 }) {
   const initial = useMemo(() => resolveInitialSkill(initialSkill ?? null), [initialSkill]);
@@ -384,7 +387,15 @@ export function HomeComposer({
 
   return (
     <div className="mt-6 w-full">
-      <HomeQuickActions activeIntentId={intentId} onIntentClick={selectQuickIntent} />
+      {/* The pills live in the greeting cluster (above), but their intent state is
+          owned here — a portal keeps them in this React subtree so `intentId` /
+          `selectQuickIntent` stay wired while rendering into the greeting slot. */}
+      {quickActionsSlot
+        ? createPortal(
+            <HomeQuickActions activeIntentId={intentId} onIntentClick={selectQuickIntent} />,
+            quickActionsSlot,
+          )
+        : null}
       {skillCreatorMode ? <SkillCreatorSuggestions onPick={(text) => setValue(text)} /> : null}
       <form className="mt-8 w-full" onSubmit={submit}>
         <div className="relative z-10 mx-auto flex w-full max-w-[708px] flex-col gap-0">

apps/web/src/components/home/home-workspace.tsx

@@ -61,6 +61,14 @@ export function HomeWorkspace() {
 }
 
 function HomeContentPane() {
+  // The quick-action pills belong in the greeting cluster (below the headline),
+  // but their intent state is owned by the composer at the bottom of the pane and
+  // is entangled with the composer's skill/repo/project state, textarea focus, and
+  // search-param seeding. The composer portals the pills into this slot so they
+  // render in the greeting cluster while staying in the composer's React tree —
+  // the intent wiring flows through the React tree, not the DOM, so it is
+  // unchanged. See `HomeComposer`.
+  const [quickActionsSlot, setQuickActionsSlot] = useState<HTMLElement | null>(null);
   return (
     <div className="relative flex min-h-0 flex-1 flex-col bg-white">
       <div className="chat-scrollbar flex min-h-0 flex-1 flex-col items-center justify-center overflow-y-auto px-6 py-10">
@@ -70,10 +78,11 @@ function HomeContentPane() {
             <HomeGreeting />
           </Suspense>
           <HomeHeadline />
+          <div className="mt-6 w-full" ref={setQuickActionsSlot} />
         </div>
       </div>
       <div className="shrink-0 px-6 pb-8">
-        <HomeComposerFromSearchParams />
+        <HomeComposerFromSearchParams quickActionsSlot={quickActionsSlot} />
       </div>
     </div>
   );