blyzer/graphs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: display revenue as currency in PieChart tooltip
All checks were successful
Build and Deploy / build-and-deploy (push) Successful in 1m12s
Details

Browse Source
This commit is contained in:
Cauê Faleiros
2026-05-06 17:24:11 -03:00
parent 8f17f7b4fd
commit c15de19180
1 changed files with 10 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/pages/Dashboard.tsx
View File

@@ -11,13 +11,20 @@ const COLORS = [
'#06b6d4', '#ec4899', '#eab308', '#6366f1', '#14b8a6'
];
const CustomTooltip = ({ active, payload, label }: any) => {
const formatCurrency = (value: number) => {
return new Intl.NumberFormat('pt-BR', { style: 'currency', currency: 'BRL' }).format(value);
};
const CustomTooltip = ({ active, payload, label, isCurrency }: any) => {
if (active && payload && payload.length) {
const color = payload[0].payload?.fill || payload[0].color || '#9ECAE1';
const displayLabel = label || payload[0].name;
const value = isCurrency ? formatCurrency(payload[0].value) : payload[0].value;
const valueLabel = isCurrency ? 'Receita:' : 'Vendas:';
return (
<div className="bg-[#141414] p-3 rounded-xl shadow-lg border-none">
<p className="font-bold mb-1" style={{ color }}>{label}</p>
<p className="text-[#ededed] m-0">Vendas: {payload[0].value}</p>
<p className="font-bold mb-1" style={{ color }}>{displayLabel}</p>
<p className="text-[#ededed] m-0">{valueLabel} {value}</p>
</div>
);
}