Stop Rebuilding UI

Chat Satisfaction Rating

React post-chat satisfaction survey block for Next.js with star rating, what-went-well tags, free-text feedback, NPS slider, and animated submit confirmation using TypeScript, shadcn/ui, and Tailwind CSS

Scroll to load preview

Collect detailed customer satisfaction feedback after a support conversation with this React and Next.js chat block. The chat ends with a system message, then transitions smoothly to a multi-step survey card featuring five-star rating, what-went-well selectable tags, free-text feedback textarea, NPS score slider from 0 to 10, and an animated confirmation state. Agent info displays the representative's name and role. Built with TypeScript, shadcn/ui Button and Textarea components, and Tailwind CSS. Ideal for customer support dashboards, help desk systems, and live chat platforms.

FAQ

Last updated on March 30, 2026

Was this page helpful?

Sign in to leave feedback.