Update budget setting text

Replaced the budget setting text with a message indicating that entering the monthly budget will automatically set the daily and weekly budgets.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-15 02:29:28 +00:00
parent f92c7cc3cd
commit d1ebbefb0a

View File

@@ -4,11 +4,13 @@ import { Input } from '@/components/ui/input';
import { Button } from '@/components/ui/button';
import { Check, ChevronDown, ChevronUp } from 'lucide-react';
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';
interface BudgetData {
targetAmount: number;
spentAmount: number;
remainingAmount: number;
}
interface BudgetProgressCardProps {
budgetData: {
daily: BudgetData;
@@ -21,6 +23,7 @@ interface BudgetProgressCardProps {
calculatePercentage: (spent: number, target: number) => number;
onSaveBudget: (type: 'daily' | 'weekly' | 'monthly', amount: number) => void;
}
const BudgetProgressCard: React.FC<BudgetProgressCardProps> = ({
budgetData,
selectedTab,
@@ -59,12 +62,14 @@ const BudgetProgressCard: React.FC<BudgetProgressCardProps> = ({
</Tabs>
</div>;
};
interface BudgetTabContentProps {
data: BudgetData;
formatCurrency: (amount: number) => string;
calculatePercentage: (spent: number, target: number) => number;
onSaveBudget: (amount: number) => void;
}
const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
data,
formatCurrency,
@@ -74,11 +79,13 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
const percentage = calculatePercentage(data.spentAmount, data.targetAmount);
const [isOpen, setIsOpen] = useState(false);
const [budgetInput, setBudgetInput] = useState(data.targetAmount.toString());
const handleInputChange = (value: string) => {
// Remove all non-numeric characters
const numericValue = value.replace(/[^0-9]/g, '');
setBudgetInput(numericValue);
};
const handleSave = () => {
const amount = parseInt(budgetInput, 10) || 0;
onSaveBudget(amount);
@@ -89,6 +96,7 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
const formatWithCommas = (amount: string) => {
return amount.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
};
return <div className="space-y-4">
<div>
<div className="flex items-center justify-between mb-2">
@@ -128,10 +136,11 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
<Check size={18} />
</Button>
</div>
<p className="text-xs text-gray-500 mt-1"> : {formatWithCommas(budgetInput)}</p>
<p className="text-xs text-gray-500 mt-1"> , .</p>
</CollapsibleContent>
</Collapsible>
</div>
</div>;
};
export default BudgetProgressCard;