Fix budget data persistence issue
Addresses the problem where budget data was not persisting across page transitions, causing budget and expense information to disappear from the expense page and only expense data to appear on the analytics page.
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
|
||||
import React, { useState } from 'react';
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import NavBar from '@/components/NavBar';
|
||||
import TransactionCard from '@/components/TransactionCard';
|
||||
import AddTransactionButton from '@/components/AddTransactionButton';
|
||||
@@ -23,6 +23,14 @@ const Transactions = () => {
|
||||
} = useTransactions();
|
||||
|
||||
const { budgetData } = useBudget();
|
||||
const [isDataLoaded, setIsDataLoaded] = useState(false);
|
||||
|
||||
// 데이터 로드 상태 관리
|
||||
useEffect(() => {
|
||||
if (budgetData && !isLoading) {
|
||||
setIsDataLoaded(true);
|
||||
}
|
||||
}, [budgetData, isLoading]);
|
||||
|
||||
// 트랜잭션을 날짜별로 그룹화
|
||||
const groupedTransactions: Record<string, typeof transactions> = {};
|
||||
@@ -35,6 +43,31 @@ const Transactions = () => {
|
||||
groupedTransactions[datePart].push(transaction);
|
||||
});
|
||||
|
||||
// 페이지 포커스나 가시성 변경 시 데이터 새로고침
|
||||
useEffect(() => {
|
||||
const handleVisibilityChange = () => {
|
||||
if (document.visibilityState === 'visible') {
|
||||
console.log('거래내역 페이지 보임 - 데이터 새로고침');
|
||||
// 상태 업데이트 트리거
|
||||
setIsDataLoaded(prev => !prev);
|
||||
}
|
||||
};
|
||||
|
||||
const handleFocus = () => {
|
||||
console.log('거래내역 페이지 포커스 - 데이터 새로고침');
|
||||
// 상태 업데이트 트리거
|
||||
setIsDataLoaded(prev => !prev);
|
||||
};
|
||||
|
||||
document.addEventListener('visibilitychange', handleVisibilityChange);
|
||||
window.addEventListener('focus', handleFocus);
|
||||
|
||||
return () => {
|
||||
document.removeEventListener('visibilitychange', handleVisibilityChange);
|
||||
window.removeEventListener('focus', handleFocus);
|
||||
};
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-neuro-background pb-24">
|
||||
<div className="max-w-md mx-auto px-6">
|
||||
@@ -81,7 +114,7 @@ const Transactions = () => {
|
||||
<div className="neuro-card">
|
||||
<p className="text-sm text-gray-500 mb-1">총 예산</p>
|
||||
<p className="text-lg font-bold text-neuro-income">
|
||||
{formatCurrency(budgetData.monthly.targetAmount)}
|
||||
{formatCurrency(budgetData?.monthly?.targetAmount || 0)}
|
||||
</p>
|
||||
</div>
|
||||
<div className="neuro-card">
|
||||
|
||||
Reference in New Issue
Block a user