Fix category budget update

The category budget was not being updated correctly after setting the budget. This commit fixes the issue.

src/components/BudgetProgressCard.tsx

@@ -9,6 +9,12 @@ interface BudgetData {
   remainingAmount: number;
 }
 
+interface CategoryBudget {
+  식비: number;
+  생활비: number;
+  교통비: number;
+}
+
 interface BudgetProgressCardProps {
   budgetData: {
     daily: BudgetData;
@@ -19,7 +25,7 @@ interface BudgetProgressCardProps {
   setSelectedTab: (value: string) => void;
   formatCurrency: (amount: number) => string;
   calculatePercentage: (spent: number, target: number) => number;
-  onSaveBudget: (type: 'daily' | 'weekly' | 'monthly', amount: number) => void;
+  onSaveBudget: (type: 'daily' | 'weekly' | 'monthly', amount: number, categoryBudgets?: CategoryBudget) => void;
 }
 
 const BudgetProgressCard: React.FC<BudgetProgressCardProps> = ({
@@ -52,7 +58,7 @@ const BudgetProgressCard: React.FC<BudgetProgressCardProps> = ({
             data={budgetData.daily} 
             formatCurrency={formatCurrency} 
             calculatePercentage={calculatePercentage} 
-            onSaveBudget={amount => onSaveBudget('daily', amount)} 
+            onSaveBudget={(amount, categoryBudgets) => onSaveBudget('daily', amount, categoryBudgets)} 
           />
         </TabsContent>
 
@@ -61,7 +67,7 @@ const BudgetProgressCard: React.FC<BudgetProgressCardProps> = ({
             data={budgetData.weekly} 
             formatCurrency={formatCurrency} 
             calculatePercentage={calculatePercentage} 
-            onSaveBudget={amount => onSaveBudget('weekly', amount)} 
+            onSaveBudget={(amount, categoryBudgets) => onSaveBudget('weekly', amount, categoryBudgets)} 
           />
         </TabsContent>
 
@@ -70,7 +76,7 @@ const BudgetProgressCard: React.FC<BudgetProgressCardProps> = ({
             data={budgetData.monthly} 
             formatCurrency={formatCurrency} 
             calculatePercentage={calculatePercentage} 
-            onSaveBudget={amount => onSaveBudget('monthly', amount)} 
+            onSaveBudget={(amount, categoryBudgets) => onSaveBudget('monthly', amount, categoryBudgets)} 
           />
         </TabsContent>
       </Tabs>

src/components/BudgetTabContent.tsx

@@ -1,25 +1,31 @@
+
 import React, { useState } from 'react';
 import { Button } from '@/components/ui/button';
 import { Check, ChevronDown, ChevronUp, Calculator } from 'lucide-react';
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';
 import BudgetProgress from './BudgetProgress';
 import CategoryBudgetInputs from './CategoryBudgetInputs';
+import { toast } from '@/components/ui/use-toast';
+
 interface BudgetData {
   targetAmount: number;
   spentAmount: number;
   remainingAmount: number;
 }
+
 interface CategoryBudget {
   식비: number;
   생활비: number;
   교통비: number;
 }
+
 interface BudgetTabContentProps {
   data: BudgetData;
   formatCurrency: (amount: number) => string;
   calculatePercentage: (spent: number, target: number) => number;
-  onSaveBudget: (amount: number) => void;
+  onSaveBudget: (amount: number, categoryBudgets?: CategoryBudget) => void;
 }
+
 const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
   data,
   formatCurrency,
@@ -29,16 +35,25 @@ 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 [categoryBudgets, setCategoryBudgets] = useState<CategoryBudget>({
+  
+  // 저장된 카테고리 예산을 불러옵니다
+  const savedCategoryBudgets = localStorage.getItem('categoryBudgets');
+  const initialCategoryBudgets = savedCategoryBudgets 
+    ? JSON.parse(savedCategoryBudgets) 
+    : {
         식비: Math.round(data.targetAmount * 0.4),
         생활비: Math.round(data.targetAmount * 0.4),
         교통비: Math.round(data.targetAmount * 0.2)
-  });
+      };
+  
+  const [categoryBudgets, setCategoryBudgets] = useState<CategoryBudget>(initialCategoryBudgets);
+
   const handleInputChange = (value: string) => {
     // Remove all non-numeric characters
     const numericValue = value.replace(/[^0-9]/g, '');
     setBudgetInput(numericValue);
   };
+
   const handleCategoryInputChange = (value: string, category: keyof CategoryBudget) => {
     // Remove all non-numeric characters
     const numericValue = value.replace(/[^0-9]/g, '');
@@ -47,10 +62,19 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
       [category]: parseInt(numericValue) || 0
     }));
   };
+
   const handleSave = () => {
     // Calculate total from all categories
     const totalAmount = Object.values(categoryBudgets).reduce((sum, value) => sum + value, 0);
-    onSaveBudget(totalAmount);
+    
+    // 카테고리 예산도 함께 전달합니다
+    onSaveBudget(totalAmount, categoryBudgets);
+    
+    toast({
+      title: "예산 설정 완료",
+      description: "카테고리별 예산이 성공적으로 저장되었습니다.",
+    });
+    
     setIsOpen(false);
   };
 
@@ -58,6 +82,7 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
   const formatWithCommas = (amount: string) => {
     return amount.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
   };
+
   return <div className="space-y-4">
       <BudgetProgress spentAmount={data.spentAmount} targetAmount={data.targetAmount} percentage={percentage} formatCurrency={formatCurrency} />
       
@@ -97,4 +122,5 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
       </div>
     </div>;
 };
+
 export default BudgetTabContent;

src/pages/Index.tsx

@@ -194,7 +194,13 @@ const Index = () => {
   };
 
   // 예산 목표 업데이트 함수
-  const handleBudgetGoalUpdate = (type: 'daily' | 'weekly' | 'monthly', amount: number) => {
+  const handleBudgetGoalUpdate = (type: 'daily' | 'weekly' | 'monthly', amount: number, newCategoryBudgets?: typeof categoryBudgets) => {
+    // 카테고리 예산이 직접 업데이트된 경우
+    if (newCategoryBudgets) {
+      setCategoryBudgets(newCategoryBudgets);
+      return; // 카테고리 예산이 변경되면 useEffect에서 자동으로 budgetData가 업데이트됩니다
+    }
+    
     // 월간 예산을 업데이트하고 일일, 주간도 자동 계산
     if (type === 'monthly') {
       const dailyAmount = Math.round(amount / 30);