Improve sync logging

Add more detailed logging for sync functionality to improve issue tracking.
2025-03-21 11:39:44 +00:00
parent 5903734503
commit e1c6875024
7 changed files with 427 additions and 189 deletions
--- a/src/utils/sync/transaction/deletedTransactionsTracker.ts
+++ b/src/utils/sync/transaction/deletedTransactionsTracker.ts
@@ -1,3 +1,4 @@
+
 /**
 * 삭제된 트랜잭션 ID를 추적하는 유틸리티
 * 로컬에서 삭제된 트랜잭션이 서버 동기화 후 다시 나타나는 문제를 해결합니다.
@@ -16,7 +17,7 @@ export const addToDeletedTransactions = (id: string): void => {
    if (!deletedIds.includes(id)) {
      deletedIds.push(id);
      localStorage.setItem(DELETED_TRANSACTIONS_KEY, JSON.stringify(deletedIds));
-      console.log(`[삭제 추적] ID 추가됨: ${id}`);
+      console.log(`[삭제 추적] ID 추가됨: ${id}, 현재 총 ${deletedIds.length}개 트랜잭션 추적 중`);
    }
  } catch (error) {
    console.error('[삭제 추적] ID 추가 실패:', error);
@@ -31,7 +32,11 @@ export const getDeletedTransactions = (): string[] => {
  try {
    const deletedStr = localStorage.getItem(DELETED_TRANSACTIONS_KEY);
    const deletedIds = deletedStr ? JSON.parse(deletedStr) : [];
-    return Array.isArray(deletedIds) ? deletedIds : [];
+    if (!Array.isArray(deletedIds)) {
+      console.warn('[삭제 추적] 유효하지 않은 형식, 초기화 진행');
+      return [];
+    }
+    return deletedIds;
  } catch (error) {
    console.error('[삭제 추적] 목록 조회 실패:', error);
    return [];
@@ -49,7 +54,7 @@ export const removeFromDeletedTransactions = (id: string): void => {
    
    if (deletedIds.length !== updatedIds.length) {
      localStorage.setItem(DELETED_TRANSACTIONS_KEY, JSON.stringify(updatedIds));
-      console.log(`[삭제 추적] ID 제거됨: ${id}`);
+      console.log(`[삭제 추적] ID 제거됨: ${id}, 남은 추적 개수: ${updatedIds.length}`);
    }
  } catch (error) {
    console.error('[삭제 추적] ID 제거 실패:', error);
@@ -67,3 +72,12 @@ export const clearDeletedTransactions = (): void => {
    console.error('[삭제 추적] 목록 초기화 실패:', error);
  }
 };
+
+/**
+ * 특정 ID가 삭제된 트랜잭션인지 확인
+ * @param id 확인할 트랜잭션 ID
+ * @returns 삭제된 트랜잭션인 경우 true
+ */
+export const isTransactionDeleted = (id: string): boolean => {
+  return getDeletedTransactions().includes(id);
+};
--- a/src/utils/sync/transaction/downloadTransaction.ts
+++ b/src/utils/sync/transaction/downloadTransaction.ts
@@ -3,18 +3,25 @@ import { supabase } from '@/lib/supabase';
 import { Transaction } from '@/components/TransactionCard';
 import { isSyncEnabled } from '../syncSettings';
 import { formatDateForDisplay } from './dateUtils';
