Prevent duplicate toast notifications

The application was displaying duplicate toast notifications due to events being triggered multiple times. This commit prevents duplicate notifications.

src/components/AddTransactionButton.tsx

@@ -1,8 +1,7 @@
-
 import React, { useState } from 'react';
 import { PlusIcon } from 'lucide-react';
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from './ui/dialog';
-import { toast } from '@/hooks/useToast.wrapper';
+import { toast } from '@/hooks/useToast.wrapper'; // 래퍼 사용
 import { useBudget } from '@/contexts/BudgetContext';
 import { supabase } from '@/lib/supabase';
 import { isSyncEnabled } from '@/utils/syncUtils';
@@ -41,7 +40,7 @@ const AddTransactionButton = () => {
         amount: parseInt(numericAmount),
         date: formattedDate,
         category: data.category,
-        type: 'expense' // 명시적으로 'expense'로 설정
+        type: 'expense'
       };
       
       console.log('새 지출 추가:', newExpense);
@@ -49,7 +48,6 @@ const AddTransactionButton = () => {
       // BudgetContext를 통해 지출 추가
       addTransaction(newExpense);
       
-      // 동기화가 활성화되어 있고 사용자가 로그인되어 있다면 Supabase에도 저장
       try {
         const { data: { user } } = await supabase.auth.getUser();
         
@@ -74,19 +72,17 @@ const AddTransactionButton = () => {
       // 다이얼로그를 닫습니다
       setShowExpenseDialog(false);
       
-      // 사용자에게 알림을 표시합니다 (지연 추가하여 다른 토스트와 충돌 방지)
-      setTimeout(() => {
-        toast({
-          title: "지출이 추가되었습니다",
-          description: `${data.title} 항목이 ${formatWithCommas(numericAmount)}원으로 등록되었습니다.`,
-          duration: 3000
-        });
-      }, 100);
+      // 이벤트 발생 처리 - 단일 이벤트로 통합
+      window.dispatchEvent(new CustomEvent('transactionChanged', {
+        detail: { type: 'add', transaction: newExpense }
+      }));
       
-      // 브라우저 이벤트 발생시켜 다른 페이지에서도 업데이트되도록 함
-      window.dispatchEvent(new Event('budgetDataUpdated'));
-      window.dispatchEvent(new Event('transactionAdded'));
-      window.dispatchEvent(new Event('transactionUpdated'));
+      // 토스트는 한 번만 표시 (지연 제거하여 래퍼에서 처리되도록)
+      toast({
+        title: "지출이 추가되었습니다",
+        description: `${data.title} 항목이 ${formatWithCommas(numericAmount)}원으로 등록되었습니다.`,
+        duration: 3000
+      });
     } catch (error) {
       console.error('지출 추가 중 오류 발생:', error);
       toast({

src/components/BudgetTabContent.tsx

@@ -5,7 +5,7 @@ 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';
+import { toast } from '@/hooks/useToast.wrapper'; // 래퍼 함수 사용
 import { EXPENSE_CATEGORIES } from '@/constants/categoryIcons';
 
 interface BudgetData {
@@ -60,13 +60,23 @@ const BudgetTabContent: React.FC<BudgetTabContentProps> = ({
     // Calculate total from all categories
     const totalAmount = Object.values(categoryBudgets).reduce((sum, value) => sum + value, 0);
 
+    // 버튼 중복 클릭 방지를 위해 비활성화 처리 (setTimeout 사용)
+    const button = document.querySelector('button[type="button"]') as HTMLButtonElement;
+    if (button) {
+      button.disabled = true;
+      setTimeout(() => {
+        button.disabled = false;
+      }, 1000);
+    }
+
     // 카테고리 예산도 함께 전달합니다
     onSaveBudget(totalAmount, categoryBudgets);
-    toast({
-      title: "예산 설정 완료",
-      description: "카테고리별 예산이 성공적으로 저장되었습니다."
-    });
+    
+    // 단일 토스트만 표시하고 즉시 패널 닫음
     setIsOpen(false);
+    
+    // 토스트는 이벤트 발생 후 처리되므로 여기서는 호출하지 않음
+    // 이 함수에서 직접 toast 호출하지 않고 budgetStorage에서 처리되도록 함
   };
 
   // Format with commas for display