Welcome to the Jose Madrid Salsa developer docs — explore features, APIs, and deployment guides.
Jose Madrid SalsaJMS Docs

AI chat

Picante chat launcher, AI support, contact form, and live-team handoff behavior.

AI chat

The public storefront includes Picante, a playful pepper-penguin AI companion for product, fundraising, wholesale, and order-support questions. The animated mascot at the bottom-right of the page is also the chat launcher.

Launcher behavior

  • Picante walks within a bounded track along the bottom-right portion of the viewport.
  • Clicking or keyboard-activating Picante opens the existing chat panel.
  • Picante returns to an idle pose while the panel is open.
  • Visitors who request reduced motion see a stationary idle pose.
  • The launcher remains inside mobile safe areas and does not block the rest of the page.

Chat behavior

Picante introduces himself by name and responds with a concise, upbeat character voice that uses occasional pepper and penguin wordplay. Accuracy and clarity take priority over jokes, and Picante avoids mascot banter during sensitive support or human handoffs. Business-hours lookup and live-team handoff continue through the existing chat APIs. Closing the panel returns Picante to the launcher state.

Contact form

Below Picante's opening message sits an "Or fill out a contact form by clicking here" button, for visitors who would rather leave their details than have a conversation. It swaps the panel to a standard contact form:

FieldRequired
Full NameYes
Email AddressYes
Company nameNo
Phone numberNo
Comments / questionsYes

Submitting posts to POST /api/send-email/contact with sourcePage: 'Picante Chat', the same endpoint the public /contact page uses. The submission is rate limited by IP (5 per minute), validated with Zod, stored as a Conversation, and emailed to the business inbox with the sender's address as reply-to. On success the panel shows a confirmation; closing it returns the visitor to Picante, and "Back to chat" does the same from the form.

The notification email (emails/contact-form.tsx) mirrors the layout the office already works from: logo, a "Contact form submission" heading, a labelled Details block, the comment body, and an "Open store" button. Its subject is <email> submitted the form from your <page> page, where the page comes from the optional sourcePage field. Because this email is an internal alert to the business inbox rather than a subscriber email, it carries no footer unsubscribe link; the List-Unsubscribe header applied by lib/email/client.ts is unchanged.

This is separate from the "Talk to a human" handoff, which opens a live chat thread during business hours instead of sending mail.

Asset

The storefront uses an optimized three-row derivative at public/images/ai-chat/picante-spritesheet.webp, containing only idle and left/right walking frames. The complete version 2 pet package remains the source asset outside the website bundle.

How is this guide?

Edit on GitHub

Last updated on

On this page