J'AI Support Chat Module¶
The support_chat module provides an AI-powered customer support chatbot for the storefront. It leverages installed AI provider extensions (Claude, ChatGPT) to help customers find products, check order status, add items to their cart from handwritten notes, and optionally hand off to a live agent.
Architecture¶
The module is stateless per-request. Conversation history is maintained on the frontend in sessionStorage and sent with each request.
Storefront Widget (JaiChat.svelte)
↓ POST /api/chat (BFF proxy)
↓ GraphQL: sendChatMessage mutation
↓ ChatService.process_message()
↓ AICompletionStrategy (ext_claude / ext_chatgpt)
↓ Parse response → execute actions (product search, order lookup, cart add)
↓ Return ChatResponse with message + action cards
Backend Files¶
| File | Purpose |
|---|---|
modules/support_chat/strategies.py | OrderLookupStrategy and LiveAgentStrategy ABCs |
modules/support_chat/local_order_lookup.py | Built-in order lookup using local Order model |
modules/support_chat/services.py | ChatService — core orchestrator |
modules/support_chat/types.py | Strawberry GraphQL types |
modules/support_chat/resolvers.py | GraphQL queries and mutations |
Strategy ABCs¶
OrderLookupStrategy¶
Extension point for ERP order status lookups. Methods:
lookup_order(order_number, email?) → OrderStatusResultget_tracking(order_number) → OrderStatusResult
The built-in LocalOrderLookupStrategy queries the local Order table. An ERP extension registers its own implementation to override.
LiveAgentStrategy¶
Extension point for live chat handoff. Methods:
is_available() → boolinitiate_handoff(session_id, context?) → HandoffResult
No built-in implementation. Only activates when an extension (Zendesk, Intercom, Freshdesk, etc.) is installed.
GraphQL API¶
Queries¶
chatSettings— Returns enabled status, terms text, disclaimers, welcome message, live agent availability. No auth required.chatOrderStatus(orderNumber, email?)— Direct order status lookup outside of chat flow.
Mutations¶
sendChatMessage(messages: [ChatMessageInput!]!, imageUrl: String)— Main chat interaction. ReturnsChatResponsewith message text and action cards.requestLiveAgent(sessionContext: String)— Initiates handoff to a live agent if aLiveAgentStrategyis registered.
Settings¶
All settings are stored in the Setting table with module="support_chat" (Decided #21):
| Key | Type | Purpose |
|---|---|---|
support_chat_enabled | boolean | Master toggle |
support_chat_terms_text | string | T&C users must accept |
support_chat_disclaimer_top | string | Top warning banner |
support_chat_disclaimer_bottom | string | Bottom disclaimer |
support_chat_welcome_message | string | Initial greeting |
support_chat_ai_provider | string | AI provider name or "auto" |
support_chat_system_prompt_override | string | Custom prompt additions |
Action Types¶
The AI response is parsed for structured action blocks. Supported types:
| Action Type | Description |
|---|---|
product_recommendation | Product search results with cards |
order_status | Order status + tracking info card |
add_to_cart | Button to add a specific variant |
live_agent_offer | Prompt to connect with a live agent |
Image Upload (Handwritten Notes)¶
- Customer uploads an image via the chat widget
- Image goes through the existing
/api/uploadBFF endpoint - URL is passed to
sendChatMessageasimageUrl - The AI provider (Claude vision / GPT-4o) reads the handwritten items
- AI responds with product search actions for each item
Extending J'AI¶
ERP Order Lookup Extension¶
# ext_erp_order_lookup/strategy.py
from vectis.modules.support_chat.strategies import OrderLookupStrategy, OrderStatusResult
class ERPOrderLookupStrategy(OrderLookupStrategy):
@property
def provider_name(self) -> str:
return "erp"
async def lookup_order(self, order_number, email=None):
# Call ERP API via httpx
...
async def get_tracking(self, order_number):
# Call ERP tracking API
...
Register in on_activate:
strategy_resolver.register(
OrderLookupStrategy, ERPOrderLookupStrategy(...),
name="erp", extension_name=self.name,
)
Live Agent Extension¶
Same pattern using LiveAgentStrategy. When registered, the storefront widget automatically shows a "Talk to a person" button.
Admin Settings Page¶
Located at /settings/support-chat/ in the admin. Allows configuring:
- Enable/disable toggle
- Terms & conditions text
- Top and bottom disclaimer messages
- Welcome message
- AI provider selection
- System prompt override
The page is linked from the main Settings hub.