Refactor global currency to UAE standards (AED/Million) and update dummy data

This commit is contained in:
CycroftX
2026-02-15 18:49:13 +05:30
parent a493596ebe
commit 58fe801eab
10 changed files with 457 additions and 562 deletions

View File

@@ -14,13 +14,12 @@ import {
ArrowRight,
AlertCircle
} from 'lucide-react';
import { cn } from '@/lib/utils';
import { cn, formatCurrency } from '@/lib/utils';
// Mock Data
const budgetData = {
limit: 15000,
spent: 12500,
currency: 'AED',
categories: [
{ name: 'Housing', icon: Home, spent: 6500, limit: 7000, color: 'bg-blue-500' },
{ name: 'Food & Dining', icon: Utensils, spent: 2800, limit: 3000, color: 'bg-green-500' },
@@ -28,8 +27,8 @@ const budgetData = {
{ name: 'Shopping', icon: ShoppingCart, spent: 2000, limit: 1500, color: 'bg-pink-500' }, // Over budget
],
goals: [
{ name: 'Buy a House', target: 2000000, current: 450000, color: 'bg-purple-500' },
{ name: 'Retirement', target: 5000000, current: 120000, color: 'bg-indigo-500' },
{ name: 'Buy a House', target: 800000, current: 200000, color: 'bg-purple-500' },
{ name: 'Retirement', target: 2000000, current: 150000, color: 'bg-indigo-500' },
]
};
@@ -88,10 +87,10 @@ export default function BudgetManager() {
<div className="absolute flex flex-col items-center">
<span className="text-xs sm:text-sm text-slate-500 font-medium uppercase tracking-wider">Total Spent</span>
<span className="text-3xl sm:text-4xl font-bold text-slate-900 mt-1">
{budgetData.currency} {budgetData.spent.toLocaleString()}
{formatCurrency(budgetData.spent)}
</span>
<span className="text-xs sm:text-sm text-slate-400 mt-1">
of {budgetData.currency} {budgetData.limit.toLocaleString()}
of {formatCurrency(budgetData.limit)}
</span>
</div>
</div>
@@ -131,8 +130,8 @@ export default function BudgetManager() {
<span className="font-medium text-slate-700">{cat.name}</span>
</div>
<div className="flex items-center gap-2">
<span className="font-semibold">{budgetData.currency} {cat.spent.toLocaleString()}</span>
<span className="text-slate-400">/ {cat.limit.toLocaleString()}</span>
<span className="font-semibold">{formatCurrency(cat.spent)}</span>
<span className="text-slate-400">/ {formatCurrency(cat.limit)}</span>
</div>
</div>
<div className="h-2.5 bg-slate-100 rounded-full overflow-hidden">
@@ -176,8 +175,8 @@ export default function BudgetManager() {
</div>
<Progress value={(goal.current / goal.target) * 100} className="h-2" indicatorClassName={goal.color} />
<div className="flex justify-between text-xs text-slate-400 pt-1">
<span>{budgetData.currency} {(goal.current / 1000).toFixed(0)}k</span>
<span>{budgetData.currency} {(goal.target / 1000000).toFixed(1)}M</span>
<span>{formatCurrency(goal.current)}</span>
<span>{formatCurrency(goal.target)}</span>
</div>
</div>
</div>