From 429567495f297488c565875b19bf6d4cd5da59fb Mon Sep 17 00:00:00 2001
From: Rodribm10 <rodrigobm10@me.com>
Date: Sun, 26 Apr 2026 09:14:44 -0300
Subject: [PATCH] =?UTF-8?q?fix(reports):=20inbox=5Fid=20reativo=20+=20nome?=
 =?UTF-8?q?=20da=20inbox=20vis=C3=ADvel=20na=20tab=20Novas=20=C3=97=20Reto?=
 =?UTF-8?q?rno?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Bugs originais (tabela Reports → Inbox → unidade específica → Novas × Retorno):
1. Backend recebia sempre inbox_id=1 — useFunctionGetter('inboxes/getInboxById', route.params.id)
   passava string crua, não Ref reativa, então o getter ficava travado no ID inicial
2. UX: tab não mostrava qual unidade estava sendo filtrada

Correções:
- InboxReportsShow.vue: passa inboxIdParam computed pra useFunctionGetter (reativo agora)
- Passa inbox.name como prop pro InboxLeadsReport
- InboxLeadsReport.vue: header com título + label "Caixa de entrada: <nome>" no topo

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 .../dashboard/i18n/locale/en/report.json       |  2 ++
 .../dashboard/i18n/locale/pt_BR/report.json    |  2 ++
 .../settings/reports/InboxReportsShow.vue      |  6 ++++--
 .../reports/components/InboxLeadsReport.vue    | 18 +++++++++++++++++-
 4 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/app/javascript/dashboard/i18n/locale/en/report.json b/app/javascript/dashboard/i18n/locale/en/report.json
index 003cb72af..3cdc09275 100644
--- a/app/javascript/dashboard/i18n/locale/en/report.json
+++ b/app/javascript/dashboard/i18n/locale/en/report.json
@@ -286,6 +286,8 @@
       "LEADS": "New × Returning"
     },
     "LEADS": {
+      "TITLE": "New × Returning",
+      "INBOX_LABEL": "Inbox:",
       "EMPTY": "No conversations in this period.",
       "TOTAL": "Total conversations in the period: {count}",
       "METRICS": {
diff --git a/app/javascript/dashboard/i18n/locale/pt_BR/report.json b/app/javascript/dashboard/i18n/locale/pt_BR/report.json
index de38aaf93..f9c717f34 100644
--- a/app/javascript/dashboard/i18n/locale/pt_BR/report.json
+++ b/app/javascript/dashboard/i18n/locale/pt_BR/report.json
@@ -276,6 +276,8 @@
       "LEADS": "Novas × Retorno"
     },
     "LEADS": {
+      "TITLE": "Novas × Retorno",
+      "INBOX_LABEL": "Caixa de entrada:",
       "EMPTY": "Sem conversas no período.",
       "TOTAL": "Total de conversas no período: {count}",
       "METRICS": {
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/InboxReportsShow.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/InboxReportsShow.vue
index c2e4ccb10..5a82c2ab9 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/InboxReportsShow.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/InboxReportsShow.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref } from 'vue';
+import { computed, ref } from 'vue';
 import { useRoute } from 'vue-router';
 import { useFunctionGetter } from 'dashboard/composables/store';
 
@@ -8,7 +8,8 @@ import InboxLeadsReport from './components/InboxLeadsReport.vue';
 import Spinner from 'dashboard/components-next/spinner/Spinner.vue';
 
 const route = useRoute();
-const inbox = useFunctionGetter('inboxes/getInboxById', route.params.id);
+const inboxIdParam = computed(() => route.params.id);
+const inbox = useFunctionGetter('inboxes/getInboxById', inboxIdParam);
 
 const TABS = {
   OVERVIEW: 'overview',
@@ -63,6 +64,7 @@ const activeTab = ref(TABS.OVERVIEW);
         v-else-if="activeTab === TABS.LEADS"
         :key="`leads-${inbox.id}`"
         :inbox-id="inbox.id"
+        :inbox-name="inbox.name"
       />
     </div>
   </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/InboxLeadsReport.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/InboxLeadsReport.vue
index 80bfa08a0..9278aae29 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/InboxLeadsReport.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/InboxLeadsReport.vue
@@ -13,6 +13,10 @@ const props = defineProps({
     type: [Number, String],
     required: true,
   },
+  inboxName: {
+    type: String,
+    default: '',
+  },
 });
 
 const store = useStore();
@@ -85,7 +89,7 @@ const chartOptions = {
 };
 
 const fetchData = () => {
-  if (!filters.value.from || !filters.value.to) return;
+  if (!filters.value.from || !filters.value.to || !props.inboxId) return;
   store.dispatch('fetchInboxLeadsSummary', {
     inboxId: props.inboxId,
     from: filters.value.from,
@@ -111,6 +115,18 @@ watch(
 
 <template>
   <div class="flex flex-col gap-6">
+    <div class="flex items-center justify-between">
+      <div>
+        <h2 class="text-base font-semibold text-n-slate-12 m-0">
+          {{ $t('INBOX_REPORTS.LEADS.TITLE') }}
+        </h2>
+        <p v-if="inboxName" class="text-sm text-n-slate-11 mt-1 mb-0">
+          <span>{{ $t('INBOX_REPORTS.LEADS.INBOX_LABEL') }}</span>
+          <span class="font-medium text-n-slate-12 ms-1">{{ inboxName }}</span>
+        </p>
+      </div>
+    </div>
+
     <ReportFilters
       filter-type="inboxes"
       :selected-item="{ id: Number(inboxId) }"