117 lines
4.0 KiB
TypeScript
117 lines
4.0 KiB
TypeScript
|
|
import { useState, useEffect, useCallback } from 'react';
|
|
import {
|
|
loadCategoryBudgetsFromStorage,
|
|
saveCategoryBudgetsToStorage,
|
|
clearAllCategoryBudgets
|
|
} from '../storage';
|
|
|
|
// 카테고리 예산 상태 관리 훅
|
|
export const useCategoryBudgetState = () => {
|
|
const [categoryBudgets, setCategoryBudgets] = useState<Record<string, number>>(
|
|
loadCategoryBudgetsFromStorage()
|
|
);
|
|
const [isInitialized, setIsInitialized] = useState(false);
|
|
|
|
// 초기 로드 및 이벤트 리스너 설정
|
|
useEffect(() => {
|
|
const loadCategories = () => {
|
|
try {
|
|
console.log('카테고리 예산 로드 시도 중...');
|
|
const loaded = loadCategoryBudgetsFromStorage();
|
|
console.log('카테고리 예산 로드됨:', loaded);
|
|
setCategoryBudgets(loaded);
|
|
|
|
// 최근 데이터 로드 시간 기록
|
|
localStorage.setItem('lastCategoryBudgetLoadTime', new Date().toISOString());
|
|
|
|
if (!isInitialized) {
|
|
setIsInitialized(true);
|
|
}
|
|
} catch (error) {
|
|
console.error('카테고리 예산 로드 중 오류:', error);
|
|
}
|
|
};
|
|
|
|
// 초기 로드
|
|
loadCategories();
|
|
|
|
// 이벤트 리스너 설정
|
|
const handleCategoryUpdate = (e?: StorageEvent) => {
|
|
console.log('카테고리 예산 업데이트 이벤트 감지:', e?.key);
|
|
if (!e || e.key === 'categoryBudgets' || e.key === null) {
|
|
loadCategories();
|
|
}
|
|
};
|
|
|
|
window.addEventListener('categoryBudgetsUpdated', () => handleCategoryUpdate());
|
|
window.addEventListener('storage', handleCategoryUpdate);
|
|
window.addEventListener('visibilitychange', () => {
|
|
if (document.visibilityState === 'visible') {
|
|
console.log('페이지 보임: 카테고리 예산 새로고침');
|
|
loadCategories();
|
|
}
|
|
});
|
|
window.addEventListener('focus', () => {
|
|
console.log('창 포커스: 카테고리 예산 새로고침');
|
|
loadCategories();
|
|
});
|
|
|
|
// 주기적 데이터 검사
|
|
const intervalId = setInterval(() => {
|
|
const lastSaveTime = localStorage.getItem('lastCategoryBudgetSaveTime');
|
|
const lastLoadTime = localStorage.getItem('lastCategoryBudgetLoadTime');
|
|
|
|
if (lastSaveTime && lastLoadTime && new Date(lastSaveTime) > new Date(lastLoadTime)) {
|
|
console.log('새로운 카테고리 저장 감지됨, 데이터 다시 로드...');
|
|
loadCategories();
|
|
}
|
|
}, 1000);
|
|
|
|
return () => {
|
|
window.removeEventListener('categoryBudgetsUpdated', () => handleCategoryUpdate());
|
|
window.removeEventListener('storage', handleCategoryUpdate);
|
|
window.removeEventListener('visibilitychange', () => {});
|
|
window.removeEventListener('focus', () => loadCategories());
|
|
clearInterval(intervalId);
|
|
};
|
|
}, [isInitialized]);
|
|
|
|
// 카테고리 예산 업데이트 함수
|
|
const updateCategoryBudgets = useCallback((newCategoryBudgets: Record<string, number>) => {
|
|
try {
|
|
console.log('카테고리 예산 업데이트:', newCategoryBudgets);
|
|
setCategoryBudgets(newCategoryBudgets);
|
|
saveCategoryBudgetsToStorage(newCategoryBudgets);
|
|
|
|
// 저장 시간 업데이트
|
|
localStorage.setItem('lastCategoryBudgetSaveTime', new Date().toISOString());
|
|
} catch (error) {
|
|
console.error('카테고리 예산 업데이트 중 오류:', error);
|
|
}
|
|
}, []);
|
|
|
|
// 카테고리 예산 초기화 함수
|
|
const resetCategoryBudgets = useCallback(() => {
|
|
try {
|
|
console.log('카테고리 예산 초기화');
|
|
clearAllCategoryBudgets();
|
|
setCategoryBudgets(loadCategoryBudgetsFromStorage());
|
|
} catch (error) {
|
|
console.error('카테고리 예산 초기화 중 오류:', error);
|
|
}
|
|
}, []);
|
|
|
|
// 카테고리 예산 변경 시 로그 기록
|
|
useEffect(() => {
|
|
console.log('최신 카테고리 예산:', categoryBudgets);
|
|
}, [categoryBudgets]);
|
|
|
|
return {
|
|
categoryBudgets,
|
|
setCategoryBudgets: updateCategoryBudgets,
|
|
updateCategoryBudgets,
|
|
resetCategoryBudgets
|
|
};
|
|
};
|