c4089f2226 fix(csat): Require confirmation before submitting rating (#14450)
Customers reported that the CSAT survey was recording their rating the
instant they tapped a star — leaving no chance to correct an accidental
pick. This change lets the customer freely change their selection until
they actually submit the comment/feedback. The rating still saves on
click (so we don't lose ratings when a customer never types a comment),
but it stays editable until the comment form is submitted. Once that
happens, the rating locks.

The flow on both surfaces:

- Customer taps a star/emoji → rating is saved.
- Customer taps a different star/emoji → previous save is overwritten
with the new value.
- Customer types a comment and submits → latest rating + comment are
saved together.
- After that submit, the rating is locked and can't be changed.

Two surfaces are updated:

- **Standalone survey page** (`/survey/responses/:uuid`) — the rating
buttons remain re-tappable until the Feedback form is submitted; once
submitted, both rating and feedback lock.
- **In-conversation widget CSAT** — same behavior, the inline
arrow-submit button on the feedback form is the locking action.

In-flight guards prevent a race where the customer changes their pick
mid-network-call (raised by the codex review on the earlier revision):
while a save is in flight, the rating controls are temporarily disabled
so the request and the displayed selection can't diverge.

## Closes

-
https://linear.app/chatwoot/issue/CW-7061/csat-star-rating-submits-on-first-click-needs-confirmation-step

## How to test

**Standalone survey page**
1. Enable CSAT on any inbox (Settings → Inboxes → Configuration → CSAT
survey).
2. Resolve a conversation in that inbox so a CSAT message is generated.
3. Open the survey URL:
`{FRONTEND_URL}/survey/responses/{conversation.uuid}` (easiest: `bundle
exec rails runner 'puts Conversation.joins(:messages).where(messages: {
content_type: "input_csat" }).last.csat_survey_link'`).
4. Tap a star/emoji — confirm the rating saves (Network panel shows a
PUT to `/public/api/v1/csat_survey/{uuid}`).
5. Tap a different star/emoji — confirm a second PUT goes out with the
new value; the latest selection is reflected.
6. Type a comment and hit Submit feedback — confirm rating + feedback
persist; both controls now lock.
7. Reload the page — the locked state is rehydrated correctly.

**Widget CSAT**
1. From an inbox with CSAT enabled, resolve a conversation that has an
active widget session.
2. In the widget, the CSAT card appears with stars/emojis + the inline
comment box.
3. Tap a star/emoji — confirm a PATCH goes out and the selection visibly
updates.
4. Tap different stars/emojis — confirm each overrides the previous
save.
5. Type a comment and click the arrow — rating + comment submit
together; stars lock.

Both display types (emoji and 5-star) should behave consistently.

## What changed

- `app/javascript/survey/views/Response.vue` — `selectRating()` saves on
every tap and short-circuits while a save is in flight (or after
feedback was submitted). Rating components are disabled by
`isFeedbackSubmitted || isUpdating` so the lock follows the feedback
submission, not the first rating tap.
- `app/javascript/survey/components/Rating.vue` — new `isDisabled` prop.
The disabled / hover styling and click guard key off it instead of the
presence of `selectedRating`, so emojis stay re-clickable until the
feedback step locks them.
- `app/javascript/shared/components/CustomerSatisfaction.vue` — same
shape for the widget: rating click auto-submits and re-clicks override
the previous save; controls disabled while a submit is in flight;
emoji-button styling and the inline `StarRating` lock on
`isFeedbackSubmitted || isUpdating`.

---------

Co-authored-by: Muhsin <12408980+muhsin-k@users.noreply.github.com>
Co-authored-by: Sony Mathew <2040199+sony-mathew@users.noreply.github.com>
2026-05-18 21:46:30 +05:30
2019-11-25 09:48:11 +05:30
2019-08-14 15:18:44 +05:30
2019-08-14 15:18:44 +05:30
2019-08-14 15:18:44 +05:30
2026-01-15 20:28:13 -08:00
2023-05-06 10:44:52 +05:30
2019-10-20 14:17:26 +05:30
2019-08-14 15:18:44 +05:30
2024-02-01 15:37:05 +05:30
2024-10-02 00:36:30 -07:00
2024-10-02 00:36:30 -07:00
2024-10-02 00:36:30 -07:00
2025-01-16 10:59:33 -08:00
2026-04-16 19:02:23 +05:30

Header light mode Header dark mode

Chatwoot

The modern customer support platform, an open-source alternative to Intercom, Zendesk, Salesforce Service Cloud etc.

CircleCI Badge Docker Pull Badge Docker Build Badge Commits-per-month Discord uptime response time Artifact HUB

Deploy Deploy to DO

Chat dashboard dark mode Chat dashboard

Chatwoot is the modern, open-source, and self-hosted customer support platform designed to help businesses deliver exceptional customer support experience. Built for scale and flexibility, Chatwoot gives you full control over your customer data while providing powerful tools to manage conversations across channels.

Captain AI Agent for Support

Supercharge your support with Captain, Chatwoots AI agent. Captain helps automate responses, handle common queries, and reduce agent workload—ensuring customers get instant, accurate answers. With Captain, your team can focus on complex conversations while routine questions are resolved automatically. Read more about Captain here.

💬 Omnichannel Support Desk

Chatwoot centralizes all customer conversations into one powerful inbox, no matter where your customers reach out from. It supports live chat on your website, email, Facebook, Instagram, Twitter, WhatsApp, Telegram, Line, SMS etc.

📚 Help center portal

Publish help articles, FAQs, and guides through the built-in Help Center Portal. Enable customers to find answers on their own, reduce repetitive queries, and keep your support team focused on more complex issues.

🗂️ Other features

Collaboration & Productivity

  • Private Notes and @mentions for internal team discussions.
  • Labels to organize and categorize conversations.
  • Keyboard Shortcuts and a Command Bar for quick navigation.
  • Canned Responses to reply faster to frequently asked questions.
  • Auto-Assignment to route conversations based on agent availability.
  • Multi-lingual Support to serve customers in multiple languages.
  • Custom Views and Filters for better inbox organization.
  • Business Hours and Auto-Responders to manage response expectations.
  • Teams and Automation tools for scaling support workflows.
  • Agent Capacity Management to balance workload across the team.

Customer Data & Segmentation

  • Contact Management with profiles and interaction history.
  • Contact Segments and Notes for targeted communication.
  • Campaigns to proactively engage customers.
  • Custom Attributes for storing additional customer data.
  • Pre-Chat Forms to collect user information before starting conversations.

Integrations

  • Slack Integration to manage conversations directly from Slack.
  • Dialogflow Integration for chatbot automation.
  • Dashboard Apps to embed internal tools within Chatwoot.
  • Shopify Integration to view and manage customer orders right within Chatwoot.
  • Use Google Translate to translate messages from your customers in realtime.
  • Create and manage Linear tickets within Chatwoot.

Reports & Insights

  • Live View of ongoing conversations for real-time monitoring.
  • Conversation, Agent, Inbox, Label, and Team Reports for operational visibility.
  • CSAT Reports to measure customer satisfaction.
  • Downloadable Reports for offline analysis and reporting.

Documentation

Detailed documentation is available at chatwoot.com/help-center.

Translation process

The translation process for Chatwoot web and mobile app is managed at https://translate.chatwoot.com using Crowdin. Please read the translation guide for contributing to Chatwoot.

Branching model

We use the git-flow branching model. The base branch is develop. If you are looking for a stable version, please use the master or tags labelled as v1.x.x.

Deployment

Heroku one-click deploy

Deploying Chatwoot to Heroku is a breeze. It's as simple as clicking this button:

Deploy

Follow this link to understand setting the correct environment variables for the app to work with all the features. There might be breakages if you do not set the relevant environment variables.

DigitalOcean 1-Click Kubernetes deployment

Chatwoot now supports 1-Click deployment to DigitalOcean as a kubernetes app.

Deploy to DO

Other deployment options

For other supported options, checkout our deployment page.

Security

Looking to report a vulnerability? Please refer our SECURITY.md file.

Community

If you need help or just want to hang out, come, say hi on our Discord server.

Contributors

Thanks goes to all these wonderful people:

Chatwoot © 2017-2026, Chatwoot Inc - Released under the MIT License.

S
Description
Chatwoot - Custom build for Leal Cyber
Readme MIT
261 MiB
Languages
Ruby 48.1%
Vue 26.8%
JavaScript 21.9%
HTML 1.8%
SCSS 0.4%
Other 0.9%