[FEAT](apps/market-owner): DCMSM-77 기간 할인 전단 미리보기 API 연결 - #145
Conversation
…-CLIENT into feat/apps-market-owner/DCMSM-77-periodic-flyer-preview-api
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: ASSERTIVE Plan: Pro Plus Run ID: 📒 Files selected for processing (16)
💤 Files with no reviewable changes (1)
📝 WalkthroughSummary by CodeRabbit
Walkthrough영업시간 기능을 shared 패키지로 통합하고 시장 화면의 사용처를 갱신했습니다. 전단 공유 화면에는 기간 미리보기 API, 뷰모델, 상태 처리와 데이터 기반 모바일 프리뷰를 추가했으며, 상품 할인 배지를 Changes시장 영업시간 및 카테고리 레이아웃
전단 미리보기 조회 및 렌더링
상품 할인 배지 변경
Estimated code review effort: 4 (Complex) | ~60 minutes Suggested labels: Suggested reviewers: 🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 ESLint
ESLint install failed. For unrecoverable errors, disable the tool in CodeRabbit configuration. 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. Comment |
|
Client Web Storybook preview URL: https://6a4c88aec2c843ae77534861-degoxfzewh.chromatic.com/ |
|
Market Owner Web Storybook preview URL: https://6a4c877d560fcdcfebe6e6d8-woodrvdlnm.chromatic.com/ |
There was a problem hiding this comment.
Actionable comments posted: 7
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@apps/client/src/domains/market/market-products/sections/MarketOverviewSection.tsx`:
- Around line 4-8: Update MarketOverviewSection to import BusinessHourTypes
directly from `@dongchimi/shared` alongside formatBusinessHour, and remove its
type import from market-products.fixture so the component no longer depends on
the fixture module.
In `@apps/market-owner/src/domains/leaflet/share/LeafletSharePage.test.tsx`:
- Around line 116-118: In the test around the initial render and “전단 공유하기”
interaction, move the mockedGetPeriodicPreview(12) assertion to immediately
after awaiting the UI rendered from the initial data fetch, before clicking the
button. Keep the button click and its related assertions separate so the test
does not imply the click triggers preview retrieval.
In `@apps/market-owner/src/domains/leaflet/share/LeafletSharePage.tsx`:
- Around line 170-174: LeafletSharePage의 미리보기 상태 전달을 실제 최초 로딩과 refetch 오류로
분리하세요. periodicPreviewQuery의 isPending 대신 isLoading 또는 fetchStatus를 사용해 최초 요청 중일
때만 isPreviewPending을 true로 설정하고, leafletPreview 데이터가 있으면 refetch 오류가 발생해도 미리보기를
유지하세요. 오류 상태와 onPreviewRetry는 데이터 유무와 독립적으로 별도 표시되도록 관련 props를 조정하세요.
In
`@apps/market-owner/src/domains/leaflet/share/model/leaflet-preview-view-model.ts`:
- Line 4: LeafletPreviewViewModel의 계약이 LeafletSummaryFixture에 의존하지 않도록 수정하세요. 해당
fixture 타입 import를 제거하고 모델 파일에 summary 전용 인터페이스를 선언한 뒤, LeafletPreviewViewModel이
이를 사용하게 하세요. LeafletSummaryFixture는 새 인터페이스를 구현하거나 호환되도록 변경해 fixture가 모델 계약을 따르는
의존 방향을 유지하세요.
In
`@apps/market-owner/src/domains/leaflet/share/sections/LeafletConfirmSection.css.ts`:
- Around line 37-43: Update the stateClassName style’s minHeight from 36rem to
61rem so the loading state reserves the same height as the mobile preview’s
completed content and prevents layout shift.
In `@packages/shared/src/components/product-card/ProductItem.tsx`:
- Around line 83-85: Update the product card’s parent button accessible name to
include the discount text from badgeLabel by incorporating it into
productButtonLabel; alternatively, if the discount is not required in the button
name, remove the redundant aria-label from PointChip. Ensure the discount
information is exposed through the button’s accessible label rather than relying
on PointChip aria-label.
- Around line 83-85: Update the PointChip usage in ProductItem so its size
follows the ProductCard desktop/mobile variant instead of always using
size='desktop'. Use the mobile size for mobile cards while preserving the
desktop size for desktop cards, reusing the existing variant or size policy
rather than introducing unrelated changes.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: 66effb2e-0628-4328-b634-5a1c71ae1b3f
⛔ Files ignored due to path filters (1)
packages/shared/src/components/product-card/assets/img-chip-point.webpis excluded by!**/*.webpand included bypackages/**
📒 Files selected for processing (28)
apps/client/src/domains/market/market-products/MarketProductsPage.test.tsxapps/client/src/domains/market/market-products/fixtures/market-products.fixture.tsapps/client/src/domains/market/market-products/hooks/useEventDiscountCategoryLayout.tsapps/client/src/domains/market/market-products/sections/EventDiscountProductsSection.tsxapps/client/src/domains/market/market-products/sections/MarketOverviewSection.tsxapps/client/src/domains/market/market-products/utils/market-actions.tsapps/market-owner/src/domains/leaflet/share/LeafletSharePage.spec.mdapps/market-owner/src/domains/leaflet/share/LeafletSharePage.test.tsxapps/market-owner/src/domains/leaflet/share/LeafletSharePage.tsxapps/market-owner/src/domains/leaflet/share/api/get-periodic-preview.test.tsapps/market-owner/src/domains/leaflet/share/api/get-periodic-preview.tsapps/market-owner/src/domains/leaflet/share/api/index.tsapps/market-owner/src/domains/leaflet/share/components/PhonePreviewFrame.css.tsapps/market-owner/src/domains/leaflet/share/components/PhonePreviewFrame.tsxapps/market-owner/src/domains/leaflet/share/hooks/index.tsapps/market-owner/src/domains/leaflet/share/hooks/use-periodic-preview-query.tsapps/market-owner/src/domains/leaflet/share/model/leaflet-preview-view-model.tsapps/market-owner/src/domains/leaflet/share/query-keys.tsapps/market-owner/src/domains/leaflet/share/query-options.tsapps/market-owner/src/domains/leaflet/share/sections/LeafletConfirmSection.css.tsapps/market-owner/src/domains/leaflet/share/sections/LeafletConfirmSection.tsxpackages/shared/src/business-hours/business-hours.test.tspackages/shared/src/business-hours/business-hours.tspackages/shared/src/business-hours/index.tspackages/shared/src/components/product-card/ProductCard.css.tspackages/shared/src/components/product-card/ProductCard.spec.mdpackages/shared/src/components/product-card/ProductItem.tsxpackages/shared/src/index.ts
💤 Files with no reviewable changes (1)
- packages/shared/src/components/product-card/ProductCard.css.ts
…-CLIENT into feat/apps-market-owner/DCMSM-77-periodic-flyer-preview-api
Lighthouse Performance Report측정이 완료되어 Lighthouse 요약을 남깁니다.
|
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/market-owner/src/domains/leaflet/share/LeafletSharePage.spec.md`:
- Around line 10-13: Resolve the merge conflict in LeafletSharePage.spec.md by
removing the Git conflict markers and retaining the correct Jira entry,
including the intended issue keys from both conflicting versions where
applicable.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: 256d6387-d14e-4316-9779-504d3d733569
📒 Files selected for processing (9)
apps/client/src/domains/market/market-products/MarketProductsPage.test.tsxapps/client/src/domains/market/market-products/fixtures/market-products.fixture.tsapps/client/src/domains/market/market-products/sections/MarketOverviewSection.tsxapps/client/src/domains/market/market-products/utils/market-actions.tsapps/market-owner/src/domains/leaflet/share/LeafletSharePage.spec.mdapps/market-owner/src/domains/leaflet/share/LeafletSharePage.test.tsxapps/market-owner/src/domains/leaflet/share/LeafletSharePage.tsxpackages/shared/package.jsonpackages/shared/src/business-hours/business-hours.ts
…-CLIENT into feat/apps-market-owner/DCMSM-77-periodic-flyer-preview-api
Related Issues
Background
기간 할인 수정 후 발행 전 오늘의 전단을 최종 확인하는 화면이 정적 UI 중심이라 실제 API 데이터와 원본 전단 UI 로직을 반영하지 못하고 있었습니다.
이번 PR에서는
GET /v1/owners/markets/{marketId}/flyers/preview/periodicAPI를 연결해 로그인된 마트의 전단 미리보기 데이터를 표시하고, 원본 UI의 영업시간 표시/대표 이미지 fallback/헤더 스타일을 재사용 또는 반영했습니다.Tasks
@dongchimi/shared로 이동하고 client/market-owner에서 재사용PointChip사용Implementation Notes
marketId는 현재 로그인 세션의useAuthStore값에서 가져옵니다.marketId가 없을 때는 전단 미리보기 query가 실행되지 않도록 처리했습니다.createLeafletPreviewViewModel에서 가격 포맷, 요약 카운트, 영업시간 표시 값을 구성합니다.formatBusinessHour,getCurrentBusinessCloseTime을 shared utility로 승격해 원본 client UI와 market-owner preview가 같은 로직을 사용합니다.thumbnailUrl != null이면 image를 렌더링하고, 값이 없을 때 fallback을 보여줍니다.PhonePreviewFrame의 할인 칩은 임시 이미지 asset 대신 디자인 시스템PointChip을 사용합니다.Verification
pnpm.cmd --filter market-owner typecheckpnpm.cmd --filter market-owner exec vitest run src/domains/leaflet/share/LeafletSharePage.test.tsxgit diff --checkEvidence
GET /v1/owners/markets/{marketId}/flyers/preview/periodic['leaflet-share', 'periodic-preview', marketId]PointChip@dongchimi/shared/business-hoursPR Point
marketId가 없는 세션에서 별도 안내 UI가 필요한지 확인 부탁드립니다.Screenshot
Risk / Follow-up
thumbnailUrl이 더미데이터 URL이라 정상적으로 보이지 않을 수 있습니다.marketId가 없는 로그인 상태를 별도 예외 화면으로 분리할지는 후속으로 정리할 수 있습니다.