주문 페이지 코드 정리 및 수정

[hwangdae]

작업 내용

1. 주문 페이지 스켈레톤 코드 분리
2. 주문 대기 페이지 코드 정리
3. API 코드 수정

문제점 및 어려움

해결 방안

공유 사항

Summary by CodeRabbit

• New Features

  • Added skeleton loading screens for menu and order data to improve visual feedback during loading
  • Enhanced order details display with improved card-based presentation

• Improvements

  • Refined payment workflow for better user experience
  • Adjusted UI spacing and layout for improved visual balance

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Caution

Review failed

The pull request is closed.

📝 Walkthrough

Walkthrough

Centralizes HTTP API client configuration into separate authApi and publicApi instances, refactors components to use extracted sub-components (MenuListSkeleton, OrderCard), simplifies component logic with computed variables, and reorganizes remittance payment flow with type-safe handling.

Changes

Cohort / File(s)	Change Summary
API Client Configuration apps/nowait-user/src/api/client.ts	New module establishing two pre-configured Axios instances: authApi (credentials enabled) and publicApi (no credentials), both with base URL from VITE_SERVER_URI/v1.
API Module Migration apps/nowait-user/src/api/menu.ts, apps/nowait-user/src/api/order.ts	Replaced local Axios instance and baseURL configuration with centralized authApi and publicApi clients for API requests.
Menu Components apps/nowait-user/src/components/common/MenuList.tsx, apps/nowait-user/src/components/common/MenuListSkeleton.tsx	Extracted skeleton UI into separate MenuListSkeleton component; MenuList now imports and renders skeleton on loading state instead of inline grid.
Order Details Refactoring apps/nowait-user/src/pages/order/orderDetails/OrderDetailsPage.tsx, apps/nowait-user/src/pages/order/orderDetails/components/OrderCard.tsx	Extracted order rendering logic into new OrderCard component; removed inline type definitions and status mapping from parent page.
Cart and Layout Optimization apps/nowait-user/src/pages/order/home/StorePage.tsx	Introduced computed variables for cart presence (hasCartItems) and layout padding (pagePaddingBottom); removed key prop dependency on cart.length.
Remittance Flow Enhancement apps/nowait-user/src/pages/order/remittance/RemittancePage.tsx	Introduced centralized REMIT_TYPE constant, RemitType type, and utility functions (getDefaultRemitValue, validatePayer); refactored order and modal confirmation flows with explicit validation and URL handling.
Store Detail Styling apps/nowait-user/src/pages/waiting/storeDetail/StoreDetailPage.tsx	Added pb-[100px] bottom padding to outer container for layout spacing.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant RemittancePage as Remittance Page
    participant Modal as Confirm Modal
    participant PaymentProvider as Payment Provider
    participant App as App Router

    User->>RemittancePage: Click Order Button
    RemittancePage->>RemittancePage: validatePayer()
    alt Validation Fails
        RemittancePage->>User: Focus Error Field
    else Validation Passes
        RemittancePage->>Modal: Open (handleConfirm)
        User->>Modal: Confirm Payment
        Modal->>Modal: Map RemitType to URL
        alt Payment URL Available
            Modal->>PaymentProvider: Open Payment in New Tab
        end
        Modal->>App: Navigate to /remittanceWait
        App->>User: Display Wait Page
    end

Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

• API 경로 수정 #565: Modifies the same API files (menu.ts, order.ts) to add /v1 prefix handling, directly overlapping with client centralization logic.
• feat: 주문api 수정 #478: Replaces direct Axios calls with a centralized API client pattern, mirroring the same architectural approach.
• feat: 주문 페이지 라우터 수정 #472: Refactors OrderDetailsPage.tsx with component extraction and hook adjustments, sharing the same page-level changes.

Suggested reviewers

• oriNuguri25
• dgKim1

Poem

🐰 With clients now unified, authApi takes the lead,
While public calls hop freely—all they need!
Components extracted, remittance flows refined,
Skeleton screens shimmer, a skeleton so kind. ✨
Payment URLs dance, and modals take their bow—
This refactor's complete, let's celebrate meow! 🎉

✨ Finishing touches

• 📝 Generate docstrings

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}