Merge branch 'feat/dashboard-agent-flows' into feat/dashboard-agent-watch

Author: kathiekiwi

apps/webapp/app/components/dashboard-agent/DashboardAgentHero.tsx

@@ -1,6 +1,6 @@
-import { SparklesIcon } from "@heroicons/react/20/solid";
 import type { AgentPageContext, SuggestedPrompt } from "@internal/dashboard-agent-contracts";
 import { BetaBadge } from "~/components/FeatureBadges";
+import { AgentDotMatrix } from "~/components/primitives/AgentDotMatrix";
 import { Header1 } from "~/components/primitives/Headers";
 import { Paragraph } from "~/components/primitives/Paragraph";
 import { DashboardAgentSuggestedPrompts } from "./DashboardAgentSuggestedPrompts";
@@ -39,8 +39,8 @@ export function DashboardAgentHero({
       <div className="flex w-full max-w-2xl flex-col items-center gap-5">
         <div className="flex flex-col items-center gap-1.5 text-center">
           <Header1 className="flex items-center gap-2">
-            <SparklesIcon className="size-6 text-indigo-500" />
-            Ask Trigger
+            <AgentDotMatrix size={22} palette="mono" restColor="#ffffff" decorative />
+            Ask AI
             <BetaBadge />
           </Header1>
           <Paragraph variant="small" className="text-text-dimmed">

apps/webapp/app/components/dashboard-agent/dashboardAgentLauncher.tsx

@@ -1,10 +1,9 @@
-import { ChatBubbleLeftRightIcon } from "@heroicons/react/20/solid";
 import type { WatchSpec } from "@internal/dashboard-agent-contracts";
 import { createContext, useContext } from "react";
+import { Button } from "~/components/primitives/Buttons";
 import { ShortcutKey } from "~/components/primitives/ShortcutKey";
 import { SimpleTooltip } from "~/components/primitives/Tooltip";
 import type { Shortcut } from "~/hooks/useShortcutKeys";
-import { cn } from "~/utils/cn";
 
 /**
  * Opens and closes the panel. Registered once, by `DashboardAgent`; the launcher
@@ -78,24 +77,21 @@ export function DashboardAgentLauncher() {
         </span>
       }
       button={
-        <button
-          type="button"
-          aria-label={hasUnread ? "Ask Trigger, unread updates" : "Ask Trigger"}
-          onClick={() => setOpen(true)}
-          className={cn(
-            "relative flex shrink-0 items-center gap-1.5 rounded-full border px-2.5 py-1 text-xs text-text-bright transition",
-            "border-border-bright bg-background-bright hover:border-border-brighter"
-          )}
-        >
-          <ChatBubbleLeftRightIcon className="size-3.5 text-indigo-500" />
-          Ask Trigger
+        <span className="relative inline-flex shrink-0">
+          <Button
+            variant="ask-ai/small"
+            aria-label={hasUnread ? "Ask AI, unread updates" : "Ask AI"}
+            onClick={() => setOpen(true)}
+          >
+            Ask AI
+          </Button>
           {hasUnread && (
             <span
               // Ringed so the dot reads on the header background as well as the button.
               className="absolute -right-0.5 -top-0.5 size-2 rounded-full bg-indigo-500 ring-2 ring-background-dimmed"
             />
           )}
-        </button>
+        </span>
       }
     />
   );