-import { getDeletedTransactions } from './deletedTransactionsTracker';
+import { getDeletedTransactions, isTransactionDeleted } from './deletedTransactionsTracker';

 /**
 * Download transaction data from Supabase to local storage
 * 서버에서 로컬 스토리지로 데이터 다운로드 (병합 방식)
 */
 export const downloadTransactions = async (userId: string): Promise<void> => {
-  if (!isSyncEnabled()) return;
+  if (!isSyncEnabled()) {
+    console.log('[동기화] 다운로드: 동기화 비활성화 상태, 작업 건너뜀');
+    return;
+  }

  try {
    console.log('[동기화] 서버에서 트랜잭션 데이터 다운로드 시작');
    
+    // 다운로드 시간 기록 (충돌 감지용)
+    const downloadStartTime = new Date().toISOString();
+    console.log(`[동기화] 다운로드 시작 시간: ${downloadStartTime}`);
+    
    // 대용량 데이터 처리를 위한 페이지네이션 설정
    const pageSize = 500; // 한 번에 가져올 최대 레코드 수
    let lastId = null;
@@ -53,25 +60,31 @@ export const downloadTransactions = async (userId: string): Promise<void> => {
        if (data.length < pageSize) {
          hasMore = false;
        }
+        
+        console.log(`[동기화] 페이지 다운로드 완료: ${data.length}개 항목`);
      }
    }
    
+    console.log(`[동기화] 서버 데이터 다운로드 완료: 총 ${allServerData.length}개 항목`);
+    
    if (allServerData.length === 0) {
      console.log('[동기화] 서버에 저장된 트랜잭션 없음');
      return; // 서버에 데이터가 없으면 로컬 데이터 유지
    }
    
-    console.log(`[동기화] 서버에서 ${allServerData.length}개의 트랜잭션 다운로드`);
-    
    // 삭제된 트랜잭션 ID 목록 가져오기
    const deletedIds = getDeletedTransactions();
    console.log(`[동기화] 삭제된 트랜잭션 ${deletedIds.length}개 필터링 적용`);
    
+    if (deletedIds.length > 0) {
+      console.log(`[동기화] 삭제 추적 항목: ${deletedIds.slice(0, 5).join(', ')}${deletedIds.length > 5 ? '...' : ''}`);
+    }
+    
    // 서버 데이터를 로컬 형식으로 변환 (삭제된 항목 제외)
    const serverTransactions = allServerData
      .filter(t => {
        const transactionId = t.transaction_id || t.id;
-        const isDeleted = deletedIds.includes(transactionId);
+        const isDeleted = isTransactionDeleted(transactionId);
        if (isDeleted) {
          console.log(`[동기화] 삭제된 트랜잭션 필터링: ${transactionId}`);
        }
@@ -108,7 +121,8 @@ export const downloadTransactions = async (userId: string): Promise<void> => {
            date: formattedDate,
            category: t.category || '기타',
            type: t.type || 'expense',
-            notes: t.notes || ''
+            notes: t.notes || '',
+            serverTimestamp: t.updated_at || t.created_at || downloadStartTime
          };
        } catch (itemError) {
          console.error(`[동기화] 트랜잭션 변환 오류 (ID: ${t.transaction_id || t.id}):`, itemError);
@@ -120,14 +134,19 @@ export const downloadTransactions = async (userId: string): Promise<void> => {
            date: new Date().toLocaleString('ko-KR'),
            category: '기타',
            type: 'expense',
-            notes: '데이터 변환 중 오류 발생'
+            notes: '데이터 변환 중 오류 발생',
+            serverTimestamp: downloadStartTime
          };
        }
      });
    
+    console.log(`[동기화] 서버 트랜잭션 변환 완료: ${serverTransactions.length}개 항목`);
+    
    // 기존 로컬 데이터 불러오기
    const localDataStr = localStorage.getItem('transactions');
-    const localTransactions = localDataStr ? JSON.parse(localDataStr) : [];
+    const localTransactions: Transaction[] = localDataStr ? JSON.parse(localDataStr) : [];
+    
+    console.log(`[동기화] 로컬 트랜잭션: ${localTransactions.length}개 항목`);
    
    // 로컬 데이터와 서버 데이터 병합 (ID 기준)
    const transactionMap = new Map();
