feat(V5): Update settings pages UI (#13396)

# Pull Request Template ## Description This PR updates settings page UI ## Type of change - [x] New feature (non-breaking change which adds functionality) ## 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
2026-02-19 15:04:40 +05:30
parent c9619eaed2
commit 7b2b3ac37d
182 changed files with 5187 additions and 4297 deletions
--- a/app/javascript/dashboard/i18n/locale/en/agentBots.json
+++ b/app/javascript/dashboard/i18n/locale/en/agentBots.json
@@ -4,6 +4,9 @@
    "LOADING_EDITOR": "Loading editor...",
    "DESCRIPTION": "Agent Bots are like the most fabulous members of your team. They can handle the small stuff, so you can focus on the stuff that matters. Give them a try. You can manage your bots from this page or create new ones using the 'Add Bot' button.",
    "LEARN_MORE": "Learn about agent bots",
+    "COUNT": "{n} bot | {n} bots",
+    "SEARCH_PLACEHOLDER": "Search bots...",
+    "NO_RESULTS": "No bots found matching your search",
    "GLOBAL_BOT": "System bot",
    "GLOBAL_BOT_BADGE": "System",
    "AVATAR": {
@@ -34,7 +37,8 @@
      "LOADING": "Fetching bots...",
      "TABLE_HEADER": {
        "DETAILS": "Bot Details",
-        "URL": "Webhook URL"
+        "URL": "Webhook URL",
+        "ACTIONS": "Actions"
      }
    },
    "DELETE": {
--- a/app/javascript/dashboard/i18n/locale/en/agentMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/en/agentMgmt.json
@@ -9,6 +9,7 @@
      "ADMINISTRATOR": "Administrator",
      "AGENT": "Agent"
    },
+    "COUNT": "{n} agent | {n} agents",
    "LIST": {
      "404": "There are no agents associated to this account",
      "TITLE": "Manage agents in your team",
@@ -96,6 +97,8 @@
        "ERROR_MESSAGE": "Could not connect to Woot Server, Please try again later"
      }
    },
+    "SEARCH_PLACEHOLDER": "Search agents...",
+    "NO_RESULTS": "No agents found matching your search",
    "SEARCH": {
      "NO_RESULTS": "No results found."
    },
--- a/app/javascript/dashboard/i18n/locale/en/attributesMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/en/attributesMgmt.json
@@ -5,6 +5,9 @@
    "LOADING": "Fetching custom attributes",
    "DESCRIPTION": "A custom attribute tracks additional details about your contacts or conversations—such as the subscription plan or the date of their first purchase. You can add different types of custom attributes, such as text, lists, or numbers, to capture the specific information you need.",
    "LEARN_MORE": "Learn more about custom attributes",
