From 728956a734930fc6d14a8964cd9f930c3acde777 Mon Sep 17 00:00:00 2001 From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com> Date: Tue, 23 Sep 2025 22:20:43 +0530 Subject: [PATCH] fix: Inbox delete confirmation fails due to whitespace (#12498) # Pull Request Template ## Description This PR fixes an issue where users are unable to delete an inbox because the delete confirmation button remains disabled. ### Cause Inboxes created with leading or trailing spaces in their names failed the confirmation check. During deletion, the confirmation modal compared the raw user input with the stored inbox name. Because whitespace was not normalized, the values did not match exactly, causing the delete button to remain inactive even when the correct name was entered. ### Solution The validation logic now trims whitespace from both the input and stored value before comparison. This ensures inbox names with accidental spaces are handled correctly, and the delete button works as expected in all cases. Fixes https://linear.app/chatwoot/issue/CW-5659/confirmation-button-greyed-out-randomly-when-deleting-inbox-from-inbox ## Type of change - [x] Bug fix (non-breaking change which fixes an issue) ## How Has This Been Tested? **Steps to Reproduce** 1. Create an inbox with leading or trailing whitespace in its name. 2. Save and complete the inbox creation process. 3. Go to the inbox list and try deleting the inbox by entering the name without the whitespace in the confirmation modal. 4. Now you can't able to delete the inbox. ## Checklist: - [x] My code follows the style guidelines of this project - [x] I have performed a self-review of my code - [x] I have commented on my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [x] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [x] New and existing unit tests pass locally with my changes - [ ] Any dependent changes have been merged and published in downstream modules --- .../components/widgets/modal/ConfirmDeleteModal.vue | 5 ++++- .../dashboard/routes/dashboard/settings/inbox/Settings.vue | 2 +- .../dashboard/settings/inbox/channels/360DialogWhatsapp.vue | 2 +- .../routes/dashboard/settings/inbox/channels/Api.vue | 2 +- .../dashboard/settings/inbox/channels/BandwidthSms.vue | 2 +- .../dashboard/settings/inbox/channels/CloudWhatsapp.vue | 2 +- .../routes/dashboard/settings/inbox/channels/Facebook.vue | 2 +- .../routes/dashboard/settings/inbox/channels/Line.vue | 2 +- .../routes/dashboard/settings/inbox/channels/Twilio.vue | 2 +- .../routes/dashboard/settings/inbox/channels/Website.vue | 2 +- .../inbox/channels/emailChannels/ForwardToOption.vue | 2 +- 11 files changed, 14 insertions(+), 11 deletions(-) diff --git a/app/javascript/dashboard/components/widgets/modal/ConfirmDeleteModal.vue b/app/javascript/dashboard/components/widgets/modal/ConfirmDeleteModal.vue index a9a7cc16d..01d0a0e0a 100644 --- a/app/javascript/dashboard/components/widgets/modal/ConfirmDeleteModal.vue +++ b/app/javascript/dashboard/components/widgets/modal/ConfirmDeleteModal.vue @@ -32,7 +32,10 @@ export default { value: { required, isEqual(value) { - return value === this.confirmValue; + // Trim whitespace from both input and target values + const normalizedInput = (value || '').trim(); + const normalizedTarget = (this.confirmValue || '').trim(); + return normalizedInput === normalizedTarget; }, }, }, diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue index 1f455f112..aa1def9e9 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue @@ -341,7 +341,7 @@ export default { try { const payload = { id: this.currentInboxId, - name: this.selectedInboxName, + name: this.selectedInboxName?.trim(), enable_email_collect: this.emailCollectEnabled, allow_messages_after_resolved: this.allowMessagesAfterResolved, greeting_enabled: this.greetingEnabled, diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/360DialogWhatsapp.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/360DialogWhatsapp.vue index 3a622425a..def828083 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/360DialogWhatsapp.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/360DialogWhatsapp.vue @@ -41,7 +41,7 @@ export default { const whatsappChannel = await this.$store.dispatch( 'inboxes/createChannel', { - name: this.inboxName, + name: this.inboxName?.trim(), channel: { type: 'whatsapp', phone_number: this.phoneNumber, diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Api.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Api.vue index e9288e956..15054fe1e 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Api.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Api.vue @@ -42,7 +42,7 @@ export default { try { const apiChannel = await this.$store.dispatch('inboxes/createChannel', { - name: this.channelName, + name: this.channelName?.trim(), channel: { type: 'api', webhook_url: this.webhookUrl, diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/BandwidthSms.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/BandwidthSms.vue index 157f58f12..cd7ad401a 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/BandwidthSms.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/BandwidthSms.vue @@ -48,7 +48,7 @@ export default { try { const smsChannel = await this.$store.dispatch('inboxes/createChannel', { - name: this.inboxName, + name: this.inboxName?.trim(), channel: { type: 'sms', phone_number: this.phoneNumber, diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/CloudWhatsapp.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/CloudWhatsapp.vue index 1161da5af..0c1ac3a14 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/CloudWhatsapp.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/CloudWhatsapp.vue @@ -45,7 +45,7 @@ export default { const whatsappChannel = await this.$store.dispatch( 'inboxes/createChannel', { - name: this.inboxName, + name: this.inboxName?.trim(), channel: { type: 'whatsapp', phone_number: this.phoneNumber, diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Facebook.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Facebook.vue index be3051864..db1928ea8 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Facebook.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Facebook.vue @@ -179,7 +179,7 @@ export default { user_access_token: this.user_access_token, page_access_token: this.selectedPage.access_token, page_id: this.selectedPage.id, - inbox_name: this.selectedPage.name, + inbox_name: this.selectedPage.name?.trim(), }; }, diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Line.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Line.vue index b3694beb8..815b40eb2 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Line.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Line.vue @@ -45,7 +45,7 @@ export default { const lineChannel = await this.$store.dispatch( 'inboxes/createChannel', { - name: this.channelName, + name: this.channelName?.trim(), channel: { type: 'line', line_channel_id: this.lineChannelId, diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Twilio.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Twilio.vue index 844392f49..677c7c284 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Twilio.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Twilio.vue @@ -85,7 +85,7 @@ export default { 'inboxes/createTwilioChannel', { twilio_channel: { - name: this.channelName, + name: this.channelName?.trim(), medium: this.medium, account_sid: this.accountSID, api_key_sid: this.apiKeySID, diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Website.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Website.vue index b6e114f2b..6f21acd52 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Website.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Website.vue @@ -47,7 +47,7 @@ export default { const website = await this.$store.dispatch( 'inboxes/createWebsiteChannel', { - name: this.inboxName, + name: this.inboxName?.trim(), greeting_enabled: this.greetingEnabled, greeting_message: this.greetingMessage, channel: { diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/emailChannels/ForwardToOption.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/emailChannels/ForwardToOption.vue index eef7574f3..dbe8caba7 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/emailChannels/ForwardToOption.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/emailChannels/ForwardToOption.vue @@ -42,7 +42,7 @@ export default { const emailChannel = await this.$store.dispatch( 'inboxes/createChannel', { - name: this.channelName, + name: this.channelName?.trim(), channel: { type: 'email', email: this.email,