043db23836
The sync setting was not consistently being disabled in certain scenarios. This change ensures that the sync setting is properly disabled when expected.
85 lines
2.6 KiB
TypeScript
85 lines
2.6 KiB
TypeScript
|
|
import React, { useEffect } from 'react';
|
|
import { Switch } from "@/components/ui/switch";
|
|
import { Label } from "@/components/ui/label";
|
|
import { CloudUpload } from "lucide-react";
|
|
import { useSyncSettings } from '@/hooks/useSyncSettings';
|
|
import SyncStatus from '@/components/sync/SyncStatus';
|
|
import SyncExplanation from '@/components/sync/SyncExplanation';
|
|
import { isSyncEnabled } from '@/utils/sync/syncSettings';
|
|
|
|
const SyncSettings = () => {
|
|
const {
|
|
enabled,
|
|
syncing,
|
|
user,
|
|
lastSync,
|
|
handleSyncToggle,
|
|
handleManualSync
|
|
} = useSyncSettings();
|
|
|
|
// 동기화 설정 변경 모니터링
|
|
useEffect(() => {
|
|
const checkSyncStatus = () => {
|
|
const currentStatus = isSyncEnabled();
|
|
console.log('현재 동기화 상태:', currentStatus ? '활성화됨' : '비활성화됨');
|
|
};
|
|
|
|
// 초기 상태 확인
|
|
checkSyncStatus();
|
|
|
|
// 스토리지 변경 이벤트에도 동기화 상태 확인 추가
|
|
const handleStorageChange = () => {
|
|
checkSyncStatus();
|
|
};
|
|
|
|
window.addEventListener('storage', handleStorageChange);
|
|
window.addEventListener('auth-state-changed', handleStorageChange);
|
|
|
|
return () => {
|
|
window.removeEventListener('storage', handleStorageChange);
|
|
window.removeEventListener('auth-state-changed', handleStorageChange);
|
|
};
|
|
}, []);
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
{/* 동기화 토글 컨트롤 */}
|
|
<div className="flex items-center justify-between">
|
|
<div className="space-y-0.5">
|
|
<div className="flex items-center gap-2">
|
|
<CloudUpload className="h-5 w-5 text-neuro-income" />
|
|
<Label htmlFor="sync-toggle" className="text-base font-medium">
|
|
데이터 클라우드 동기화
|
|
</Label>
|
|
</div>
|
|
<p className="text-sm text-muted-foreground">
|
|
여러 기기에서 예산 및 지출 데이터를 동기화합니다.
|
|
</p>
|
|
</div>
|
|
<Switch
|
|
id="sync-toggle"
|
|
checked={enabled}
|
|
onCheckedChange={handleSyncToggle}
|
|
className="data-[state=checked]:bg-neuro-income"
|
|
disabled={!user && enabled} // 사용자가 로그아웃 상태이면서 동기화가 켜져있을 때 비활성화
|
|
/>
|
|
</div>
|
|
|
|
{/* 동기화 상태 및 동작 */}
|
|
<SyncStatus
|
|
enabled={enabled}
|
|
syncing={syncing}
|
|
lastSync={lastSync}
|
|
user={user}
|
|
onManualSync={handleManualSync}
|
|
/>
|
|
|
|
{/* 동기화 설명 */}
|
|
<SyncExplanation enabled={enabled} />
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default SyncSettings;
|