chore: Custom Roles to manage permissions [ UI ] (#9865)

In admin settings, this Pr will add the UI for managing custom roles (
ref: https://github.com/chatwoot/chatwoot/pull/9995 ). It also handles
the routing logic changes to accommodate fine-tuned permissions.

---------

Co-authored-by: Pranav <pranavrajs@gmail.com>
Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Co-authored-by: iamsivin <iamsivin@gmail.com>
Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>

app/javascript/dashboard/helper/AudioAlerts/DashboardAudioNotificationHelper.js

@@ -5,6 +5,11 @@ import {
   getAlertAudio,
   initOnEvents,
 } from 'shared/helpers/AudioNotificationHelper';
+import {
+  ROLES,
+  CONVERSATION_PERMISSIONS,
+} from 'dashboard/constants/permissions.js';
+import { getUserPermissions } from 'dashboard/helper/permissionsHelper.js';
 
 const NOTIFICATION_TIME = 30000;
 
@@ -14,12 +19,13 @@ class DashboardAudioNotificationHelper {
     this.audioAlertType = 'none';
     this.playAlertOnlyWhenHidden = true;
     this.alertIfUnreadConversationExist = false;
+    this.currentUser = null;
     this.currentUserId = null;
     this.audioAlertTone = 'ding';
   }
 
   setInstanceValues = ({
-    currentUserId,
+    currentUser,
     alwaysPlayAudioAlert,
     alertIfUnreadConversationExist,
     audioAlertType,
@@ -28,7 +34,8 @@ class DashboardAudioNotificationHelper {
     this.audioAlertType = audioAlertType;
     this.playAlertOnlyWhenHidden = !alwaysPlayAudioAlert;
     this.alertIfUnreadConversationExist = alertIfUnreadConversationExist;
-    this.currentUserId = currentUserId;
+    this.currentUser = currentUser;
+    this.currentUserId = currentUser.id;
     this.audioAlertTone = audioAlertTone;
     initOnEvents.forEach(e => {
       document.addEventListener(e, this.onAudioListenEvent, false);
@@ -112,6 +119,20 @@ class DashboardAudioNotificationHelper {
     return message?.sender_id === this.currentUserId;
   };
 
+  isUserHasConversationPermission = () => {
+    const currentAccountId = window.WOOT.$store.getters.getCurrentAccountId;
+    // Get the user permissions for the current account
+    const userPermissions = getUserPermissions(
+      this.currentUser,
+      currentAccountId
+    );
+    // Check if the user has the required permissions
+    const hasRequiredPermission = [...ROLES, ...CONVERSATION_PERMISSIONS].some(
+      permission => userPermissions.includes(permission)
+    );
+    return hasRequiredPermission;
+  };
+
   shouldNotifyOnMessage = message => {
     if (this.audioAlertType === 'mine') {
       return this.isConversationAssignedToCurrentUser(message);
@@ -120,6 +141,11 @@ class DashboardAudioNotificationHelper {
   };
 
   onNewMessage = message => {
+    // If the user does not have the permission to view the conversation, then dismiss the alert
+    if (!this.isUserHasConversationPermission()) {
+      return;
+    }
+
     // If the message is sent by the current user or the
     // correct notification is not enabled, then dismiss the alert
     if (