Next.js Call-Center CMS Chatbot Integration

I have an in-house CMS that our call-center agents already use daily. The stack is Next.js on the frontend with React components, backed by Node.js services. I now want to fold an automated chatbot directly into this interface so agents (and eventually customers) can trigger routine workflows without leaving the dashboard.

Scope
• Build or extend a modular React component that hosts the chatbot UI inside our existing Next.js pages.
• Wire that component to our current Node.js API layer; you’ll expose endpoints that pass messages to the bot engine I’ll provide (REST/GraphQL, whichever is faster for you).
• Ensure the chat flows, message history, and context are stored in our existing Postgres tables—schema extension may be needed.
• Add basic typing indicators, error handling, and a clean hand-off mechanism so an agent can jump into a live chat when needed.
• Deliver clean, documented code that fits our folder structure and passes eslint / Prettier rules already in the repo.

Acceptance
1. The chatbot launches seamlessly inside the CMS without a full-page refresh.
2. Messages round-trip through our backend in under two seconds on a 4G connection.
3. All new code is unit-tested and a short README explains setup, .env variables, and deployment steps.

You’ll work in a private GitHub repo and open pull requests against the dev branch. If you’ve previously embedded chatbots with Next.js (e.g., using Socket.IO, WebSockets, or third-party NLP services), please mention it when you start—those shortcuts can save us both time.