Feat : Toggle to enforce user validation in Chatwoots web SDK (#3137)

* If enabled, enforces user validation with identifier_hash

* Fixes the hmac flag payload

* Adds missing i18n label for checkbox

* If enabled, Adds EOF on json file

* If applied, Handles HMAC Disable option

Co-authored-by: Tejaswini Chile <tejaswini776@gmail.com>
Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>

app/javascript/dashboard/i18n/locale/en/inboxMgmt.json

@@ -302,6 +302,9 @@
       "ENABLE_CSAT": {
         "ENABLED": "Enabled",
         "DISABLED": "Disabled"
+      },
+      "ENABLE_HMAC": {
+        "LABEL": "Enable"
       }
     },
     "DELETE": {
@@ -351,6 +354,8 @@
       "AUTO_ASSIGNMENT_SUB_TEXT": "Enable or disable the automatic assignment of new conversations to the agents added to this inbox.",
       "HMAC_VERIFICATION": "User Identity Validation",
       "HMAC_DESCRIPTION": "Inorder to validate the user's identity, the SDK allows you to pass an `identifier_hash` for each user. You can generate HMAC using 'sha256' with the key shown here.",
+      "HMAC_MANDATORY_VERIFICATION": "Enforce User Identity Validation",
+      "HMAC_MANDATORY_DESCRIPTION": "If enabled, Chatwoot SDKs setUser method will not work unless the `identifier_hash` is provided for each user.",
       "INBOX_IDENTIFIER": "Inbox Identifier",
       "INBOX_IDENTIFIER_SUB_TEXT": "Use the `inbox_identifier` token shown here to authentication your API clients.",
       "FORWARD_EMAIL_TITLE": "Forward to Email",

app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue

@@ -316,6 +316,24 @@
           >
             <woot-code :script="inbox.hmac_token"></woot-code>
           </settings-section>
+          <settings-section
+            :title="$t('INBOX_MGMT.SETTINGS_POPUP.HMAC_MANDATORY_VERIFICATION')"
+            :sub-title="
+              $t('INBOX_MGMT.SETTINGS_POPUP.HMAC_MANDATORY_DESCRIPTION')
+            "
+          >
+            <div class="enter-to-send--checkbox">
+              <input
+                id="hmacMandatory"
+                v-model="hmacMandatory"
+                type="checkbox"
+                @change="handleHmacFlag"
+              />
+              <label for="hmacMandatory">
+                {{ $t('INBOX_MGMT.EDIT.ENABLE_HMAC.LABEL') }}
+              </label>
+            </div>
+          </settings-section>
         </div>
       </div>
       <div v-else-if="isAPIInbox" class="settings--content">
@@ -377,6 +395,7 @@ export default {
       avatarUrl: '',
       selectedAgents: [],
       greetingEnabled: true,
+      hmacMandatory: null,
       greetingMessage: '',
       autoAssignment: false,
       emailCollectEnabled: false,
@@ -511,6 +530,9 @@ export default {
         e.target.value
       );
     },
+    handleHmacFlag() {
+      this.updateInbox();
+    },
     toggleInput(selected, current) {
       if (selected.includes(current)) {
         const newSelectedFlags = selected.filter(flag => flag !== current);
@@ -533,6 +555,7 @@ export default {
         this.selectedInboxName = this.inbox.name;
         this.webhookUrl = this.inbox.webhook_url;
         this.greetingEnabled = this.inbox.greeting_enabled || false;
+        this.hmacMandatory = this.inbox.hmac_mandatory || false;
         this.greetingMessage = this.inbox.greeting_message || '';
         this.autoAssignment = this.inbox.enable_auto_assignment;
         this.emailCollectEnabled = this.inbox.enable_email_collect;
@@ -589,6 +612,7 @@ export default {
             welcome_tagline: this.channelWelcomeTagline || '',
             selectedFeatureFlags: this.selectedFeatureFlags,
             reply_time: this.replyTime || 'in_a_few_minutes',
+            hmac_mandatory: this.hmacMandatory,
           },
         };
         if (this.avatarFile) {

app/models/channel/web_widget.rb

@@ -29,7 +29,7 @@ class Channel::WebWidget < ApplicationRecord
   include FlagShihTzu
 
   self.table_name = 'channel_web_widgets'
-  EDITABLE_ATTRS = [:website_url, :widget_color, :welcome_title, :welcome_tagline, :reply_time, :pre_chat_form_enabled,
+  EDITABLE_ATTRS = [:website_url, :widget_color, :welcome_title, :welcome_tagline, :reply_time, :pre_chat_form_enabled, :hmac_mandatory,
                     { pre_chat_form_options: [:pre_chat_message, :require_email] },
                     { selected_feature_flags: [] }].freeze
 

app/views/api/v1/models/_inbox.json.jbuilder

@@ -20,6 +20,7 @@ json.callback_webhook_url resource.callback_webhook_url
 ## WebWidget Attributes
 json.widget_color resource.channel.try(:widget_color)
 json.website_url resource.channel.try(:website_url)
+json.hmac_mandatory resource.channel.try(:hmac_mandatory)
 json.welcome_title resource.channel.try(:welcome_title)
 json.welcome_tagline resource.channel.try(:welcome_tagline)
 json.web_widget_script resource.channel.try(:web_widget_script)