Merge branch 'develop' into codex/freeze-sla-miss-timers

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

@@ -848,8 +848,8 @@
       "WHATSAPP_TEMPLATES_SYNC_SUCCESS": "Templates sync initiated successfully. It may take a couple of minutes to update.",
       "WHATSAPP_MANUAL_MIGRATION": {
         "BANNER": {
-          "TITLE": "WhatsApp setup action required",
-          "DESCRIPTION": "Meta restrictions are affecting WhatsApp setup and management features. Reconnect this inbox manually to keep your WhatsApp configuration up to date.",
+          "TITLE": "Manual setup recommended",
+          "DESCRIPTION": "This inbox connects through the shared Meta app used for embedded signup, which recent Meta restrictions have affected. To avoid similar issues in the future, we recommend reconnecting it with your own Meta app.",
           "START": "Start manual migration",
           "GUIDE": "View guide"
         },
@@ -857,8 +857,8 @@
           "EYEBROW": "WhatsApp manual migration",
           "TITLE": "Reconnect WhatsApp inbox",
           "CLOSE": "Close",
-          "ACTION_REQUIRED_TITLE": "Action required for this WhatsApp inbox",
-          "ACTION_REQUIRED_DESCRIPTION": "Meta restrictions are affecting setup and management features. This guided flow updates the WhatsApp API connection without creating a new inbox.",
+          "ACTION_REQUIRED_TITLE": "Reconnect with your own Meta app",
+          "ACTION_REQUIRED_DESCRIPTION": "Inboxes connected through your own Meta app are not affected by restrictions on the shared embedded signup app. This guided flow updates the WhatsApp API connection without creating a new inbox.",
           "GUIDE_LINK": "Open the manual setup guide",
           "PRESERVED_TITLE": "Preserved",
           "PRESERVED_DESCRIPTION": "Conversations, contacts, collaborators, routing, business hours, and inbox settings.",

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

@@ -387,12 +387,10 @@ export default {
       return this.inbox.provider_config?.source === 'embedded_signup';
     },
     whatsappUnauthorized() {
-      // The manual migration banner supersedes the embedded-signup reauthorize flow when the feature is enabled.
       return (
         this.isAWhatsAppCloudChannel &&
         this.isEmbeddedSignupWhatsApp &&
-        this.inbox.reauthorization_required &&
-        !this.showWhatsAppManualMigration
+        this.inbox.reauthorization_required
       );
     },
     whatsappRegistrationIncomplete() {

app/javascript/dashboard/routes/dashboard/settings/inbox/components/WhatsappManualMigrationBanner.vue

@@ -21,14 +21,14 @@ const copy = computed(() => ({
 </script>
 
 <template>
-  <Banner color="amber" :action-label="copy.start" @action="emit('start')">
+  <Banner color="blue" :action-label="copy.start" @action="emit('start')">
     <div class="flex items-start gap-2">
       <Icon
-        icon="i-lucide-triangle-alert"
-        class="flex-shrink-0 mt-0.5 size-4 text-n-amber-11"
+        icon="i-lucide-info"
+        class="flex-shrink-0 mt-0.5 size-4 text-n-blue-11"
       />
       <div class="flex flex-col gap-0.5">
-        <span class="font-medium text-n-amber-12">{{ copy.title }}</span>
+        <span class="font-medium text-n-blue-12">{{ copy.title }}</span>
         <span>
           {{ copy.description }}
           <a

app/javascript/dashboard/routes/dashboard/settings/inbox/components/WhatsappManualMigrationDialog.vue

@@ -310,9 +310,9 @@ defineExpose({ open, close });
               class="flex gap-3 p-3 border rounded-xl border-n-weak bg-n-alpha-2"
             >
               <span
-                class="grid flex-shrink-0 rounded-lg size-8 place-content-center bg-n-amber-3 text-n-amber-11"
+                class="grid flex-shrink-0 rounded-lg size-8 place-content-center bg-n-blue-3 text-n-blue-11"
               >
-                <Icon icon="i-lucide-triangle-alert" class="size-4" />
+                <Icon icon="i-lucide-info" class="size-4" />
               </span>
               <div>
                 <h4 class="mt-0 mb-1 text-base font-medium text-n-slate-12">

app/javascript/dashboard/store/modules/conversationStats.js

@@ -25,24 +25,32 @@ const fetchMetaData = async (commit, params) => {
   }
 };
 
-const debouncedFetchMetaData = debounce(fetchMetaData, 500, false, 2000);
-const longDebouncedFetchMetaData = debounce(fetchMetaData, 5000, false, 10000);
+const debouncedFetchMetaData = debounce(fetchMetaData, 1000, false, 5000);
+const longDebouncedFetchMetaData = debounce(fetchMetaData, 7500, false, 20000);
 const superLongDebouncedFetchMetaData = debounce(
   fetchMetaData,
-  10000,
+  15000,
   false,
-  20000
+  30000
 );
 
+const metaDebouncers = {
+  default: debouncedFetchMetaData,
+  long: longDebouncedFetchMetaData,
+  superLong: superLongDebouncedFetchMetaData,
+};
+
+// allCount is 0 until a meta request succeeds; under load it stays 0, so treat
+// the unknown case as a large account and poll slowest instead of fastest.
+export const getMetaDebounceKey = allCount => {
+  if (allCount > 2000 || allCount === 0) return 'superLong';
+  if (allCount > 100) return 'long';
+  return 'default';
+};
+
 export const actions = {
-  get: async ({ commit, state: $state }, params) => {
-    if ($state.allCount > 2000) {
-      superLongDebouncedFetchMetaData(commit, params);
-    } else if ($state.allCount > 100) {
-      longDebouncedFetchMetaData(commit, params);
-    } else {
-      debouncedFetchMetaData(commit, params);
-    }
+  get: ({ commit, state: $state }, params) => {
+    metaDebouncers[getMetaDebounceKey($state.allCount)](commit, params);
   },
   set({ commit }, meta) {
     commit(types.SET_CONV_TAB_META, meta);

app/javascript/widget/App.vue

@@ -66,6 +66,9 @@ export default {
         ? getLanguageDirection(this.$root.$i18n.locale)
         : false;
     },
+    isUnreadOrCampaignView() {
+      return ['unread-messages', 'campaigns'].includes(this.$route.name);
+    },
   },
   watch: {
     activeCampaign() {
@@ -374,6 +377,7 @@ export default {
       'is-widget-right': isRightAligned,
       'is-bubble-hidden': hideMessageBubble,
       'is-flat-design': isWidgetStyleFlat,
+      'bg-n-slate-2 dark:bg-n-solid-1': !isUnreadOrCampaignView,
       dark: prefersDarkMode,
     }"
   >

app/javascript/widget/views/ArticleViewer.vue

@@ -10,7 +10,7 @@ export default {
 </script>
 
 <template>
-  <div class="bg-white h-full">
+  <div class="bg-n-solid-1 h-full">
     <IframeLoader :url="$route.query.link" />
   </div>
 </template>

app/views/layouts/portal.html.erb

@@ -3,9 +3,9 @@
   <head>
     <%= render 'layouts/portal_head' %>
   </head>
-  <body class="font-default">
+  <body class="font-default bg-white dark:bg-slate-900">
     <div id="portal" class="antialiased">
-      <main class="flex flex-col min-h-screen bg-white main-content dark:bg-slate-900" role="main">
+      <main class="flex flex-col min-h-screen main-content" role="main">
         <%= render 'public/api/v1/portals/header', portal: @portal unless @is_plain_layout_enabled %>
         <%= yield %>
         <%= render 'public/api/v1/portals/footer' unless @is_plain_layout_enabled || @portal.account.feature_enabled?('disable_branding') %>