From 0a3e1a0130ff5ba90c15c477a55a19402b8ce9c0 Mon Sep 17 00:00:00 2001
From: codex-bot <bot@local>
Date: Tue, 21 Oct 2025 15:06:38 -0300
Subject: [PATCH] chore(ui): finalize hour/date formatting rollout; adjust
 contracted hours display; clean up unused formatter

---
 src/components/reports/hours-report.tsx | 11 ++---------
 src/components/reports/sla-report.tsx   | 14 ++++++++++----
 2 files changed, 12 insertions(+), 13 deletions(-)

diff --git a/src/components/reports/hours-report.tsx b/src/components/reports/hours-report.tsx
index bfb7ade..7d75ba2 100644
--- a/src/components/reports/hours-report.tsx
+++ b/src/components/reports/hours-report.tsx
@@ -64,14 +64,7 @@ export function HoursReport() {
     )
   }, [filtered])
 
-  const numberFormatter = useMemo(
-    () =>
-      new Intl.NumberFormat("pt-BR", {
-        minimumFractionDigits: 2,
-        maximumFractionDigits: 2,
-      }),
-    []
-  )
+  // No number formatter needed; we use formatHoursCompact for hours
 
   const filteredWithComputed = useMemo(
     () =>
@@ -228,7 +221,7 @@ export function HoursReport() {
                     <div className="flex items-center justify-between text-xs text-neutral-500">
                       <span>Contratadas/mês</span>
                       <span className="font-medium text-neutral-800">
-                        {row.contracted ? `${numberFormatter.format(row.contracted)} h` : "—"}
+                        {row.contracted ? formatHoursCompact(row.contracted) : "—"}
                       </span>
                     </div>
                     <div className="space-y-1">
diff --git a/src/components/reports/sla-report.tsx b/src/components/reports/sla-report.tsx
index 2772202..4e44b7f 100644
--- a/src/components/reports/sla-report.tsx
+++ b/src/components/reports/sla-report.tsx
@@ -19,6 +19,12 @@ import { Area, AreaChart, Bar, BarChart, CartesianGrid, XAxis } from "recharts"
 import { ChartContainer, ChartTooltip, ChartTooltipContent } from "@/components/ui/chart"
 import { formatDateDM, formatDateDMY, formatHoursCompact } from "@/lib/utils"
 
+const agentProductivityChartConfig = {
+  resolved: {
+    label: "Chamados resolvidos",
+  },
+}
+
 function formatMinutes(value: number | null) {
   if (value === null) return "—"
   if (value < 60) return `${value.toFixed(0)} min`
@@ -300,15 +306,15 @@ export function SlaReport() {
             <div className="grid gap-6 md:grid-cols-2">
               <div className="space-y-3">
                 <p className="text-xs text-neutral-500">Resolvidos por agente</p>
-                <ChartContainer config={{}} className="aspect-auto h-[260px] w-full">
+                <ChartContainer config={agentProductivityChartConfig} className="aspect-auto h-[260px] w-full">
                   <BarChart
                     data={agents.items.slice(0, 10).map((a) => ({ name: a.name || a.email || 'Agente', resolved: a.resolved }))}
-                    margin={{ left: 12, right: 12, bottom: 28 }}
+                    margin={{ top: 8, left: 20, right: 20, bottom: 56 }}
                   >
                     <CartesianGrid vertical={false} />
-                    <XAxis dataKey="name" tickLine={false} axisLine={false} tickMargin={14} interval={0} angle={-30} height={68} />
+                    <XAxis dataKey="name" tickLine={false} axisLine={false} tickMargin={24} interval={0} angle={-30} height={80} />
                     <Bar dataKey="resolved" fill="var(--chart-1)" radius={[4, 4, 0, 0]} />
-                    <ChartTooltip content={<ChartTooltipContent className="w-[180px]" nameKey="Resolvidos" />} />
+                    <ChartTooltip content={<ChartTooltipContent className="w-[180px]" nameKey="resolved" />} />
                   </BarChart>
                 </ChartContainer>
               </div>