Demo project

Two-lane AI: customer self-service and an agent copilot

Customer AI answers from public product documentation and account tools they can only read from—never mutating billing or subscriptions. Employee AI backs the human with internal runbooks plus read/write account tools, and always separates internal notes from a draft customer reply the agent reviews before anything is sent. Escalation hands off in-thread with structured context.

Source code

sramam/customer-service-agent-demo

Browse the full repo—agents, UI, APIs, and demo media pipeline.

View on GitHub

What you'll see

  • Customer AI— search public product docs (optional product-line focus), account and invoice views they can only read, linked sources, and suggested chips that send as the customer's next message when tapped.
  • Documentation — markdown sources under content/docs; agents can list product areas and narrow search so answers stay on-topic.
  • Escalation — structured handoff (summary, products involved, agent context) into the same chat; the dashboard surfaces escalated threads without a sidebar rail.
  • Agent workspace + employee AI — public and internal docs plus account tools; responses split into internal notes and a draft customer reply the human edits and sends. Nothing internal goes to the customer unless it is copied into that draft.
  • Live thread sync — the agent view stays current after customer messages and approved replies: PartyKit WebSockets when configured, otherwise automatic polling plus refetch when you return to the tab. Same-tab split view also refreshes the agent column immediately.

Walkthrough

Try it yourself

Open the interactive split view at /customer: customer chat on the left, agent column on the right (escalation list, thread, employee AI, draft review).

Launch interactive demo

Token economics

Approximate language-model token usage attributed to building this demo (development iterations, refactors, and tooling)—illustrative of cost structure when shipping with AI.

CategoryTokensCost (USD)
Input tokens17,603,947$88.02
Output tokens1,851,308$46.28
Input cached tokens311,163,351$155.58
Total$289.88

Tech stack

App & UI

Next.js 16 · React 19 · TypeScript · Tailwind CSS 4 · shadcn-style UI (Base UI, CVA) · Lucide icons

AI & validation

Vercel AI SDK 6 · OpenAI (via AI SDK) · optional Anthropic fallback · Zod tool schemas

Live sync

PartyKit when configured, otherwise polling · same-tab events for instant agent refresh when using the split view

Data

Prisma 7 · PostgreSQL on Neon · Prisma Neon driver adapter

Content

react-markdown · remark-gfm

Testing & demo media

Playwright (e2e) · Remotion 4 (walkthrough video) · ElevenLabs (voice-over)

Hosting & tooling

Vercel · pnpm · ESLint