@@ -135,26 +154,63 @@ export const downloadTransactions = async (userId: string): Promise<void> => {
    // 로컬 데이터를 맵에 추가
    localTransactions.forEach((tx: Transaction) => {
      if (tx && tx.id) { // 유효성 검사 추가
-        transactionMap.set(tx.id, tx);
+        // 로컬 항목에 타임스탬프 추가 (없는 경우)
+        const txWithTimestamp = {
+          ...tx,
+          localTimestamp: tx.localTimestamp || downloadStartTime
+        };
+        transactionMap.set(tx.id, txWithTimestamp);
      }
    });
    
-    // 서버 데이터로 맵 업데이트 (서버 데이터 우선)
+    // 충돌 카운터
+    let overwrittenCount = 0;
+    let preservedCount = 0;
+    
+    // 서버 데이터로 맵 업데이트 (타임스탬프 비교)
    serverTransactions.forEach(tx => {
      if (tx && tx.id) { // 유효성 검사 추가
-        transactionMap.set(tx.id, tx);
+        const existingTx = transactionMap.get(tx.id);
+        
+        if (!existingTx) {
+          // 로컬에 없는 새 항목
+          transactionMap.set(tx.id, tx);
+          console.log(`[동기화] 새 항목 추가: ${tx.id} - ${tx.title}`);
+        } else {
+          // 타임스탬프 비교로 최신 데이터 결정
+          const serverTime = tx.serverTimestamp || downloadStartTime;
+          const localTime = existingTx.localTimestamp || '1970-01-01T00:00:00Z';
+          
+          if (serverTime > localTime) {
+            // 서버 데이터가 더 최신
+            transactionMap.set(tx.id, tx);
+            overwrittenCount++;
+            console.log(`[동기화] 서버 데이터로 업데이트: ${tx.id} - ${tx.title} (서버: ${serverTime}, 로컬: ${localTime})`);
+          } else {
+            // 로컬 데이터 유지
+            preservedCount++;
+            console.log(`[동기화] 로컬 데이터 유지: ${tx.id} - ${existingTx.title} (서버: ${serverTime}, 로컬: ${localTime})`);
+          }
+        }
      }
    });
    
    // 최종 병합된 데이터 생성
    const mergedTransactions = Array.from(transactionMap.values());
    
+    console.log(`[동기화] 병합 결과: 총 ${mergedTransactions.length}개 항목 (서버 데이터로 업데이트: ${overwrittenCount}, 로컬 데이터 유지: ${preservedCount})`);
+    
    // 로컬 스토리지에 저장
    localStorage.setItem('transactions', JSON.stringify(mergedTransactions));
-    console.log(`[동기화] 총 ${mergedTransactions.length}개의 트랜잭션 병합 완료`);
+    console.log(`[동기화] 병합된 트랜잭션 저장 완료`);
+    
+    // 백업 저장
+    localStorage.setItem('transactions_backup', JSON.stringify(mergedTransactions));
+    console.log(`[동기화] 트랜잭션 백업 저장 완료`);
    
    // 이벤트 발생시켜 UI 업데이트
    window.dispatchEvent(new Event('transactionUpdated'));
+    console.log(`[동기화] 트랜잭션 업데이트 이벤트 발생`);
  } catch (error) {
    console.error('[동기화] 트랜잭션 다운로드 중 오류:', error);
    console.error('[동기화] 오류 상세:', JSON.stringify(error, null, 2));
--- a/src/utils/sync/transaction/uploadTransaction.ts
+++ b/src/utils/sync/transaction/uploadTransaction.ts
@@ -3,27 +3,83 @@ import { supabase } from '@/lib/supabase';
 import { Transaction } from '@/components/TransactionCard';
 import { isSyncEnabled } from '../syncSettings';
 import { normalizeDate } from './dateUtils';
+import { getDeletedTransactions, removeFromDeletedTransactions } from './deletedTransactionsTracker';

 /**
 * Upload transaction data from local storage to Supabase
 * 로컬 데이터를 서버에 업로드 (새로운 또는 수정된 데이터만)
 */
 export const uploadTransactions = async (userId: string): Promise<void> => {
-  if (!isSyncEnabled()) return;
+  if (!isSyncEnabled()) {
+    console.log('[동기화] 업로드: 동기화 비활성화 상태, 작업 건너뜀');
+    return;
+  }

  try {
+    console.log('[동기화] 트랜잭션 업로드 시작');
+    const uploadStartTime = new Date().toISOString();
+    
+    // 로컬 트랜잭션 데이터 로드
    const localTransactions = localStorage.getItem('transactions');
-    if (!localTransactions) return;
+    if (!localTransactions) {
+      console.log('[동기화] 로컬 트랜잭션 데이터 없음, 업로드 건너뜀');
+      return;
+    }
    
+    // 트랜잭션 파싱
    const transactions: Transaction[] = JSON.parse(localTransactions);
-    console.log(`로컬 트랜잭션 ${transactions.length}개 동기화 시작`);
+    console.log(`[동기화] 로컬 트랜잭션 ${transactions.length}개 동기화 시작`);
    
-    if (transactions.length === 0) return; // 트랜잭션이 없으면 처리하지 않음
+    if (transactions.length === 0) {
+      console.log('[동기화] 트랜잭션이 없음, 업로드 건너뜀');
+      return; // 트랜잭션이 없으면 처리하지 않음
+    }
+    
+    // 삭제된 트랜잭션 처리
+    const deletedIds = getDeletedTransactions();
+    if (deletedIds.length > 0) {
+      console.log(`[동기화] 삭제된 트랜잭션 ${deletedIds.length}개 처리 시작`);
+      
+      // 100개씩 나눠서 처리 (대용량 데이터 처리)
+      const batchSize = 100;
+      for (let i = 0; i < deletedIds.length; i += batchSize) {
+        const batch = deletedIds.slice(i, i + batchSize);
+        console.log(`[동기화] 삭제 배치 처리 중: ${i+1}~${Math.min(i+batch.length, deletedIds.length)}/${deletedIds.length}`);
+        
+        // 각 삭제된 ID 처리 (병렬 처리)
+        const deletePromises = batch.map(async (id) => {
+          try {
+            const { error } = await supabase
+              .from('transactions')
+              .delete()
+              .eq('transaction_id', id)
+              .eq('user_id', userId);
+              
+            if (error) {
+              console.error(`[동기화] 트랜잭션 삭제 실패 (ID: ${id}):`, error);
+              return { id, success: false };
+            } else {
+              console.log(`[동기화] 트랜잭션 삭제 성공: ${id}`);
+              removeFromDeletedTransactions(id);
+              return { id, success: true };
+            }
+          } catch (err) {
+            console.error(`[동기화] 트랜잭션 삭제 중 오류 (ID: ${id}):`, err);
+            return { id, success: false };
+          }
+        });
+        
+        // 병렬 처리 대기
+        const results = await Promise.all(deletePromises);
+        const successCount = results.filter(r => r.success).length;
+        console.log(`[동기화] 삭제 배치 처리 결과: ${successCount}/${batch.length} 성공`);
+      }
+    }
    
    // 먼저 서버에서 현재 트랜잭션 목록 가져오기
    const { data: existingData, error: fetchError } = await supabase
      .from('transactions')
-      .select('transaction_id')
+      .select('transaction_id, updated_at')
      .eq('user_id', userId);
      
    if (fetchError) {
@@ -33,8 +89,12 @@ export const uploadTransactions = async (userId: string): Promise<void> => {
    }
    
    // 서버에 이미 있는 트랜잭션 ID 맵 생성
-    const existingIds = new Set(existingData?.map(t => t.transaction_id) || []);
-    console.log(`서버에 이미 존재하는 트랜잭션: ${existingIds.size}개`);
+    const existingMap = new Map();
+    existingData?.forEach(t => {
+      existingMap.set(t.transaction_id, t.updated_at);
+    });
+    
+    console.log(`[동기화] 서버에 이미 존재하는 트랜잭션: ${existingMap.size}개`);
    
    // 삽입할 새 트랜잭션과 업데이트할 기존 트랜잭션 분리
    const newTransactions = [];
@@ -42,9 +102,18 @@ export const uploadTransactions = async (userId: string): Promise<void> => {
    
    for (const t of transactions) {
      try {
+        // 삭제 목록에 있는 트랜잭션은 건너뜀
+        if (deletedIds.includes(t.id)) {
+          console.log(`[동기화] 삭제된 항목 건너뜀: ${t.id}`);
+          continue;
+        }
+        
        // 날짜 형식 정규화
        const normalizedDate = normalizeDate(t.date);
        
+        // 현재 시간을 타임스탬프로 사용
+        const timestamp = t.localTimestamp || uploadStartTime;
+        
        const transactionData = {
          user_id: userId,
          title: t.title || '무제',
@@ -53,13 +122,24 @@ export const uploadTransactions = async (userId: string): Promise<void> => {
          category: t.category || '기타',
          type: t.type || 'expense',
          transaction_id: t.id,
-          notes: t.notes || null
+          notes: t.notes || null,
+          updated_at: timestamp
        };
        
-        if (existingIds.has(t.id)) {
-          updateTransactions.push(transactionData);
+        // 서버에 이미 존재하는지 확인
+        if (existingMap.has(t.id)) {
+          // 서버 타임스탬프와 비교
+          const serverTimestamp = existingMap.get(t.id);
+          // 로컬 데이터가 더 최신인 경우만 업데이트
+          if (!serverTimestamp || timestamp > serverTimestamp) {
+            updateTransactions.push(transactionData);
+            console.log(`[동기화] 업데이트 필요: ${t.id} - ${t.title} (로컬: ${timestamp}, 서버: ${serverTimestamp || '없음'})`);
+          } else {
+            console.log(`[동기화] 업데이트 불필요: ${t.id} - ${t.title} (로컬: ${timestamp}, 서버: ${serverTimestamp})`);
+          }
        } else {
          newTransactions.push(transactionData);
+          console.log(`[동기화] 새 항목 추가: ${t.id} - ${t.title}`);
        }
      } catch (err) {
        console.error(`[동기화] 트랜잭션 처리 중 오류 (ID: ${t.id}):`, err);
@@ -69,33 +149,37 @@ export const uploadTransactions = async (userId: string): Promise<void> => {
    
    // 새 트랜잭션 삽입 (있는 경우) - 배치 처리
    if (newTransactions.length > 0) {
-      console.log(`${newTransactions.length}개의 새 트랜잭션 업로드`);
+      console.log(`[동기화] ${newTransactions.length}개의 새 트랜잭션 업로드`);
      
      // 대용량 데이터 처리를 위해 배치 처리 (최대 100개씩)
      const batchSize = 100;
      for (let i = 0; i < newTransactions.length; i += batchSize) {
        const batch = newTransactions.slice(i, i + batchSize);
+        console.log(`[동기화] 새 트랜잭션 배치 업로드 중: ${i+1}~${Math.min(i+batch.length, newTransactions.length)}/${newTransactions.length}`);
+        
        const { error: insertError } = await supabase
          .from('transactions')
          .insert(batch);
          
        if (insertError) {
-          console.error(`[동기화] 새 트랜잭션 배치 업로드 실패 (${i}~${i + batch.length}):`, insertError);
+          console.error(`[동기화] 새 트랜잭션 배치 업로드 실패:`, insertError);
          console.error('[동기화] 오류 상세:', JSON.stringify(insertError, null, 2));
          // 배치 실패해도 다음 배치 계속 시도
+        } else {
+          console.log(`[동기화] 새 트랜잭션 배치 업로드 성공: ${batch.length}개`);
        }
      }
    }
    
    // 기존 트랜잭션 업데이트 (있는 경우) - 배치 처리
    if (updateTransactions.length > 0) {
-      console.log(`${updateTransactions.length}개의 기존 트랜잭션 업데이트`);
+      console.log(`[동기화] ${updateTransactions.length}개의 기존 트랜잭션 업데이트`);
      
      // 대용량 데이터 처리를 위해 배치 처리 (최대 50개씩)
-      // 업데이트는 개별 쿼리보다 효율적이지만 삽입보다는 복잡하므로 더 작은 배치 크기 사용
      const batchSize = 50;
      for (let i = 0; i < updateTransactions.length; i += batchSize) {
        const batch = updateTransactions.slice(i, i + batchSize);
+        console.log(`[동기화] 트랜잭션 업데이트 배치 처리 중: ${i+1}~${Math.min(i+batch.length, updateTransactions.length)}/${updateTransactions.length}`);
        
        // 배치 내 트랜잭션을 병렬로 업데이트 (Promise.all 사용)
        const updatePromises = batch.map(transaction => 
@@ -115,9 +199,11 @@ export const uploadTransactions = async (userId: string): Promise<void> => {
            errors.forEach(err => {
              console.error('[동기화] 업데이트 오류:', err.error);
            });
+          } else {
+            console.log(`[동기화] 트랜잭션 업데이트 배치 성공: ${batch.length}개`);
          }
        } catch (batchError) {
-          console.error(`[동기화] 트랜잭션 배치 업데이트 실패 (${i}~${i + batch.length}):`, batchError);
+          console.error(`[동기화] 트랜잭션 배치 업데이트 실패:`, batchError);
          // 배치 실패해도 다음 배치 계속 시도
        }
      }
--- a/src/utils/sync/transactionSync.ts
+++ b/src/utils/sync/transactionSync.ts
@@ -10,8 +10,49 @@ export {
  downloadTransactions
 };

-// 서버에서 트랜잭션 삭제 함수 - 임시로 No-op 함수 구현
+// 서버에서 트랜잭션 삭제 함수 - 실제 구현
 export const deleteTransactionFromServer = async (userId: string, transactionId: string): Promise<boolean> => {
-  console.log(`트랜잭션 삭제 요청: userId=${userId}, transactionId=${transactionId}`);
-  return true; // 임시로 성공 반환
+  try {
+    console.log(`[동기화] 서버 트랜잭션 삭제 시작: userId=${userId}, transactionId=${transactionId}`);
+    
+    // Supabase 클라이언트 동적 임포트 (순환 참조 방지)
+    const { supabase } = await import('@/lib/supabase');
+    
+    // 트랜잭션 존재 여부 확인
+    const { data: checkData, error: checkError } = await supabase
+      .from('transactions')
+      .select('transaction_id')
+      .eq('user_id', userId)
+      .eq('transaction_id', transactionId)
+      .maybeSingle();
+      
+    if (checkError) {
+      console.error(`[동기화] 트랜잭션 확인 오류: ${checkError.message}`, checkError);
+      return false;
+    }
+    
+    // 트랜잭션이 존재하지 않으면 이미 삭제된 것으로 간주
+    if (!checkData) {
+      console.log(`[동기화] 트랜잭션 이미 삭제됨: ${transactionId}`);
+      return true;
+    }
+    
+    // 서버에서 트랜잭션 삭제
+    const { error: deleteError } = await supabase
+      .from('transactions')
+      .delete()
+      .eq('user_id', userId)
+      .eq('transaction_id', transactionId);
+      
+    if (deleteError) {
+      console.error(`[동기화] 트랜잭션 삭제 실패: ${deleteError.message}`, deleteError);
+      return false;
+    }
+    
+    console.log(`[동기화] 서버 트랜잭션 삭제 성공: ${transactionId}`);
+    return true;
+  } catch (error) {
+    console.error(`[동기화] 트랜잭션 삭제 중 예외 발생:`, error);
+    return false;
+  }
 };