Refactor global currency to UAE standards (AED/Million) and update dummy data
This commit is contained in:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user