Fix onboarding and data issues

- Fix issue where welcome dialog reappears.
- Fix issue where new expenses are not reflected.
- Improve card layout on mobile devices.

src/components/AddTransactionButton.tsx

@@ -21,6 +21,7 @@ const AddTransactionButton = () => {
   };
   
   const onSubmit = async (data: ExpenseFormValues) => {
+    try {
       // Remove commas before processing the amount
       const numericAmount = data.amount.replace(/,/g, '');
       
@@ -37,6 +38,8 @@ const AddTransactionButton = () => {
         type: 'expense' // 명시적으로 'expense'로 설정
       };
       
+      console.log('새 지출 추가:', newExpense);
+      
       // BudgetContext를 통해 지출 추가
       addTransaction(newExpense);
       
@@ -70,6 +73,18 @@ const AddTransactionButton = () => {
         title: "지출이 추가되었습니다",
         description: `${data.title} 항목이 ${formatWithCommas(numericAmount)}원으로 등록되었습니다.`,
       });
+      
+      // 브라우저 이벤트 발생시켜 다른 페이지에서도 업데이트되도록 함
+      window.dispatchEvent(new Event('budgetDataUpdated'));
+      window.dispatchEvent(new Event('transactionAdded'));
+    } catch (error) {
+      console.error('지출 추가 중 오류 발생:', error);
+      toast({
+        title: "지출 추가 실패",
+        description: "지출을 추가하는 도중 오류가 발생했습니다.",
+        variant: "destructive",
+      });
+    }
   };
   
   return (

src/components/onboarding/WelcomeDialog.tsx

@@ -22,6 +22,10 @@ const WelcomeDialog: React.FC<WelcomeDialogProps> = ({ open, onClose }) => {
   const [dontShowAgain, setDontShowAgain] = useState(false);
 
   const handleClose = () => {
+    // 체크박스가 체크되어 있으면 localStorage에 직접 저장
+    if (dontShowAgain) {
+      localStorage.setItem('dontShowWelcome', 'true');
+    }
     onClose(dontShowAgain);
   };
 

src/pages/Analytics.tsx

@@ -9,10 +9,12 @@ import { useBudget } from '@/contexts/BudgetContext';
 import { formatCurrency } from '@/utils/formatters';
 import { EXPENSE_CATEGORIES } from '@/constants/categoryIcons';
 import { MONTHS_KR } from '@/hooks/useTransactions';
+import { useIsMobile } from '@/hooks/use-mobile';
 
 const Analytics = () => {
   const [selectedPeriod, setSelectedPeriod] = useState('이번 달');
   const { budgetData, getCategorySpending, transactions } = useBudget();
+  const isMobile = useIsMobile();
   
   // 실제 예산 및 지출 데이터 사용
   const totalBudget = budgetData.monthly.targetAmount;
@@ -98,7 +100,7 @@ const Analytics = () => {
   
   return (
     <div className="min-h-screen bg-neuro-background pb-24">
-      <div className="max-w-md mx-auto px-6">
+      <div className={`mx-auto px-4 ${isMobile ? 'w-full' : 'max-w-lg'}`}>
         {/* Header */}
         <header className="py-8">
           <h1 className="text-2xl font-bold neuro-text mb-5">지출 분석</h1>

src/pages/Index.tsx

@@ -12,6 +12,7 @@ import { useBudget } from '@/contexts/BudgetContext';
 import { useAuth } from '@/contexts/auth';
 import { resetAllData } from '@/contexts/budget/storageUtils';
 import { resetAllStorageData } from '@/utils/storageUtils';
+import { useIsMobile } from '@/hooks/use-mobile';
 
 // 메인 컴포넌트
 const Index = () => {
@@ -29,6 +30,7 @@ const Index = () => {
   const { user } = useAuth();
   const [showWelcome, setShowWelcome] = useState(false);
   const [isInitialized, setIsInitialized] = useState(false);
+  const isMobile = useIsMobile();
 
   // 화면이 처음 로드될 때 데이터 초기화
   useEffect(() => {
@@ -108,6 +110,7 @@ const Index = () => {
     setShowWelcome(false);
     if (dontShowAgain) {
       localStorage.setItem('dontShowWelcome', 'true');
+      console.log('환영 팝업 더 이상 표시하지 않기 설정됨');
     }
   };
 
@@ -119,9 +122,25 @@ const Index = () => {
     </div>
   );
 
+  // 트랜잭션 변경 시 페이지 새로고침
+  useEffect(() => {
+    const handleTransactionAdded = () => {
+      console.log('트랜잭션이 추가되었습니다. 페이지를 새로고침합니다.');
+      // 컨텍스트에서 최신 데이터 가져오기
+    };
+
+    window.addEventListener('transactionAdded', handleTransactionAdded);
+    window.addEventListener('budgetDataUpdated', handleTransactionAdded);
+    
+    return () => {
+      window.removeEventListener('transactionAdded', handleTransactionAdded);
+      window.removeEventListener('budgetDataUpdated', handleTransactionAdded);
+    };
+  }, []);
+
   return (
     <div className="min-h-screen bg-neuro-background pb-24">
-      <div className="max-w-md mx-auto px-6">
+      <div className={`mx-auto px-4 ${isMobile ? 'w-full' : 'max-w-lg'}`}>
         <Header />
 
         {/* 목표 진행 상황 */}