fix(reports): inbox_id reativo + nome da inbox visível na tab Novas × Retorno

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>

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": {

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": {

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>

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) }"