Clarify data synchronization process

Clarify the data synchronization process and address a scenario where data is lost after logging out, initializing data, and logging back in.

src/utils/sync/transactionSync.ts

@@ -2,9 +2,11 @@
 import { supabase } from '@/lib/supabase';
 import { Transaction } from '@/components/TransactionCard';
 import { isSyncEnabled } from './syncSettings';
+import { toast } from '@/hooks/useToast.wrapper';
 
 /**
  * Upload transaction data from local storage to Supabase
+ * 로컬 데이터를 서버에 업로드 (새로운 또는 수정된 데이터만)
  */
 export const uploadTransactions = async (userId: string): Promise<void> => {
   if (!isSyncEnabled()) return;
@@ -14,63 +16,180 @@ export const uploadTransactions = async (userId: string): Promise<void> => {
     if (!localTransactions) return;
     
     const transactions: Transaction[] = JSON.parse(localTransactions);
+    console.log(`로컬 트랜잭션 ${transactions.length}개 동기화 시작`);
     
-    // 기존 데이터 삭제 후 새로 업로드
-    await supabase
+    if (transactions.length === 0) return; // 트랜잭션이 없으면 처리하지 않음
+    
+    // 먼저 서버에서 현재 트랜잭션 목록 가져오기
+    const { data: existingData, error: fetchError } = await supabase
       .from('transactions')
-      .delete()
+      .select('transaction_id')
       .eq('user_id', userId);
       
-    // 트랜잭션 배치 처리
-    const { error } = await supabase.from('transactions').insert(
-      transactions.map(t => ({
+    if (fetchError) {
+      console.error('기존 트랜잭션 조회 실패:', fetchError);
+      throw fetchError;
+    }
+    
+    // 서버에 이미 있는 트랜잭션 ID 맵 생성
+    const existingIds = new Set(existingData?.map(t => t.transaction_id) || []);
+    console.log(`서버에 이미 존재하는 트랜잭션: ${existingIds.size}개`);
+    
+    // 삽입할 새 트랜잭션과 업데이트할 기존 트랜잭션 분리
+    const newTransactions = [];
+    const updateTransactions = [];
+    
+    for (const t of transactions) {
+      const transactionData = {
         user_id: userId,
         title: t.title,
         amount: t.amount,
         date: t.date,
         category: t.category,
         type: t.type,
-        transaction_id: t.id // 로컬 ID 보존
-      }))
-    );
+        transaction_id: t.id
+      };
+      
+      if (existingIds.has(t.id)) {
+        updateTransactions.push(transactionData);
+      } else {
+        newTransactions.push(transactionData);
+      }
+    }
     
-    if (error) throw error;
+    // 새 트랜잭션 삽입 (있는 경우)
+    if (newTransactions.length > 0) {
+      console.log(`${newTransactions.length}개의 새 트랜잭션 업로드`);
+      const { error: insertError } = await supabase
+        .from('transactions')
+        .insert(newTransactions);
+        
+      if (insertError) {
+        console.error('새 트랜잭션 업로드 실패:', insertError);
+        throw insertError;
+      }
+    }
+    
+    // 기존 트랜잭션 업데이트 (있는 경우)
+    if (updateTransactions.length > 0) {
+      console.log(`${updateTransactions.length}개의 기존 트랜잭션 업데이트`);
+      for (const transaction of updateTransactions) {
+        const { error: updateError } = await supabase
+          .from('transactions')
+          .update(transaction)
+          .eq('transaction_id', transaction.transaction_id)
+          .eq('user_id', userId);
+          
+        if (updateError) {
+          console.error('트랜잭션 업데이트 실패:', updateError);
+          // 실패해도 계속 진행
+        }
+      }
+    }
     
     console.log('트랜잭션 업로드 완료');
   } catch (error) {
     console.error('트랜잭션 업로드 실패:', error);
+    throw error;
   }
 };
 
 /**
  * Download transaction data from Supabase to local storage
+ * 서버에서 로컬 스토리지로 데이터 다운로드 (병합 방식)
  */
 export const downloadTransactions = async (userId: string): Promise<void> => {
   if (!isSyncEnabled()) return;
 
   try {
+    console.log('서버에서 트랜잭션 데이터 다운로드 시작');
     const { data, error } = await supabase
       .from('transactions')
       .select('*')
       .eq('user_id', userId);
       
-    if (error) throw error;
-    
-    if (data && data.length > 0) {
-      // Supabase 형식에서 로컬 형식으로 변환
-      const transactions = data.map(t => ({
-        id: t.transaction_id || t.id,
-        title: t.title,
-        amount: t.amount,
-        date: t.date,
-        category: t.category,
-        type: t.type
-      }));
-      
-      localStorage.setItem('transactions', JSON.stringify(transactions));
-      console.log('트랜잭션 다운로드 완료');
+    if (error) {
+      console.error('트랜잭션 다운로드 실패:', error);
+      throw error;
     }
+    
+    if (!data || data.length === 0) {
+      console.log('서버에 저장된 트랜잭션 없음');
+      return; // 서버에 데이터가 없으면 로컬 데이터 유지
+    }
+    
+    console.log(`서버에서 ${data.length}개의 트랜잭션 다운로드`);
+    
+    // 서버 데이터를 로컬 형식으로 변환
+    const serverTransactions = data.map(t => ({
+      id: t.transaction_id || t.id,
+      title: t.title,
+      amount: t.amount,
+      date: t.date,
+      category: t.category,
+      type: t.type
+    }));
+    
+    // 기존 로컬 데이터 불러오기
+    const localDataStr = localStorage.getItem('transactions');
+    const localTransactions = localDataStr ? JSON.parse(localDataStr) : [];
+    
+    // 로컬 데이터와 서버 데이터 병합 (ID 기준)
+    const transactionMap = new Map();
+    
+    // 로컬 데이터를 맵에 추가
+    localTransactions.forEach((tx: Transaction) => {
+      transactionMap.set(tx.id, tx);
+    });
+    
+    // 서버 데이터로 맵 업데이트 (서버 데이터 우선)
+    serverTransactions.forEach(tx => {
+      transactionMap.set(tx.id, tx);
+    });
+    
+    // 최종 병합된 데이터 생성
+    const mergedTransactions = Array.from(transactionMap.values());
+    
+    // 로컬 스토리지에 저장
+    localStorage.setItem('transactions', JSON.stringify(mergedTransactions));
+    console.log(`총 ${mergedTransactions.length}개의 트랜잭션 병합 완료`);
+    
+    // 이벤트 발생시켜 UI 업데이트
+    window.dispatchEvent(new Event('transactionUpdated'));
+    
   } catch (error) {
-    console.error('트랜잭션 다운로드 실패:', error);
+    console.error('트랜잭션 다운로드 중 오류:', error);
+    throw error;
+  }
+};
+
+/**
+ * 특정 트랜잭션 ID 삭제 처리
+ */
+export const deleteTransactionFromServer = async (userId: string, transactionId: string): Promise<void> => {
+  if (!isSyncEnabled()) return;
+  
+  try {
+    console.log(`트랜잭션 삭제 요청: ${transactionId}`);
+    const { error } = await supabase
+      .from('transactions')
+      .delete()
+      .eq('transaction_id', transactionId)
+      .eq('user_id', userId);
+      
+    if (error) {
+      console.error('트랜잭션 삭제 실패:', error);
+      throw error;
+    }
+    
+    console.log(`트랜잭션 ${transactionId} 삭제 완료`);
+  } catch (error) {
+    console.error('트랜잭션 삭제 중 오류:', error);
+    // 에러 발생 시 토스트 알림
+    toast({
+      title: "삭제 동기화 실패",
+      description: "서버에서 트랜잭션을 삭제하는데 문제가 발생했습니다.",
+      variant: "destructive"
+    });
   }
 };