Handle data reset with cloud sync

The prompt requests clarification on whether data reset should also delete cloud data when the user is logged in.

src/components/security/DataResetSection.tsx

@@ -1,10 +1,12 @@
 
 import React, { useState } from 'react';
-import { Trash2, Loader2 } from 'lucide-react';
+import { Trash2, Loader2, CloudOff } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { useToast } from '@/hooks/useToast.wrapper';
 import { useNavigate } from 'react-router-dom';
 import { resetAllStorageData } from '@/utils/storageUtils';
+import { clearCloudData } from '@/utils/syncUtils';
+import { useAuth } from '@/contexts/auth/AuthProvider';
 import { 
   Dialog,
   DialogContent,
@@ -18,15 +20,34 @@ import {
 const DataResetSection = () => {
   const [isResetDialogOpen, setIsResetDialogOpen] = useState(false);
   const [isResetting, setIsResetting] = useState(false);
+  const [isCloudResetSuccess, setIsCloudResetSuccess] = useState<boolean | null>(null);
   const { toast } = useToast();
   const navigate = useNavigate();
+  const { user } = useAuth();
 
-  const handleResetAllData = () => {
+  const handleResetAllData = async () => {
     // 데이터 초기화 수행
     try {
       setIsResetting(true);
       console.log('모든 데이터 초기화 시작');
       
+      // 클라우드 데이터 초기화 먼저 시도 (로그인 상태인 경우)
+      let cloudResetSuccess = false;
+      if (user) {
+        console.log('로그인 상태: 클라우드 데이터 초기화 시도');
+        cloudResetSuccess = await clearCloudData(user.id);
+        setIsCloudResetSuccess(cloudResetSuccess);
+        
+        if (cloudResetSuccess) {
+          console.log('클라우드 데이터 초기화 성공');
+        } else {
+          console.warn('클라우드 데이터 초기화 실패 또는 부분 성공');
+        }
+      } else {
+        console.log('로그인하지 않음: 클라우드 초기화 건너뜀');
+        setIsCloudResetSuccess(null);
+      }
+      
       // 초기화 실행 전에 사용자 설정 백업
       const dontShowWelcomeValue = localStorage.getItem('dontShowWelcome');
       const hasVisitedBefore = localStorage.getItem('hasVisitedBefore');
@@ -77,10 +98,27 @@ const DataResetSection = () => {
       window.dispatchEvent(new StorageEvent('storage'));
       
       setTimeout(() => {
-        toast({
-          title: "모든 데이터가 초기화되었습니다.",
-          description: "모든 예산, 지출 내역, 설정이 초기화되었습니다.",
-        });
+        // 클라우드 초기화 상태에 따라 다른 메시지 표시
+        if (user) {
+          if (cloudResetSuccess) {
+            toast({
+              title: "모든 데이터가 초기화되었습니다.",
+              description: "로컬 및 클라우드의 모든 데이터가 초기화되었습니다.",
+            });
+          } else {
+            toast({
+              title: "로컬 데이터만 초기화됨",
+              description: "로컬 데이터는 초기화되었지만, 클라우드 데이터 초기화 중 문제가 발생했습니다.",
+              variant: "destructive"
+            });
+          }
+        } else {
+          toast({
+            title: "모든 데이터가 초기화되었습니다.",
+            description: "모든 예산, 지출 내역, 설정이 초기화되었습니다.",
+          });
+        }
+        
         setIsResetDialogOpen(false);
         console.log('모든 데이터 초기화 완료');
         
@@ -108,7 +146,9 @@ const DataResetSection = () => {
           </div>
           <div className="text-left">
             <h3 className="font-medium">데이터 초기화</h3>
-            <p className="text-xs text-gray-500 mt-1">모든 예산, 지출 내역, 설정이 초기화됩니다.</p>
+            <p className="text-xs text-gray-500 mt-1">
+              {user ? "로컬 및 클라우드의 모든 예산, 지출 내역이 초기화됩니다." : "모든 예산, 지출 내역, 설정이 초기화됩니다."}
+            </p>
           </div>
         </div>
         <Button 
@@ -127,8 +167,20 @@ const DataResetSection = () => {
           <DialogHeader>
             <DialogTitle>정말 모든 데이터를 초기화하시겠습니까?</DialogTitle>
             <DialogDescription>
-              이 작업은 되돌릴 수 없으며, 모든 예산, 지출 내역, 설정이 영구적으로 삭제됩니다.
-              단, '환영합니다' 화면 표시 설정과 로그인 상태는 유지됩니다.
+              {user ? (
+                <>
+                  이 작업은 되돌릴 수 없으며, 로컬 및 클라우드에 저장된 모든 예산, 지출 내역이 영구적으로 삭제됩니다.
+                  <div className="flex items-center mt-2 text-amber-600">
+                    <CloudOff size={16} className="mr-2" /> 
+                    클라우드 데이터도 함께 삭제됩니다.
+                  </div>
+                </>
+              ) : (
+                "이 작업은 되돌릴 수 없으며, 모든 예산, 지출 내역, 설정이 영구적으로 삭제됩니다."
+              )}
+              <div className="mt-2">
+                단, '환영합니다' 화면 표시 설정과 로그인 상태는 유지됩니다.
+              </div>
             </DialogDescription>
           </DialogHeader>
           <DialogFooter className="flex flex-col sm:flex-row gap-2 sm:gap-0">
@@ -145,7 +197,7 @@ const DataResetSection = () => {
                   <Loader2 className="mr-2 h-4 w-4 animate-spin" />
                   초기화 중...
                 </>
-              ) : '확인, 모든 데이터 초기화'}
+              ) : user ? '확인, 로컬 및 클라우드 데이터 초기화' : '확인, 모든 데이터 초기화'}
             </Button>
           </DialogFooter>
         </DialogContent>