From fba9686fdb81cbf6c26ae4970c6c26438c399e80 Mon Sep 17 00:00:00 2001
From: Felipe Coutinho <felipi@live.com>
Date: Sat, 11 Apr 2026 22:43:38 +0000
Subject: [PATCH] =?UTF-8?q?feat(dashboard):=20tend=C3=AAncias=20top=2010?=
 =?UTF-8?q?=20e=20padroniza=C3=A7=C3=A3o=20de=20espa=C3=A7amento=20do=20in?=
 =?UTF-8?q?box?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../components/category-trends-widget.tsx     |  2 +-
 .../dashboard/components/inbox-widget.tsx     | 73 ++++++++++---------
 .../dashboard/widgets/widgets-config.tsx      |  2 +-
 3 files changed, 39 insertions(+), 38 deletions(-)

diff --git a/src/features/dashboard/components/category-trends-widget.tsx b/src/features/dashboard/components/category-trends-widget.tsx
index 4459ef5..28feb43 100644
--- a/src/features/dashboard/components/category-trends-widget.tsx
+++ b/src/features/dashboard/components/category-trends-widget.tsx
@@ -24,7 +24,7 @@ export function CategoryTrendsWidget({
 			(a, b) =>
 				Math.abs(b.percentageChange ?? 0) - Math.abs(a.percentageChange ?? 0),
 		)
-		.slice(0, 6);
+		.slice(0, 10);
 
 	if (trending.length === 0) {
 		return (
diff --git a/src/features/dashboard/components/inbox-widget.tsx b/src/features/dashboard/components/inbox-widget.tsx
index d3b897a..d87a0a9 100644
--- a/src/features/dashboard/components/inbox-widget.tsx
+++ b/src/features/dashboard/components/inbox-widget.tsx
@@ -157,7 +157,7 @@ export function InboxWidget({
 	}
 
 	return (
-		<div className="space-y-1">
+		<div className="flex flex-col">
 			{snapshot.recentItems.map((item) => {
 				const displayName = item.parsedName ?? item.originalText.slice(0, 40);
 				const parsedAmount =
@@ -174,58 +174,59 @@ export function InboxWidget({
 				const displayLogo = logoSrc ?? DEFAULT_INBOX_APP_LOGO;
 
 				return (
-					<div key={item.id} className="-mx-2 rounded-md p-2">
-						<div className="flex items-center gap-2">
+					<div
+						key={item.id}
+						className="flex items-center justify-between py-1.5"
+					>
+						<div className="flex min-w-0 flex-1 items-center gap-2 py-1">
 							<Image
 								src={displayLogo}
 								alt={item.sourceAppName ?? ""}
-								width={36}
-								height={36}
-								className="size-9 shrink-0 rounded-full object-contain"
+								width={38}
+								height={38}
+								className="size-9.5 shrink-0 rounded-full object-contain"
 								unoptimized
 							/>
 
-							<div className="min-w-0 flex-1">
+							<div className="min-w-0">
 								<p className="truncate text-sm font-medium text-foreground">
 									{displayName}
 								</p>
-								<div className="flex items-center gap-2">
-									{item.sourceAppName && (
-										<span className="text-xs text-muted-foreground">
-											{item.sourceAppName}
-										</span>
-									)}
-									<span className="text-xs text-muted-foreground/60">
+								<div className="flex items-center gap-2 text-xs text-muted-foreground">
+									{item.sourceAppName && <span>{item.sourceAppName}</span>}
+									<span className="text-muted-foreground/60">
 										{relativeTime(item.createdAt)}
 									</span>
-									<div className="flex items-center">
-										<Button
-											size="icon-sm"
-											variant="ghost"
-											className="size-6 text-muted-foreground hover:text-foreground"
-											onClick={() => handleProcessRequest(item)}
-											aria-label="Processar notificação"
-											title="Processar"
-										>
-											<RiCheckLine className="size-3.5" />
-										</Button>
-										<Button
-											size="icon-sm"
-											variant="ghost"
-											className="size-6 text-muted-foreground hover:text-destructive"
-											onClick={() => handleDiscardRequest(item)}
-											aria-label="Descartar notificação"
-											title="Descartar"
-										>
-											<RiDeleteBinLine className="size-3.5" />
-										</Button>
-									</div>
 								</div>
 							</div>
+						</div>
 
+						<div className="flex shrink-0 flex-col items-end">
 							{amount !== null && (
 								<MoneyValues className="font-medium" amount={amount} />
 							)}
+							<div className="flex items-center">
+								<Button
+									size="icon-sm"
+									variant="ghost"
+									className="size-6 text-muted-foreground hover:text-foreground"
+									onClick={() => handleProcessRequest(item)}
+									aria-label="Processar notificação"
+									title="Processar"
+								>
+									<RiCheckLine className="size-3.5" />
+								</Button>
+								<Button
+									size="icon-sm"
+									variant="ghost"
+									className="size-6 text-muted-foreground hover:text-destructive"
+									onClick={() => handleDiscardRequest(item)}
+									aria-label="Descartar notificação"
+									title="Descartar"
+								>
+									<RiDeleteBinLine className="size-3.5" />
+								</Button>
+							</div>
 						</div>
 					</div>
 				);
diff --git a/src/features/dashboard/widgets/widgets-config.tsx b/src/features/dashboard/widgets/widgets-config.tsx
index f0fc06b..04d6c9f 100644
--- a/src/features/dashboard/widgets/widgets-config.tsx
+++ b/src/features/dashboard/widgets/widgets-config.tsx
@@ -163,7 +163,7 @@ export const widgetsConfig: WidgetConfig[] = [
 	{
 		id: "category-trends",
 		title: "Tendências de Categorias",
-		subtitle: "Top 6 maiores variações vs. mês anterior",
+		subtitle: "Top 10 maiores variações vs. mês anterior",
 		icon: <RiLineChartLine className="size-4" />,
 		component: ({ data }) => (
 			<CategoryTrendsWidget