From bdb3908dabee9b67ee3ac2f98912331f25189ab0 Mon Sep 17 00:00:00 2001
From: Felipe Coutinho <felipi@live.com>
Date: Sat, 21 Mar 2026 14:04:34 +0000
Subject: [PATCH] =?UTF-8?q?fix:=20m=C3=A9dia=20em=20category-trends=20igno?=
 =?UTF-8?q?ra=20meses=20sem=20gastos?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Corrige o cálculo da coluna Média para dividir apenas pelo número de
meses com valores > 0, evitando distorção causada por meses sem
movimentação. Adiciona ícone de informação com tooltip explicativo
no cabeçalho da coluna.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../reports/components/category-table.tsx     | 39 +++++++++++++++++--
 1 file changed, 35 insertions(+), 4 deletions(-)

diff --git a/src/features/reports/components/category-table.tsx b/src/features/reports/components/category-table.tsx
index 5b54be6..b05dc29 100644
--- a/src/features/reports/components/category-table.tsx
+++ b/src/features/reports/components/category-table.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import { RiInformationLine } from "@remixicon/react";
 import Link from "next/link";
 import { useMemo } from "react";
 import { formatPeriodLabel } from "@/features/reports/utils";
@@ -15,6 +16,11 @@ import {
 	TableHeader,
 	TableRow,
 } from "@/shared/components/ui/table";
+import {
+	Tooltip,
+	TooltipContent,
+	TooltipTrigger,
+} from "@/shared/components/ui/tooltip";
 import type { CategoryReportItem } from "@/shared/lib/types/reports";
 import { formatCurrency } from "@/shared/utils/currency";
 import { formatPeriodForUrl } from "@/shared/utils/period";
@@ -35,7 +41,6 @@ export function CategoryTable({
 	const sectionTotals = useMemo(() => {
 		const totalsMap = new Map<string, number>();
 		let grandTotal = 0;
-		const periodCount = Math.max(periods.length, 1);
 
 		for (const category of categories) {
 			grandTotal += category.total;
@@ -46,10 +51,15 @@ export function CategoryTable({
 			}
 		}
 
+		const nonZeroPeriodCount = periods.filter(
+			(p) => (totalsMap.get(p) ?? 0) > 0,
+		).length;
+
 		return {
 			totalsMap,
 			grandTotal,
-			averageMonthlyTotal: grandTotal / periodCount,
+			averageMonthlyTotal:
+				nonZeroPeriodCount > 0 ? grandTotal / nonZeroPeriodCount : 0,
 		};
 	}, [categories, periods]);
 
@@ -74,7 +84,21 @@ export function CategoryTable({
 							</TableHead>
 						))}
 						<TableHead className="text-right min-w-[140px] font-bold">
-							Média
+							<div className="flex items-center justify-end gap-1">
+								Média
+								<Tooltip>
+									<TooltipTrigger asChild>
+										<span className="cursor-default inline-flex">
+											<RiInformationLine className="size-3.5 text-muted-foreground" />
+										</span>
+									</TooltipTrigger>
+									<TooltipContent side="top" className="max-w-[280px]">
+										A média considera apenas os meses com gastos registrados
+										(valores maiores que zero). Meses sem movimentação não
+										entram no cálculo.
+									</TooltipContent>
+								</Tooltip>
+							</div>
 						</TableHead>
 						<TableHead className="text-right min-w-[120px] font-bold">
 							Total
@@ -126,7 +150,14 @@ export function CategoryTable({
 									);
 								})}
 								<TableCell className="text-right font-semibold text-info">
-									{formatCurrency(category.total / Math.max(periods.length, 1))}
+									{(() => {
+										const nonZeroCount = periods.filter(
+											(p) => (category.monthlyData.get(p)?.amount ?? 0) > 0,
+										).length;
+										return formatCurrency(
+											nonZeroCount > 0 ? category.total / nonZeroCount : 0,
+										);
+									})()}
 								</TableCell>
 								<TableCell className="text-right font-semibold">
 									{formatCurrency(category.total)}