Skip to content

Replace hardcoded suggestions with "popular actions" carousel #247

@twblack88

Description

@twblack88

Context

The three suggested actions above the prompt bar are hardcoded strings that don't represent the agent's actual capabilities. Replace them with a horizontally-scrolling carousel seeded from a curated popular-actions list.

Actions:

  • Instantly Swap ETH for SOL
  • Set a limit order
  • Tell me about FOX
  • Set up a TWAP/DCA into ETH
  • What's my balance on Arbitrum?
  • Check trending tokens
  • Send some of my assets to another wallet

Files

  • apps/agentic-chat/src/components/Chat.tsx:14-18 — current hardcoded suggestion array
  • apps/agentic-chat/src/components/Chat.tsx:118-134 — current render (3 buttons)

Approach

  • Add embla-carousel-react (~10KB, tree-shakeable — no shadcn carousel installed yet).
  • Replace the 3-button grid with a horizontally-scrolling carousel of popular actions. Auto-advance slowly; pause on hover; swipeable on mobile.

TODO

  • copy for the actions

Verification

bun run lint
bun run type-check
bun test

Visual QA: carousel auto-advances on load, pauses on hover, swipes on mobile (<768px).

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    Status

    Backlog

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions