ZELLYY/zellyy-finance
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Ensure useBudget is within BudgetProvider

Browse Source 
The useBudget hook was throwing an error when used outside of a BudgetProvider. This commit ensures that the useBudget hook is always used within a BudgetProvider to prevent this error.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-15 16:32:07 +00:00
parent 2fa7423071
commit 1136683b57
2 changed files with 51 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src/App.tsx
View File

@@ -19,6 +19,7 @@ import ForgotPassword from './pages/ForgotPassword';
import Analytics from './pages/Analytics'; import Analytics from './pages/Analytics';
import PaymentMethods from './pages/PaymentMethods'; import PaymentMethods from './pages/PaymentMethods';
import Settings from './pages/Settings'; import Settings from './pages/Settings';
import { BudgetProvider } from './contexts/BudgetContext';
// 전역 오류 핸들러 // 전역 오류 핸들러
const handleError = (error: any) => { const handleError = (error: any) => {
@@ -74,30 +75,32 @@ function App() {
return ( return (
<ErrorBoundary> <ErrorBoundary>
<AuthContextWrapper> <AuthContextWrapper>
<Router> <BudgetProvider>
<div className="flex flex-col min-h-screen"> <Router>
<NavBar /> <div className="flex flex-col min-h-screen">
<div className="flex-grow"> <NavBar />
<Routes> <div className="flex-grow">
<Route path="/" element={<Index />} /> <Routes>
<Route path="/login" element={<Login />} /> <Route path="/" element={<Index />} />
<Route path="/register" element={<Register />} /> <Route path="/login" element={<Login />} />
<Route path="/profile" element={<ProfileManagement />} /> <Route path="/register" element={<Register />} />
<Route path="/settings" element={<Settings />} /> <Route path="/profile" element={<ProfileManagement />} />
<Route path="/supabase-settings" element={<SupabaseSettings />} /> <Route path="/settings" element={<Settings />} />
<Route path="/transactions" element={<Transactions />} /> <Route path="/supabase-settings" element={<SupabaseSettings />} />
<Route path="/security-privacy" element={<SecurityPrivacySettings />} /> <Route path="/transactions" element={<Transactions />} />
<Route path="/notifications" element={<NotificationSettings />} /> <Route path="/security-privacy" element={<SecurityPrivacySettings />} />
<Route path="/help-support" element={<HelpSupport />} /> <Route path="/notifications" element={<NotificationSettings />} />
<Route path="/forgot-password" element={<ForgotPassword />} /> <Route path="/help-support" element={<HelpSupport />} />
<Route path="/analytics" element={<Analytics />} /> <Route path="/forgot-password" element={<ForgotPassword />} />
<Route path="/payment-methods" element={<PaymentMethods />} /> <Route path="/analytics" element={<Analytics />} />
<Route path="*" element={<NotFound />} /> <Route path="/payment-methods" element={<PaymentMethods />} />
</Routes> <Route path="*" element={<NotFound />} />
</Routes>
</div>
<Toaster />
</div> </div>
<Toaster /> </Router>
</div> </BudgetProvider>
</Router>
</AuthContextWrapper> </AuthContextWrapper>
</ErrorBoundary> </ErrorBoundary>
); );

59
src/pages/Index.tsx
View File

@@ -7,10 +7,10 @@ import BudgetProgressCard from '@/components/BudgetProgressCard';
import BudgetCategoriesSection from '@/components/BudgetCategoriesSection'; import BudgetCategoriesSection from '@/components/BudgetCategoriesSection';
import RecentTransactionsSection from '@/components/RecentTransactionsSection'; import RecentTransactionsSection from '@/components/RecentTransactionsSection';
import { formatCurrency, calculatePercentage } from '@/utils/formatters'; import { formatCurrency, calculatePercentage } from '@/utils/formatters';
import { BudgetProvider, useBudget } from '@/contexts/BudgetContext'; import { useBudget } from '@/contexts/BudgetContext';
// 메인 컴포넌트 // 메인 컴포넌트
const IndexContent = () => { const Index = () => {
const { const {
transactions, transactions,
budgetData, budgetData,
@@ -22,43 +22,34 @@ const IndexContent = () => {
} = useBudget(); } = useBudget();
return ( return (
<div className="max-w-md mx-auto px-6"> <div className="min-h-screen bg-neuro-background pb-24">
<Header /> <div className="max-w-md mx-auto px-6">
<Header />
{/* 목표 진행 상황 */} {/* 목표 진행 상황 */}
<h2 className="text-lg font-semibold mb-3">예산과 지출</h2> <h2 className="text-lg font-semibold mb-3">예산과 지출</h2>
<BudgetProgressCard <BudgetProgressCard
budgetData={budgetData} budgetData={budgetData}
selectedTab={selectedTab} selectedTab={selectedTab}
setSelectedTab={setSelectedTab} setSelectedTab={setSelectedTab}
formatCurrency={formatCurrency} formatCurrency={formatCurrency}
calculatePercentage={calculatePercentage} calculatePercentage={calculatePercentage}
onSaveBudget={handleBudgetGoalUpdate} onSaveBudget={handleBudgetGoalUpdate}
/> />
{/* 지출 카테고리 */} {/* 지출 카테고리 */}
<BudgetCategoriesSection categories={getCategorySpending()} /> <BudgetCategoriesSection categories={getCategorySpending()} />
{/* 최근 지출 */} {/* 최근 지출 */}
<RecentTransactionsSection <RecentTransactionsSection
transactions={transactions.slice(0, 5)} transactions={transactions.slice(0, 5)}
onUpdateTransaction={updateTransaction} onUpdateTransaction={updateTransaction}
/> />
</div>
<AddTransactionButton />
<NavBar />
</div> </div>
); );
}; };
// Provider를 감싼 컨테이너 컴포넌트
const Index = () => {
return (
<BudgetProvider>
<div className="min-h-screen bg-neuro-background pb-24">
<IndexContent />
<AddTransactionButton />
<NavBar />
</div>
</BudgetProvider>
);
};
export default Index; export default Index;