+    "COUNT": "{n} attribute | {n} attributes",
+    "SEARCH_PLACEHOLDER": "Search attributes...",
+    "NO_RESULTS": "No attributes found matching your search",
    "ATTRIBUTE_MODELS": {
      "CONVERSATION": "Conversation",
      "CONTACT": "Contact"
--- a/app/javascript/dashboard/i18n/locale/en/automation.json
+++ b/app/javascript/dashboard/i18n/locale/en/automation.json
@@ -3,8 +3,11 @@
    "HEADER": "Automation",
    "DESCRIPTION": "Automation can replace and streamline existing processes that require manual effort, such as adding labels and assigning conversations to the most suitable agent. This allows the team to focus on their strengths while reducing time spent on routine tasks.",
    "LEARN_MORE": "Learn more about automation",
-    "HEADER_BTN_TXT": "Add Automation Rule",
+    "COUNT": "{n} automation | {n} automations",
+    "HEADER_BTN_TXT": "Create Automation",
    "LOADING": "Fetching automation rules",
+    "SEARCH_PLACEHOLDER": "Search automation rules...",
+    "NO_RESULTS": "No automation rules found matching your search",
    "ADD": {
      "TITLE": "Add Automation Rule",
      "SUBMIT": "Create",
@@ -42,9 +45,9 @@
    "LIST": {
      "TABLE_HEADER": {
        "NAME": "Name",
-        "DESCRIPTION": "Description",
        "ACTIVE": "Active",
-        "CREATED_ON": "Created on"
+        "CREATED_ON": "Created on",
+        "ACTIONS": "Actions"
      },
      "404": "No automation rules found"
    },
--- a/app/javascript/dashboard/i18n/locale/en/cannedMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/en/cannedMgmt.json
@@ -3,8 +3,11 @@
    "HEADER": "Canned Responses",
    "LEARN_MORE": "Learn more about canned responses",
    "DESCRIPTION": "Canned Responses are pre-written reply templates that help you quickly respond to a conversation. Agents can type the '/' character followed by the shortcode to insert a canned response during a conversation. ",
+    "COUNT": "{n} canned response | {n} canned responses",
    "HEADER_BTN_TXT": "Add canned response",
    "LOADING": "Fetching canned responses...",
+    "SEARCH_PLACEHOLDER": "Search canned responses...",
+    "NO_RESULTS": "No canned responses found matching your search",
    "SEARCH_404": "There are no items matching this query.",
    "LIST": {
      "404": "There are no canned responses available in this account.",
--- a/app/javascript/dashboard/i18n/locale/en/customRole.json
+++ b/app/javascript/dashboard/i18n/locale/en/customRole.json
@@ -3,8 +3,11 @@
    "HEADER": "Custom Roles",
    "LEARN_MORE": "Learn more about custom roles",
    "DESCRIPTION": "Custom roles are roles that are created by the account owner or admin. These roles can be assigned to agents to define their access and permissions within the account. Custom roles can be created with specific permissions and access levels to suit the requirements of the organization.",
+    "COUNT": "{n} custom role | {n} custom roles",
    "HEADER_BTN_TXT": "Add custom role",
    "LOADING": "Fetching custom roles...",
+    "SEARCH_PLACEHOLDER": "Search custom roles...",
+    "NO_RESULTS": "No custom roles found matching your search",
    "SEARCH_404": "There are no items matching this query.",
    "PAYWALL": {
      "TITLE": "Upgrade to create custom roles",
--- a/app/javascript/dashboard/i18n/locale/en/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/en/inboxMgmt.json
@@ -3,6 +3,9 @@
    "HEADER": "Inboxes",
    "DESCRIPTION": "A channel is the mode of communication your customer chooses to interact with you. An inbox is where you manage interactions for a specific channel. It can include communications from various sources such as email, live chat, and social media.",
    "LEARN_MORE": "Learn more about inboxes",
+    "COUNT": "{n} inbox | {n} inboxes",
+    "SEARCH_PLACEHOLDER": "Search inboxes...",
+    "NO_RESULTS": "No inboxes found matching your search",
    "RECONNECTION_REQUIRED": "Your inbox is disconnected. You won't receive new messages until you reauthorize it.",
    "CLICK_TO_RECONNECT": "Click here to reconnect.",
    "WHATSAPP_REGISTRATION_INCOMPLETE": "Your WhatsApp Business registration isn’t complete. Please check your display name status in Meta Business Manager before reconnecting.",
@@ -575,7 +578,7 @@
          "SUBTITLE": "Use only the configured business name as the sender name in the email header."
        },
        "BUSINESS_NAME": {
-          "BUTTON_TEXT": "+ Configure your business name",
+          "BUTTON_TEXT": "Configure your business name",
          "PLACEHOLDER": "Enter your business name",
          "SAVE_BUTTON_TEXT": "Save"
        }
@@ -625,6 +628,8 @@
      "ACCOUNT_HEALTH": "Account Health",
      "CSAT": "CSAT"
    },
+    "CHANNEL_PREFERENCES": "Channel Preferences",
+    "WIDGET_FEATURES": "Widget features",
    "ACCOUNT_HEALTH": {
      "TITLE": "Manage your WhatsApp account",
      "DESCRIPTION": "Review your WhatsApp account status, messaging limits, and quality. Update settings or resolve issues if needed",
@@ -758,6 +763,7 @@
      "LABEL": "Help Center",
      "PLACEHOLDER": "Select Help Center",
      "SELECT_PLACEHOLDER": "Select Help Center",
+      "NONE": "None",
      "REMOVE": "Remove Help Center",
      "SUB_TEXT": "Attach a Help Center with the inbox"
    },
@@ -911,9 +917,11 @@
      "UNAVAILABLE_MESSAGE_LABEL": "Unavailable message for visitors",
      "TOGGLE_HELP": "Enabling business availability will show the available hours on live chat widget even if all the agents are offline. Outside available hours visitors can be warned with a message and a pre-chat form.",
      "DAY": {
+        "DAY": "Day",
+        "AVAILABILITY": "Availability",
+        "HOURS": "Hours",
        "ENABLE": "Enable availability for this day",
        "UNAVAILABLE": "Unavailable",
-        "HOURS": "hours",
        "VALIDATION_ERROR": "Starting time should be before closing time.",
        "CHOOSE": "Choose"
      },
@@ -1020,11 +1028,12 @@
          "IN_A_DAY": "In a day"
        },
        "WIDGET_COLOR_LABEL": "Widget Color",
-        "WIDGET_BUBBLE_POSITION_LABEL": "Widget Bubble Position",
-        "WIDGET_BUBBLE_TYPE_LABEL": "Widget Bubble Type",
+        "WIDGET_BUBBLE": "Bubble",
+        "WIDGET_BUBBLE_POSITION_LABEL": "Position:",
+        "WIDGET_BUBBLE_TYPE_LABEL": "Type:",
        "WIDGET_BUBBLE_LAUNCHER_TITLE": {
          "DEFAULT": "Chat with us",
-          "LABEL": "Widget Bubble Launcher Title",
+          "LABEL": "Launcher Title",
          "PLACE_HOLDER": "Chat with us"
        },
        "UPDATE": {
@@ -1049,7 +1058,7 @@
      },
      "WIDGET_SCREEN": {
        "DEFAULT": "Default",
-        "CHAT": "Chat"
+        "CHAT": "Chat mode"
      },
      "REPLY_TIME": {
        "IN_A_FEW_MINUTES": "Typically replies in a few minutes",
--- a/app/javascript/dashboard/i18n/locale/en/integrationApps.json
+++ b/app/javascript/dashboard/i18n/locale/en/integrationApps.json
@@ -3,6 +3,9 @@
    "FETCHING": "Fetching Integrations",
    "NO_HOOK_CONFIGURED": "There are no {integrationId} integrations configured in this account.",
    "HEADER": "Applications",
+    "COUNT": "{n} integration | {n} integrations",
+    "SEARCH_PLACEHOLDER": "Search...",
+    "NO_RESULTS": "No results found matching your search",
    "STATUS": {
      "ENABLED": "Enabled",
      "DISABLED": "Disabled"
@@ -31,6 +34,7 @@
    "LIST": {
      "FETCHING": "Fetching integration hooks",
      "INBOX": "Inbox",
+      "ACTIONS": "Actions",
      "DELETE": {
        "BUTTON_TEXT": "Delete"
      }
--- a/app/javascript/dashboard/i18n/locale/en/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/en/integrations.json
@@ -1,6 +1,7 @@
 {
  "INTEGRATION_SETTINGS": {
    "SHOPIFY": {
+      "HEADER": "Shopify",
      "DELETE": {
        "TITLE": "Delete Shopify Integration",
        "MESSAGE": "Are you sure you want to delete the Shopify integration?"
@@ -19,6 +20,8 @@
    "DESCRIPTION": "Chatwoot integrates with multiple tools and services to improve your team's efficiency. Explore the list below to configure your favorite apps.",
    "LEARN_MORE": "Learn more about integrations",
    "LOADING": "Fetching integrations",
+    "SEARCH_PLACEHOLDER": "Search integrations...",
+    "NO_RESULTS": "No integrations found matching your search",
    "CAPTAIN": {
      "DISABLED": "Captain is not enabled on your account.",
      "CLICK_HERE_TO_CONFIGURE": "Click here to configure",
@@ -28,6 +31,9 @@
    "WEBHOOK": {
      "SUBSCRIBED_EVENTS": "Subscribed Events",
      "LEARN_MORE": "Learn more about webhooks",
+      "COUNT": "{n} webhook | {n} webhooks",
+      "SEARCH_PLACEHOLDER": "Search webhooks...",
+      "NO_RESULTS": "No webhooks found matching your search",
      "FORM": {
        "CANCEL": "Cancel",
        "DESC": "Webhook events provide you the realtime information about what's happening in your Chatwoot account. Please enter a valid URL to configure a callback.",
@@ -104,6 +110,7 @@
      }
    },
    "SLACK": {
+      "HEADER": "Slack",
      "DELETE": "Delete",
      "DELETE_CONFIRMATION": {
        "TITLE": "Delete the integration",
@@ -223,10 +230,17 @@
      "SIDEBAR_TXT": "<p><b>Dashboard Apps</b></p><p>Dashboard Apps allow organizations to embed an application inside the Chatwoot dashboard to provide the context for customer support agents. This feature allows you to create an application independently and embed that inside the dashboard to provide user information, their orders, or their previous payment history.</p><p>When you embed your application using the dashboard in Chatwoot, your application will get the context of the conversation and contact as a window event. Implement a listener for the message event on your page to receive the context.</p><p>To add a new dashboard app, click on the button 'Add a new dashboard app'.</p>",
      "DESCRIPTION": "Dashboard Apps allow organizations to embed an application inside the dashboard to provide the context for customer support agents. This feature allows you to create an application independently and embed that to provide user information, their orders, or their previous payment history.",
      "LEARN_MORE": "Learn more about Dashboard Apps",
+      "COUNT": "{n} dashboard app | {n} dashboard apps",
+      "SEARCH_PLACEHOLDER": "Search dashboard apps...",
+      "NO_RESULTS": "No dashboard apps found matching your search",
      "LIST": {
        "404": "There are no dashboard apps configured on this account yet",
        "LOADING": "Fetching dashboard apps...",
-        "TABLE_HEADER": { "NAME": "Name", "ENDPOINT": "Endpoint" },
+        "TABLE_HEADER": {
+          "NAME": "Name",
+          "ENDPOINT": "Endpoint",
+          "ACTIONS": "Actions"
+        },
        "EDIT_TOOLTIP": "Edit app",
        "DELETE_TOOLTIP": "Delete app"
      },
@@ -262,6 +276,7 @@
      }
    },
    "LINEAR": {
+      "HEADER": "Linear",
      "ADD_OR_LINK_BUTTON": "Create/Link Linear Issue",
      "LOADING": "Fetching linear issues...",
      "LOADING_ERROR": "There was an error fetching the linear issues, please try again",
@@ -356,6 +371,7 @@
      }
    },
    "NOTION": {
+      "HEADER": "Notion",
      "DELETE": {
        "TITLE": "Are you sure you want to delete the Notion integration?",
        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
--- a/app/javascript/dashboard/i18n/locale/en/labelsMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/en/labelsMgmt.json
@@ -5,6 +5,9 @@
    "LOADING": "Fetching labels",
    "DESCRIPTION": "Labels help you categorize and prioritize conversations and leads. You can assign a label to a conversation or contact using the side panel.",
    "LEARN_MORE": "Learn more about labels",
+    "COUNT": "{n} label | {n} labels",
+    "SEARCH_PLACEHOLDER": "Search labels...",
+    "NO_RESULTS": "No labels found matching your search",
    "SEARCH_404": "There are no items matching this query",
    "LIST": {
      "404": "There are no labels available in this account.",
@@ -13,7 +16,8 @@
      "TABLE_HEADER": {
        "NAME": "Name",
        "DESCRIPTION": "Description",
-        "COLOR": "Color"
+        "COLOR": "Color",
+        "ACTION": "Actions"
      }
    },
    "FORM": {
--- a/app/javascript/dashboard/i18n/locale/en/macros.json
+++ b/app/javascript/dashboard/i18n/locale/en/macros.json
@@ -3,9 +3,12 @@
    "HEADER": "Macros",
    "DESCRIPTION": "A macro is a set of saved actions that help customer service agents easily complete tasks. The agents can define a set of actions like tagging a conversation with a label, sending an email transcript, updating a custom attribute, etc., and they can run these actions in a single click.",
    "LEARN_MORE": "Learn more about macros",
+    "COUNT": "{n} macro | {n} macros",
    "HEADER_BTN_TXT": "Add a new macro",
    "HEADER_BTN_TXT_SAVE": "Save macro",
    "LOADING": "Fetching macros",
+    "SEARCH_PLACEHOLDER": "Search macros...",
+    "NO_RESULTS": "No macros found matching your search",
    "ERROR": "Something went wrong. Please try again",
    "ORDER_INFO": "Macros will run in the order you add your actions. You can rearrange them by dragging them by the handle beside each node.",
    "ADD": {
@@ -29,7 +32,8 @@
        "NAME": "Name",
        "CREATED BY": "Created by",
        "LAST_UPDATED_BY": "Last updated by",
-        "VISIBILITY": "Visibility"
+        "VISIBILITY": "Visibility",
+        "ACTIONS": "Actions"
      },
      "404": "No macros found"
    },
--- a/app/javascript/dashboard/i18n/locale/en/mfa.json
+++ b/app/javascript/dashboard/i18n/locale/en/mfa.json
@@ -1,7 +1,7 @@
 {
  "MFA_SETTINGS": {
    "TITLE": "Two-Factor Authentication",
-    "SUBTITLE": "Secure your account with TOTP-based authentication",
+    "SUBTITLE": "Protect your account from unauthorized access with TOTP-based authentication. This adds an extra layer of security to your account.",
    "DESCRIPTION": "Add an extra layer of security to your account using a time-based one-time password (TOTP)",
    "STATUS_TITLE": "Authentication Status",
    "STATUS_DESCRIPTION": "Manage your two-factor authentication settings and backup recovery codes",
--- a/app/javascript/dashboard/i18n/locale/en/sla.json
+++ b/app/javascript/dashboard/i18n/locale/en/sla.json
@@ -5,7 +5,12 @@
    "ADD_ACTION_LONG": "Create a new SLA Policy",
    "DESCRIPTION": "Service Level Agreements (SLAs) are contracts that define clear expectations between your team and customers. They establish standards for response and resolution times, creating a framework for accountability and ensures a consistent, high-quality experience.",
    "LEARN_MORE": "Learn more about SLA",
+    "COUNT": "{n} SLA | {n} SLAs",
    "LOADING": "Fetching SLAs",
+    "SEARCH_PLACEHOLDER": "Search SLA...",
+    "SEARCH": {
+      "NO_RESULTS": "No SLA found matching your search"
+    },
    "PAYWALL": {
      "TITLE": "Upgrade to create SLAs",
      "AVAILABLE_ON": "The SLA feature is only available in the Business and Enterprise plans.",
@@ -20,14 +25,18 @@
    },
    "LIST": {
      "404": "There are no SLAs available in this account.",
+      "TABLE_HEADER": {
+        "SLA": "SLA",
+        "BUSINESS_HOURS": "Business hours"
+      },
      "EMPTY": {
        "TITLE_1": "Enterprise P0",
        "DESC_1": "Issues raised by enterprise customers, that require immediate attention.",
        "TITLE_2": "Enterprise P1",
        "DESC_2": "Issues raised by enterprise customers, that needs to be acknowledged quickly."
      },
-      "BUSINESS_HOURS_ON": "Business hours on",
-      "BUSINESS_HOURS_OFF": "Business hours off",
+      "BUSINESS_HOURS_ON": "Turned on",
+      "BUSINESS_HOURS_OFF": "Turned off",
      "RESPONSE_TYPES": {
        "FRT": "First response time threshold",
        "NRT": "Next response time threshold",
--- a/app/javascript/dashboard/i18n/locale/en/teamsSettings.json
+++ b/app/javascript/dashboard/i18n/locale/en/teamsSettings.json
@@ -5,6 +5,9 @@
    "LOADING": "Fetching teams",
    "DESCRIPTION": "Teams allow you to organize agents into groups based on their responsibilities. An agent can belong to multiple teams. When working collaboratively, you can assign conversations to specific teams.",
    "LEARN_MORE": "Learn more about teams",
+    "COUNT": "{n} team | {n} teams",
+    "SEARCH_PLACEHOLDER": "Search teams...",
+    "NO_RESULTS": "No teams found matching your search",
    "LIST": {
      "404": "There are no teams created on this account.",
      "EDIT_TEAM": "Edit team",
@@ -64,8 +67,8 @@
      "ERROR_MESSAGE": "Couldn't save the team details. Try again."
    },
    "AGENTS": {
-      "AGENT": "AGENT",
-      "EMAIL": "EMAIL",
+      "AGENT": "Agent",
+      "EMAIL": "Email",
      "BUTTON_TEXT": "Add agents",
      "ADD_AGENTS": "Adding Agents to your Team...",
      "SELECT": "select",