From 1d45dd3649825b6b39b926a3cf23d0cf3f09fca8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cau=C3=AA=20Faleiros?= <cauefaleiros@gmail.com>
Date: Wed, 6 May 2026 14:07:10 -0300
Subject: [PATCH] fix: force all X-axis labels to display on charts and prevent
 cutoff

---
 src/pages/Dashboard.tsx      | 6 ++++--
 src/pages/ProductDetails.tsx | 7 +++++--
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/pages/Dashboard.tsx b/src/pages/Dashboard.tsx
index 12c6325..d5e3341 100644
--- a/src/pages/Dashboard.tsx
+++ b/src/pages/Dashboard.tsx
@@ -103,11 +103,13 @@ const Dashboard = () => {
           <h3 className="text-lg font-bold mb-6 text-dark-text">Produtos Mais Vendidos</h3>
           <div className="h-80 w-full">
             <ResponsiveContainer width="100%" height="100%">
-              <BarChart data={salesByProduct} margin={{ top: 5, right: 30, left: 20, bottom: 5 }}>
+              <BarChart data={salesByProduct} margin={{ top: 5, right: 30, left: 20, bottom: 60 }}>
                 <CartesianGrid strokeDasharray="3 3" stroke="#222222" vertical={false} />
                 <XAxis 
                   dataKey="name" stroke="#888888" fontSize={10} tickLine={false} axisLine={false}
-                  tickFormatter={(v) => v.length > 12 ? v.substring(0, 12) + '...' : v}
+                  interval={0}
+                  angle={-45}
+                  textAnchor="end"
                 />
                 <YAxis stroke="#888888" fontSize={12} tickLine={false} axisLine={false} />
                 <Tooltip 
diff --git a/src/pages/ProductDetails.tsx b/src/pages/ProductDetails.tsx
index 840034f..4cf6695 100644
--- a/src/pages/ProductDetails.tsx
+++ b/src/pages/ProductDetails.tsx
@@ -108,10 +108,13 @@ const ProductDetails = () => {
         <h3 className="text-lg font-bold mb-8 text-zinc-900 dark:text-dark-text">Volume de Vendas por Data</h3>
         <div className="h-80 w-full">
           <ResponsiveContainer width="100%" height="100%">
-            <BarChart data={chartData}>
+            <BarChart data={chartData} margin={{ top: 5, right: 30, left: 20, bottom: 40 }}>
               <CartesianGrid strokeDasharray="3 3" stroke="#222222" vertical={false} />
               <XAxis 
-                dataKey="date" stroke="#888888" fontSize={12} tickLine={false} axisLine={false}
+                dataKey="date" stroke="#888888" fontSize={10} tickLine={false} axisLine={false}
+                interval={0}
+                angle={-45}
+                textAnchor="end"
               />
               <YAxis stroke="#888888" fontSize={12} tickLine={false} axisLine={false} />
               <Tooltip