fix: BudgetProvider 및 isMobile 오류 수정

- App.tsx에 BudgetProvider 추가로 지출 페이지 오류 해결
- SummaryCards 컴포넌트에 useIsMobile 훅 import 추가로 분석 페이지 오류 해결
- 모든 페이지가 정상적으로 작동하도록 수정

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
hansoo
2025-07-14 14:25:49 +09:00
parent 3934ab933f
commit 3225d0492b
2 changed files with 69 additions and 64 deletions

View File

@@ -37,6 +37,7 @@ import {
ClerkProvider, ClerkProvider,
ClerkDebugInfo, ClerkDebugInfo,
} from "./components/providers/ClerkProvider"; } from "./components/providers/ClerkProvider";
import { BudgetProvider } from "./contexts/budget/BudgetContext";
// 페이지 컴포넌트들을 개선된 레이지 로딩으로 변경 (ChunkLoadError 재시도 포함) // 페이지 컴포넌트들을 개선된 레이지 로딩으로 변경 (ChunkLoadError 재시도 포함)
const Index = createLazyComponent(() => import("./pages/Index")); const Index = createLazyComponent(() => import("./pages/Index"));
@@ -380,6 +381,7 @@ function App() {
fallback={<ErrorScreen error={error} retry={handleRetry} />} fallback={<ErrorScreen error={error} retry={handleRetry} />}
showDialog={false} showDialog={false}
> >
<BudgetProvider>
<BasicLayout> <BasicLayout>
<PageTracker /> <PageTracker />
<Suspense fallback={<PageLoadingSpinner />}> <Suspense fallback={<PageLoadingSpinner />}>
@@ -451,6 +453,7 @@ function App() {
<ClerkDebugControl /> <ClerkDebugControl />
</Suspense> </Suspense>
</BasicLayout> </BasicLayout>
</BudgetProvider>
{isDevMode && <ReactQueryDevtools initialIsOpen={false} />} {isDevMode && <ReactQueryDevtools initialIsOpen={false} />}
</SentryErrorBoundary> </SentryErrorBoundary>
</QueryClientProvider> </QueryClientProvider>

View File

@@ -1,6 +1,7 @@
import React from "react"; import React from "react";
import { Wallet, CreditCard, Coins } from "lucide-react"; import { Wallet, CreditCard, Coins } from "lucide-react";
import { formatCurrency } from "@/utils/currencyFormatter"; import { formatCurrency } from "@/utils/currencyFormatter";
import { useIsMobile } from "@/hooks/use-mobile";
interface SummaryCardsProps { interface SummaryCardsProps {
totalBudget: number; totalBudget: number;
totalExpense: number; totalExpense: number;
@@ -11,6 +12,7 @@ const SummaryCards: React.FC<SummaryCardsProps> = ({
totalExpense, totalExpense,
_savingsPercentage, _savingsPercentage,
}) => { }) => {
const isMobile = useIsMobile();
// 남은 예산 계산 // 남은 예산 계산
const remainingBudget = totalBudget - totalExpense; const remainingBudget = totalBudget - totalExpense;
const isOverBudget = remainingBudget < 0; const isOverBudget = remainingBudget < 0;