Customer Service Concierge

🔍 Problem Statement

As a logged-in subscriber, I have no conversational surface to manage my account, which forces me into multi-step UI flows or human CX for routine tasks (view invoices, change address, update payment, switch plan, cancel).

💡 User Story

As a subscriber, I want to open an in-page chat panel on the publisher site and ask the AI agent to read or modify my account, so that I can complete routine tasks without leaving the page or contacting support.

As a publisher, I want to embed this concierge as a ReactJS Element on any page, so that I can deploy AI-driven self-serve CX with the same integration model as existing Pelcro Elements.

As an end user, I want destructive or financial actions to require explicit confirmation in-chat, so that the agent cannot cancel, charge, or change my plan without my approval.

🎯 Definition of Done (DoD)

✔ Given a subscriber is authenticated on the publisher site via the Pelcro JS-SDK, when the concierge Element is mounted, then a docked chat panel renders and the session inherits the subscriber's existing Pelcro auth token without a second login.

✔ Given the chat session is active, when the user sends a message, then the agent connects to the Pelcro MCP server (FR-01) using the subscriber-scoped bearer token and routes API calls through MCP tools only — no direct REST calls from the front-end.

✔ Given an MCP tool is invoked, when the response arrives, then the panel renders structured cards for known entities (invoices, subscriptions, plans, addresses, payment methods) with per-row actions (PDF, change, cancel) and shows the underlying tool name and endpoint for transparency.

✔ Given the user requests a write action (address update, payment method change, plan switch, cancellation, refund request), when the agent prepares the call, then the panel surfaces a confirmation step with the exact change diff and blocks execution until the user confirms in-chat.

✔ Given any agent response, when it renders, then a persistent footer disclaimer states "AI may be inaccurate. Verify critical actions before confirming."

✔ Given a chat session, when the user reloads the page or returns later, then the conversation history persists per-subscriber and is retrievable via a history control in the panel header.

✔ Given a publisher wants to embed the concierge, when they add the Element to their page, then they can configure panel position (docked right, floating bubble), branding (logo, accent color), allowed tool scope (read-only vs. read-write), and welcome prompt via standard Element props.

✔ This change will impact UI and SDK, specifically a new ReactJS Element ("Subscription Concierge") in pelcro-elements and a session/token handoff helper in pelcro-js-sdk.