Prompt suggestions or starter templates are offered

A blank chat input plus a blinking cursor is the worst possible empty state for an AI product. New users do not know what the model is good at, what phrasing works, or whether they are supposed to type keywords or full sentences — so they bounce. Starter prompts collapse that cold-start problem by showing concrete examples of the product's sweet spot, and they double as a proof-of-capability demo for prospects still evaluating whether the tool fits.

Render four starter prompts as clickable buttons in the empty state, each wired to submit the prompt directly — not to populate the input box. Choose prompts that showcase distinct capabilities so the grid also serves as a capability map. Implement in src/components/chat/empty-state.tsx.

{messages.length === 0 && STARTER_PROMPTS.map(p => (
  <button key={p} onClick={() => handleSubmit(p)}>{p}</button>
))}

• ID: ai-ux-patterns.core-interaction.prompt-suggestions

• Severity: low

• What to look for: Count all prompt suggestion elements in the empty-state UI: suggestion chips, example prompts, starter questions, template buttons, or sample queries. Enumerate each prompt suggestion and verify it has a click handler that submits the prompt. Check for a prompt library, template gallery, or "suggested prompts" sidebar. A prompt suggestion with no click handler is NOT a pass — must not pass based on decorative text alone.

• Pass criteria: The application shows at least 2 example prompts, starter questions, or template options in the empty state or accessible via a dedicated UI element. Report the count even on pass: "Found X prompt suggestions in empty state."

• Fail criteria: The empty state is blank, shows only a text field with a generic placeholder, or shows only a logo/illustration with no actionable prompts.

• Skip (N/A) when: The project is not a general-purpose AI chat interface — e.g., it is a single-purpose AI tool (a code reviewer, a specific form assistant) where the user's task is already defined by the interface context.

• Detail on fail: "Empty state in chat interface shows only placeholder text with no example prompts, starter templates, or use case suggestions".

• Remediation: Prompt suggestions dramatically reduce time-to-first-value for new users and set clear expectations about what the AI can do.

  const STARTER_PROMPTS = [
    "Summarize this article for me",
    "Help me write a professional email",
    "Explain this concept in simple terms",
    "Review my code for bugs",
  ]
  
  {messages.length === 0 && (
    <div className="grid grid-cols-2 gap-3 p-4">
      {STARTER_PROMPTS.map(prompt => (
        <button
          key={prompt}
          onClick={() => handleSubmit(prompt)}
          className="text-left p-3 rounded-lg border hover:bg-accent text-sm"
        >
          {prompt}
        </button>
      ))}
    </div>
  )}