@swarmclawai/swarmclaw 1.7.0 → 1.7.1

package/src/components/auth/setup-wizard/step-providers.tsx

@@ -3,89 +3,10 @@
 import { useState } from 'react'
 import { api } from '@/lib/app/api-client'
 import { errorMessage } from '@/lib/shared-utils'
+import { SETUP_PROVIDERS } from '@/lib/setup-defaults'
 import type { StepProvidersProps, SetupDoctorResponse } from './types'
-import { getSetupProviderGroups } from './utils'
 import { StepShell, ConfiguredProviderChips } from './shared'
 
-function ReadinessPanel({
-  state,
-  report,
-  error,
-  onRun,
-}: {
-  state: 'idle' | 'checking' | 'done' | 'error'
-  report: SetupDoctorResponse | null
-  error: string
-  onRun: () => void
-}) {
-  const problemChecks = report?.checks.filter((check) => check.status !== 'pass') || []
-  const statusLabel = state === 'done'
-    ? report?.ok
-      ? 'Ready'
-      : `${problemChecks.length} item${problemChecks.length === 1 ? '' : 's'} to review`
-    : state === 'error'
-      ? 'Check failed'
-      : 'Optional check'
-
-  return (
-    <div className="mb-6 rounded-[16px] border border-white/[0.08] bg-white/[0.025] p-4 text-left">
-      <div className="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between">
-        <div>
-          <div className="text-[12px] font-display font-700 text-text">Setup readiness</div>
-          <p className="mt-1 text-[12px] leading-relaxed text-text-3/70">
-            Check Node, npm, local storage, secrets, and starter workspace state before connecting a provider.
-          </p>
-        </div>
-        <button
-          type="button"
-          onClick={onRun}
-          disabled={state === 'checking'}
-          className="shrink-0 rounded-[10px] border border-white/[0.08] bg-white/[0.04] px-3 py-2 text-[12px] font-display font-700 text-text-2 transition-colors hover:bg-white/[0.08] disabled:opacity-40"
-        >
-          {state === 'checking' ? 'Checking...' : 'Run Check'}
-        </button>
-      </div>
-
-      <div className="mt-3 flex flex-wrap items-center gap-2">
-        <span className={`rounded-full px-2.5 py-1 text-[11px] font-700 ${
-          state === 'done' && report?.ok
-            ? 'bg-emerald-500/10 text-emerald-300'
-            : state === 'done' || state === 'error'
-              ? 'bg-amber-500/10 text-amber-300'
-              : 'bg-white/[0.05] text-text-3'
-        }`}>
-          {statusLabel}
-        </span>
-        {report && (
-          <span className="text-[11px] text-text-3/65">
-            {report.summary}
-          </span>
-        )}
-        {state === 'error' && error && (
-          <span className="text-[11px] text-rose-300">{error}</span>
-        )}
-      </div>
-
-      {problemChecks.length > 0 && (
-        <div className="mt-3 grid gap-2 sm:grid-cols-2">
-          {problemChecks.slice(0, 4).map((check) => (
-            <div key={check.id} className="rounded-[10px] border border-white/[0.06] bg-white/[0.025] px-3 py-2">
-              <div className="text-[11px] font-700 text-text-2">{check.label}</div>
-              <div className="mt-0.5 text-[11px] leading-relaxed text-text-3/70">{check.detail}</div>
-            </div>
-          ))}
-        </div>
-      )}
-
-      {!!report?.actions?.length && (
-        <div className="mt-3 text-[11px] leading-relaxed text-text-3/70">
-          Next: {report.actions.slice(0, 2).join(' ')}
-        </div>
-      )}
-    </div>
-  )
-}
-
 export function StepProviders({
   configuredProviders,
   configuredProviderIds,
@@ -100,7 +21,6 @@ export function StepProviders({
   const [doctorState, setDoctorState] = useState<'idle' | 'checking' | 'done' | 'error'>('idle')
   const [doctorError, setDoctorError] = useState('')
   const [doctorReport, setDoctorReport] = useState<SetupDoctorResponse | null>(null)
-  const providerGroups = getSetupProviderGroups()
 
   const runSetupDoctor = async () => {
     setDoctorState('checking')
@@ -130,70 +50,84 @@ export function StepProviders({
 
       <ConfiguredProviderChips providers={configuredProviders} onRemove={onRemoveProvider} />
 
-      <ReadinessPanel
-        state={doctorState}
-        report={doctorReport}
-        error={doctorError}
-        onRun={runSetupDoctor}
-      />
+      <div className="flex flex-col gap-3 max-h-[42vh] overflow-y-auto pr-1">
+        {SETUP_PROVIDERS.map((candidate) => {
+          const isConfigured = configuredProviderIds.has(candidate.id)
+          return (
+            <button
+              key={candidate.id}
+              onClick={() => onSelectProvider(candidate.id)}
+              className={`w-full px-5 py-4 rounded-[14px] border bg-surface text-left
+                transition-all duration-200 flex items-start gap-4 cursor-pointer
+                ${isConfigured
+                  ? 'border-emerald-500/25 hover:border-emerald-500/40 hover:bg-surface-hover'
+                  : 'border-white/[0.08] hover:border-accent-bright/30 hover:bg-surface-hover'
+                }`}
+            >
+              <div className={`w-10 h-10 rounded-[10px] border flex items-center justify-center shrink-0 mt-0.5 ${
+                isConfigured ? 'bg-emerald-500/10 border-emerald-500/20' : 'bg-white/[0.04] border-white/[0.06]'
+              }`}>
+                <span className={`text-[16px] font-display font-700 ${isConfigured ? 'text-emerald-400' : 'text-accent-bright'}`}>
+                  {candidate.icon}
+                </span>
+              </div>
+              <div className="flex-1">
+                <div className="text-[15px] font-display font-600 text-text mb-1">
+                  {candidate.name}
+                  {isConfigured ? (
+                    <span className="ml-2 inline-flex items-center gap-1 px-2 py-0.5 rounded-md bg-emerald-500/10 text-emerald-300 text-[10px] uppercase tracking-[0.08em] font-600">
+                      Connected · Edit
+                    </span>
+                  ) : candidate.badge ? (
+                    <span className="ml-2 inline-flex items-center gap-1 px-2 py-0.5 rounded-md bg-accent-bright/15 text-accent-bright text-[10px] uppercase tracking-[0.08em] font-600">
+                      {candidate.badge}
+                    </span>
+                  ) : null}
+                </div>
+                <div className="text-[13px] text-text-3 leading-relaxed">{candidate.description}</div>
+                {!candidate.requiresKey && !isConfigured && (
+                  <div className="mt-1.5 inline-flex items-center gap-1.5 px-2 py-0.5 rounded-md bg-emerald-500/10 text-emerald-400 text-[11px] font-500">
+                    <span className="w-1.5 h-1.5 rounded-full bg-emerald-400" />
+                    No API key required
+                  </div>
+                )}
+              </div>
+            </button>
+          )
+        })}
+      </div>
+
+      <div className="mt-4 text-left">
+        <button
+          onClick={runSetupDoctor}
+          disabled={doctorState === 'checking'}
+          className="w-full px-4 py-3 rounded-[12px] border border-white/[0.08] bg-white/[0.02] text-[13px] text-text-2
+            cursor-pointer hover:bg-white/[0.05] transition-all duration-200 disabled:opacity-40"
+        >
+          {doctorState === 'checking' ? 'Running System Check...' : 'Run System Check'}
+        </button>
 
-      <div className="max-h-[46vh] overflow-y-auto pr-1 text-left">
-        <div className="flex flex-col gap-5">
-          {providerGroups.map((group) => (
-            <section key={group.id}>
-              <div className="mb-2 px-1">
-                <div className="text-[12px] font-display font-700 text-text">{group.title}</div>
-                <p className="mt-0.5 text-[11px] leading-relaxed text-text-3/65">{group.description}</p>
+        {doctorState === 'error' && doctorError && (
+          <p className="mt-2 text-[12px] text-red-300">{doctorError}</p>
+        )}
+
+        {doctorReport && doctorState === 'done' && (
+          <div className="mt-3 p-3 rounded-[12px] border border-white/[0.08] bg-surface">
+            <div className={`text-[12px] font-600 ${doctorReport.ok ? 'text-emerald-300' : 'text-amber-300'}`}>
+              {doctorReport.summary}
+            </div>
+            {doctorReport.checks.filter((check) => check.status !== 'pass').slice(0, 3).map((check) => (
+              <div key={check.id} className="mt-1 text-[11px] text-text-3">
+                - {check.label}: {check.detail}
               </div>
-              <div className="flex flex-col gap-3">
-                {group.providers.map((candidate) => {
-                  const isConfigured = configuredProviderIds.has(candidate.id)
-                  return (
-                    <button
-                      key={candidate.id}
-                      onClick={() => onSelectProvider(candidate.id)}
-                      className={`w-full px-5 py-4 rounded-[14px] border bg-surface text-left
-                        transition-all duration-200 flex items-start gap-4 cursor-pointer
-                        ${isConfigured
-                          ? 'border-emerald-500/25 hover:border-emerald-500/40 hover:bg-surface-hover'
-                          : 'border-white/[0.08] hover:border-accent-bright/30 hover:bg-surface-hover'
-                        }`}
-                    >
-                      <div className={`w-10 h-10 rounded-[10px] border flex items-center justify-center shrink-0 mt-0.5 ${
-                        isConfigured ? 'bg-emerald-500/10 border-emerald-500/20' : 'bg-white/[0.04] border-white/[0.06]'
-                      }`}>
-                        <span className={`text-[16px] font-display font-700 ${isConfigured ? 'text-emerald-400' : 'text-accent-bright'}`}>
-                          {candidate.icon}
-                        </span>
-                      </div>
-                      <div className="flex-1">
-                        <div className="text-[15px] font-display font-600 text-text mb-1">
-                          {candidate.name}
-                          {isConfigured ? (
-                            <span className="ml-2 inline-flex items-center gap-1 px-2 py-0.5 rounded-md bg-emerald-500/10 text-emerald-300 text-[10px] uppercase tracking-[0.08em] font-600">
-                              Connected · Edit
-                            </span>
-                          ) : candidate.badge ? (
-                            <span className="ml-2 inline-flex items-center gap-1 px-2 py-0.5 rounded-md bg-accent-bright/15 text-accent-bright text-[10px] uppercase tracking-[0.08em] font-600">
-                              {candidate.badge}
-                            </span>
-                          ) : null}
-                        </div>
-                        <div className="text-[13px] text-text-3 leading-relaxed">{candidate.description}</div>
-                        {!candidate.requiresKey && !isConfigured && (
-                          <div className="mt-1.5 inline-flex items-center gap-1.5 px-2 py-0.5 rounded-md bg-emerald-500/10 text-emerald-400 text-[11px] font-500">
-                            <span className="w-1.5 h-1.5 rounded-full bg-emerald-400" />
-                            No API key required
-                          </div>
-                        )}
-                      </div>
-                    </button>
-                  )
-                })}
+            ))}
+            {!!doctorReport.actions?.length && (
+              <div className="mt-2 text-[11px] text-text-3/80">
+                Next: {doctorReport.actions.slice(0, 2).join(' ')}
               </div>
-            </section>
-          ))}
-        </div>
+            )}
+          </div>
+        )}
       </div>
 
       {error && <p className="mt-4 text-[13px] text-red-400">{error}</p>}

package/src/components/auth/setup-wizard/types.ts

@@ -1,6 +1,5 @@
 import type { GatewayProfile, ProviderId } from '@/types'
 import type { SetupProvider } from '@/lib/setup-defaults'
-import type { LaunchPathAction, LaunchPathId } from '@/lib/home-launchpad'
 
 export type SetupStep = 'profile' | 'path' | 'providers' | 'connect' | 'agents' | 'next' | 'done'
 export type CheckState = 'idle' | 'checking' | 'ok' | 'error'
@@ -163,7 +162,11 @@ export interface StepAgentsProps {
 export interface StepNextProps {
   createdAgents: CreatedAgentSummary[]
   onContinueToDashboard: () => void
-  onLaunchPathAction: (id: LaunchPathId, action: LaunchPathAction) => void
+  onOpenFirstAgent: () => void
+  onOpenProtocols: () => void
+  onOpenBuilder: () => void
+  onOpenConnectors: () => void
+  onOpenUsage: () => void
 }
 
 export interface StepDoneProps {

package/src/components/auth/setup-wizard/utils.test.ts

@@ -8,7 +8,6 @@ import {
   isLocalOpenClawEndpoint,
   resolveOpenClawDashboardUrl,
   getOpenClawErrorHint,
-  getSetupProviderGroups,
   requiresSetupProviderVerification,
   withHttpScheme,
   buildStarterDrafts,
@@ -77,24 +76,6 @@ test('getStarterKitsForPath: manual keeps the full catalog', () => {
   assert.equal(ids.has('openclaw_fleet'), true)
 })
 
-test('getSetupProviderGroups puts fast local and no-key providers first', () => {
-  const groups = getSetupProviderGroups()
-  assert.deepEqual(groups.map((group) => group.id), ['fast-local', 'recommended-api', 'advanced-catalog'])
-  assert.equal(groups[0]?.providers[0]?.id, 'claude-cli')
-  assert.equal(groups[0]?.providers.some((provider) => provider.id === 'openclaw'), true)
-  assert.equal(groups[0]?.providers.some((provider) => provider.id === 'ollama'), true)
-})
-
-test('getSetupProviderGroups separates recommended APIs from advanced catalogs', () => {
-  const groups = getSetupProviderGroups()
-  const recommendedIds = new Set(groups.find((group) => group.id === 'recommended-api')?.providers.map((provider) => provider.id))
-  const advancedIds = new Set(groups.find((group) => group.id === 'advanced-catalog')?.providers.map((provider) => provider.id))
-  assert.equal(recommendedIds.has('openai'), true)
-  assert.equal(recommendedIds.has('openrouter'), true)
-  assert.equal(advancedIds.has('custom'), true)
-  assert.equal(advancedIds.has('deepseek'), true)
-})
-
 // ---------------------------------------------------------------------------
 // formatEndpointHost
 // ---------------------------------------------------------------------------

package/src/components/auth/setup-wizard/utils.ts

@@ -1,47 +1,14 @@
 import {
-  SETUP_PROVIDERS,
   STARTER_KITS,
   getDefaultModelForProvider,
   type OnboardingPath,
   type StarterKit,
-  type SetupProviderOption,
   type SetupProvider,
   type StarterKitAgentTemplate,
 } from '@/lib/setup-defaults'
 import type { ConfiguredProvider, SetupStep, StarterDraftAgent } from './types'
 import { STEP_ORDER } from './types'
 
-export type SetupProviderGroupId = 'fast-local' | 'recommended-api' | 'advanced-catalog'
-
-export interface SetupProviderGroup {
-  id: SetupProviderGroupId
-  title: string
-  description: string
-  providers: SetupProviderOption[]
-}
-
-const FAST_LOCAL_PROVIDER_IDS = new Set<SetupProvider>([
-  'claude-cli',
-  'codex-cli',
-  'opencode-cli',
-  'gemini-cli',
-  'copilot-cli',
-  'droid-cli',
-  'cursor-cli',
-  'qwen-code-cli',
-  'goose',
-  'ollama',
-  'openclaw',
-  'hermes',
-])
-
-const RECOMMENDED_API_PROVIDER_IDS = new Set<SetupProvider>([
-  'openai',
-  'openrouter',
-  'anthropic',
-  'google',
-])
-
 export function stepIndex(step: SetupStep): number {
   if (step === 'connect') return STEP_ORDER.indexOf('providers')
   return STEP_ORDER.indexOf(step)
@@ -71,42 +38,6 @@ export function getStarterKitsForPath(path: OnboardingPath): StarterKit[] {
   return STARTER_KITS
 }
 
-export function getSetupProviderGroups(providers: SetupProviderOption[] = SETUP_PROVIDERS): SetupProviderGroup[] {
-  const groups: SetupProviderGroup[] = [
-    {
-      id: 'fast-local',
-      title: 'Fast local and no-key starts',
-      description: 'Use an installed CLI, a local runtime, or an existing OpenClaw/Hermes gateway.',
-      providers: [],
-    },
-    {
-      id: 'recommended-api',
-      title: 'Recommended API providers',
-      description: 'Good first choices for cloud-backed chats, agents, and workflow runs.',
-      providers: [],
-    },
-    {
-      id: 'advanced-catalog',
-      title: 'Advanced catalog and custom endpoints',
-      description: 'Specialized model catalogs, OpenAI-compatible servers, and provider-specific setups.',
-      providers: [],
-    },
-  ]
-  const byId = new Map(groups.map((group) => [group.id, group]))
-
-  for (const provider of providers) {
-    if (FAST_LOCAL_PROVIDER_IDS.has(provider.id)) {
-      byId.get('fast-local')!.providers.push(provider)
-    } else if (RECOMMENDED_API_PROVIDER_IDS.has(provider.id)) {
-      byId.get('recommended-api')!.providers.push(provider)
-    } else {
-      byId.get('advanced-catalog')!.providers.push(provider)
-    }
-  }
-
-  return groups.filter((group) => group.providers.length > 0)
-}
-
 export function applyIntentContext(prompt: string, intentText: string): string {
   const trimmed = intentText.trim()
   if (!trimmed) return prompt

package/src/components/chat/chat-card.tsx

@@ -143,6 +143,11 @@ export function ChatCard({ session, active, onClick }: Props) {
           />
         )}
         <span className="font-display text-[14px] font-600 truncate flex-1 tracking-[-0.01em]">{displayName}</span>
+        {active && (
+          <span className="shrink-0 text-[9px] font-700 uppercase tracking-[0.08em] text-accent-bright bg-accent-bright/15 px-1.5 py-0.5 rounded-[6px]">
+            Selected
+          </span>
+        )}
         {providerLabel && (
           <span className="shrink-0 text-[10px] font-600 uppercase tracking-wider text-text-3/70 bg-white/[0.03] px-2 py-0.5 rounded-[6px]">
             {providerLabel}

package/src/components/home/home-launchpad.tsx

@@ -1,12 +1,7 @@
 'use client'
 
 import { AgentAvatar } from '@/components/agents/agent-avatar'
-import {
-  getLaunchPathCards,
-  type LaunchPathAction,
-  type LaunchPathCardCopy,
-  type LaunchPathId,
-} from '@/lib/home-launchpad'
+import { LaunchActionCard } from '@/components/shared/launch-action-card'
 import type { Agent } from '@/types'
 
 function SnapshotItem({ label, value, hint }: { label: string; value: string; hint: string }) {
@@ -20,58 +15,47 @@ function SnapshotItem({ label, value, hint }: { label: string; value: string; hi
 }
 
 function PathCard({
-  card,
-  onAction,
+  kicker,
+  title,
+  description,
+  primaryLabel,
+  secondaryLabel,
+  onPrimary,
+  onSecondary,
 }: {
-  card: LaunchPathCardCopy
-  onAction: (id: LaunchPathId, action: LaunchPathAction) => void
+  kicker: string
+  title: string
+  description: string
+  primaryLabel: string
+  secondaryLabel: string
+  onPrimary: () => void
+  onSecondary: () => void
 }) {
   return (
     <div className="flex min-h-[220px] flex-col rounded-[18px] border border-white/[0.07] bg-white/[0.03] p-5">
-      <div className="text-[11px] font-700 uppercase tracking-[0.12em] text-text-3/55">{card.kicker}</div>
-      <div className="mt-3 text-[18px] font-display font-700 tracking-normal text-text">{card.title}</div>
-      <p className="mt-2 flex-1 text-[13px] leading-relaxed text-text-3/72">{card.description}</p>
+      <div className="text-[11px] font-700 uppercase tracking-[0.12em] text-text-3/55">{kicker}</div>
+      <div className="mt-3 text-[18px] font-display font-700 tracking-normal text-text">{title}</div>
+      <p className="mt-2 flex-1 text-[13px] leading-relaxed text-text-3/72">{description}</p>
       <div className="mt-5 flex flex-wrap gap-2">
         <button
           type="button"
-          onClick={() => onAction(card.id, 'primary')}
+          onClick={onPrimary}
           className="rounded-[10px] bg-accent-bright px-3.5 py-2 text-[12px] font-display font-700 text-black transition-opacity hover:opacity-90"
         >
-          {card.primaryLabel}
+          {primaryLabel}
         </button>
         <button
           type="button"
-          onClick={() => onAction(card.id, 'secondary')}
+          onClick={onSecondary}
           className="rounded-[10px] border border-white/[0.08] bg-white/[0.04] px-3.5 py-2 text-[12px] font-display font-700 text-text-2 transition-colors hover:bg-white/[0.08]"
         >
-          {card.secondaryLabel}
+          {secondaryLabel}
         </button>
       </div>
     </div>
   )
 }
 
-function SecondaryAction({
-  label,
-  description,
-  onClick,
-}: {
-  label: string
-  description: string
-  onClick: () => void
-}) {
-  return (
-    <button
-      type="button"
-      onClick={onClick}
-      className="rounded-[12px] border border-white/[0.07] bg-white/[0.025] px-3 py-2 text-left transition-colors hover:bg-white/[0.05]"
-    >
-      <div className="text-[12px] font-display font-700 text-text-2">{label}</div>
-      <div className="mt-0.5 text-[11px] leading-relaxed text-text-3/65">{description}</div>
-    </button>
-  )
-}
-
 type Props = {
   firstAgent: Agent | null
   agentCount: number
@@ -80,8 +64,15 @@ type Props = {
   scheduleCount: number
   connectorCount: number
   todayCost: number
-  onLaunchPathAction: (id: LaunchPathId, action: LaunchPathAction) => void
+  onOpenFirstAgent: () => void
+  onOpenProtocols: () => void
+  onOpenBuilder: () => void
+  onOpenConnectors: () => void
   onOpenUsage: () => void
+  onRunEvalSuite: () => void
+  onReviewApprovals: () => void
+  onInspectFailedRuns: () => void
+  onStartReleaseQaMission: () => void
 }
 
 export function HomeLaunchpad({
@@ -92,11 +83,16 @@ export function HomeLaunchpad({
   scheduleCount,
   connectorCount,
   todayCost,
-  onLaunchPathAction,
+  onOpenFirstAgent,
+  onOpenProtocols,
+  onOpenBuilder,
+  onOpenConnectors,
   onOpenUsage,
+  onRunEvalSuite,
+  onReviewApprovals,
+  onInspectFailedRuns,
+  onStartReleaseQaMission,
 }: Props) {
-  const launchPathCards = getLaunchPathCards({ firstAgentName: firstAgent?.name })
-
   return (
     <div className="max-w-[980px] mx-auto px-6 py-10">
       <div className="rounded-[20px] border border-white/[0.06] bg-white/[0.025] p-6">
@@ -141,37 +137,93 @@ export function HomeLaunchpad({
       </div>
 
       <div className="mt-6 grid gap-3 lg:grid-cols-3">
-        {launchPathCards.map((card) => (
-          <PathCard key={card.id} card={card} onAction={onLaunchPathAction} />
-        ))}
+        <PathCard
+          kicker="Self-hosted assistant"
+          title={firstAgent ? `Work with ${firstAgent.name}` : 'Create the first agent'}
+          description="Open a live agent chat, then add memory, local tools, provider routing, or connector access as the work demands."
+          primaryLabel={firstAgent ? 'Open Chat' : 'Open Agents'}
+          secondaryLabel="Connect Platform"
+          onPrimary={onOpenFirstAgent}
+          onSecondary={onOpenConnectors}
+        />
+        <PathCard
+          kicker="Visual workflow"
+          title="Shape a reusable run"
+          description="Use protocol templates and the builder to turn review, research, planning, or release checks into durable workflows."
+          primaryLabel="Open Builder"
+          secondaryLabel="Use Templates"
+          onPrimary={onOpenBuilder}
+          onSecondary={onOpenProtocols}
+        />
+        <PathCard
+          kicker="Autonomous mission"
+          title="Run with budgets"
+          description="Start a mission template for release QA, research, support triage, cost audit, or failed-run review with reports and caps."
+          primaryLabel="Open Missions"
+          secondaryLabel="Quality Center"
+          onPrimary={onStartReleaseQaMission}
+          onSecondary={onRunEvalSuite}
+        />
       </div>
 
-      <div className="mt-6 rounded-[16px] border border-white/[0.06] bg-white/[0.02] p-4">
-        <div className="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
-          <div>
-            <div className="text-[12px] font-display font-700 text-text">Keep the workspace observable</div>
-            <p className="mt-1 text-[12px] leading-relaxed text-text-3/65">
-              Provider spend, connector status, and quality evidence stay nearby after you pick a path.
-            </p>
-          </div>
-          <div className="grid gap-2 sm:grid-cols-3 md:min-w-[520px]">
-            <SecondaryAction
-              label="Usage"
-              description="Cost and provider health"
-              onClick={onOpenUsage}
-            />
-            <SecondaryAction
-              label="Connectors"
-              description="Platform bridges"
-              onClick={() => onLaunchPathAction('assistant', 'secondary')}
-            />
-            <SecondaryAction
-              label="Quality"
-              description="Evals and run review"
-              onClick={() => onLaunchPathAction('mission', 'secondary')}
-            />
-          </div>
-        </div>
+      <div className="mt-6 grid gap-3 md:grid-cols-2 xl:grid-cols-3">
+        <LaunchActionCard
+          title={firstAgent ? 'Open First Agent Chat' : 'Open Agents'}
+          description={firstAgent
+            ? `Jump into ${firstAgent.name} and start using the workspace immediately.`
+            : 'Open the agents workspace to create or tune the first specialist agent.'}
+          actionLabel={firstAgent ? 'Open Chat' : 'Open Agents'}
+          onClick={onOpenFirstAgent}
+          tone="primary"
+        />
+        <LaunchActionCard
+          title="Start Structured Session"
+          description="Open bounded collaboration runs for planning, review, decision-making, or focused multi-agent work."
+          actionLabel="Open Protocols"
+          onClick={onOpenProtocols}
+        />
+        <LaunchActionCard
+          title="Open Workflow Builder"
+          description="Move straight into reusable orchestration graphs if you want a durable workflow instead of a one-off run."
+          actionLabel="Open Builder"
+          onClick={onOpenBuilder}
+        />
+        <LaunchActionCard
+          title="Connect a Platform"
+          description="Bridge agents into chat surfaces like Discord, Slack, Telegram, and WhatsApp."
+          actionLabel="Open Connectors"
+          onClick={onOpenConnectors}
+        />
+        <LaunchActionCard
+          title="Review Usage"
+          description="Check cost, provider health, and activity so the workspace stays observable from the start."
+          actionLabel="Open Usage"
+          onClick={onOpenUsage}
+        />
+        <LaunchActionCard
+          title="Run Eval Suite"
+          description="Open the Quality Center and run scenario or suite checks against an agent before shipping."
+          actionLabel="Open Eval Lab"
+          onClick={onRunEvalSuite}
+        />
+        <LaunchActionCard
+          title="Review Approvals"
+          description="Clear pending human-loop, tool, connector, skill, agent, and budget requests from one desk."
+          actionLabel="Open Approvals"
+          onClick={onReviewApprovals}
+        />
+        <LaunchActionCard
+          title="Inspect Failed Runs"
+          description="Filter recent run failures and open replay evidence without leaving the operator workflow."
+          actionLabel="Open Run Review"
+          onClick={onInspectFailedRuns}
+        />
+        <LaunchActionCard
+          title="Start Release QA Mission"
+          description="Use a budgeted mission template to collect release readiness evidence and quality notes."
+          actionLabel="Open Missions"
+          onClick={onStartReleaseQaMission}
+        />
       </div>
 
       <div className="mt-8 grid gap-3 md:grid-cols-2 xl:grid-cols-3">