diff --git a/src/App.tsx b/src/App.tsx index 49676ec..7bb237e 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -383,7 +383,7 @@ const routes: RouteObject[] = [ element: , }, { - path: 'address-complete/:productId', + path: 'address-complete', element: , }, { diff --git a/src/constants/home.ts b/src/constants/home.ts new file mode 100644 index 0000000..1d5f05b --- /dev/null +++ b/src/constants/home.ts @@ -0,0 +1,29 @@ +import type { HomeServiceMenuItem } from '../types/home'; + +// 홈 화면의 고정 서비스 메뉴입니다. +export const HOME_SERVICE_MENU_ITEMS: HomeServiceMenuItem[] = [ + { + id: 'disposal-info', + title: '배출 정보', + path: '/disposal-info', + icon: 'trash', + }, + { + id: 'disposal-auth', + title: '배출 인증', + path: '/certification', + icon: 'camera', + }, + { + id: 'reward-save', + title: '리워드 적립', + path: '/reward', + icon: 'reward', + }, + { + id: 'contribution', + title: '실시간 기여도', + path: '/my-contribution', + icon: 'chart', + }, +]; diff --git a/src/layouts/Layout.tsx b/src/layouts/Layout.tsx index b4a8899..625cafd 100644 --- a/src/layouts/Layout.tsx +++ b/src/layouts/Layout.tsx @@ -32,7 +32,7 @@ const Layout = () => { const isCamera = !!matchPath('/camera', location.pathname); const isReward = !!matchPath({ path: '/reward/*', end: false }, location.pathname); - const isRewardAddressComplete = !!matchPath('/reward/address-complete/:productId', location.pathname); + const isRewardAddressComplete = !!matchPath('/reward/address-complete', location.pathname); const isRewardUseComplete = !!matchPath('/reward/use-complete/:productId', location.pathname); const isRewardHistory = !!matchPath('/reward/history', location.pathname); const isRewardStore = !!matchPath('/reward/store', location.pathname); diff --git a/src/mocks/home.ts b/src/mocks/home.ts deleted file mode 100644 index 826dc04..0000000 --- a/src/mocks/home.ts +++ /dev/null @@ -1,77 +0,0 @@ -import type { - HomeCommunityPreview, - HomePointSummary, - HomeRewardPreview, - HomeServiceMenuItem, - HomeUser, -} from '../types/home'; - -// 홈 상단 인사말 영역에서 사용할 임시 사용자 정보입니다. -// 나중에 로그인 사용자 API가 연결되면 이 객체 대신 API 응답 데이터를 사용하면 됩니다. -export const HOME_USER: HomeUser = { - nickname: '지구', -}; - -// 사용자 누적 포인트 카드에 표시할 더미 데이터입니다. -// 실제 포인트 조회 API가 생기면 HomePage에서 이 값을 API 데이터로 교체할 예정입니다. -export const HOME_POINT_SUMMARY: HomePointSummary = { - totalPoint: 5000, -}; - -// 홈 화면의 고정 서비스 메뉴입니다. -export const HOME_SERVICE_MENU_ITEMS: HomeServiceMenuItem[] = [ - { - id: 'disposal-info', - title: '배출 정보', - path: '/disposal-info', - icon: 'trash', - }, - { - id: 'disposal-auth', - title: '배출 인증', - path: '/certification', - icon: 'camera', - }, - { id: 'reward-save', title: '리워드 적립', path: '/reward', icon: 'reward' }, - { - id: 'contribution', - title: '실시간 기여도', - path: '/my-contribution', - icon: 'chart', - }, -]; - -// 오늘의 커뮤니티 미리보기 카드에 사용할 더미 게시글입니다. -// 커뮤니티 목록 API가 준비되면 이 배열을 서버 데이터로 바꾸면 됩니다. -export const HOME_COMMUNITY_PREVIEWS: HomeCommunityPreview[] = [ - { - id: 2, - category: '환경실천', - title: '오늘 한강에서 플로깅 했어요!', - content: '산책하면서 작은 쓰레기부터 주웠더니 뿌듯했어요.', - author: '리도07', - createdAtText: '1시간 전', - commentCount: 5, - }, -]; - -// 리워드 상점 미리보기 리스트에 사용할 더미 상품입니다. -// 리워드 상품 API 연동 전까지 홈 화면 구조 확인용으로 사용합니다. -export const HOME_REWARD_PREVIEWS: HomeRewardPreview[] = [ - { - id: 1, - name: '친환경 수세미 1개입', - requiredPoint: 1000, - category: '친환경 제품', - imageAlt: '친환경 수세미 상품 이미지', - imageVariant: 'plant', - }, - { - id: 2, - name: '기프티콘 5,000원권', - requiredPoint: 5000, - category: '기프티콘', - imageAlt: '기프티콘 상품 이미지', - imageVariant: 'gift-card', - }, -]; diff --git a/src/mocks/reward.ts b/src/mocks/reward.ts deleted file mode 100644 index 7b21409..0000000 --- a/src/mocks/reward.ts +++ /dev/null @@ -1,155 +0,0 @@ -import type { - AddressSearchResult, - ApiResponse, - RewardProduct, - RewardShippingAddress, - RewardSummary, - ShippingAddressListResponse, -} from '../types/reward'; - -export const mockRewardSummary: RewardSummary = { - nickname: '지구', - currentPoint: 5000, - monthlyPoint: 1200, -}; - -export const mockRecentShippingAddress: RewardShippingAddress | null = null; - -export const mockRewardProducts: RewardProduct[] = [ - { - id: 1, - name: '친환경 수세미 1개입', - type: 'PARTNER', - point: 1000, - description: '자연 소재로 만든 다회용 친환경 수세미입니다.', - }, - { - id: 2, - name: '기프티콘 5,000원권', - type: 'GIFTICON', - point: 5000, - usageGuide: '결제 시 모바일 쿠폰의 바코드를 제시해 사용해 주세요.', - validityPeriod: '발급일로부터 90일', - }, - { - id: 3, - name: '친환경 대나무 칫솔', - type: 'PARTNER', - point: 1500, - description: '플라스틱 사용을 줄인 대나무 손잡이 칫솔입니다.', - }, - { - id: 4, - name: '카페 음료 기프티콘', - type: 'GIFTICON', - point: 4500, - usageGuide: '매장 주문 시 모바일 쿠폰을 제시해 주세요.', - validityPeriod: '발급일로부터 60일', - }, - { - id: 5, - name: '재생 플라스틱 화분', - type: 'PARTNER', - point: 2000, - description: '재생 플라스틱 소재를 활용한 소형 화분입니다.', - }, - { - id: 6, - name: '편의점 모바일 상품권 3,000원권', - type: 'GIFTICON', - point: 3000, - usageGuide: '편의점 결제 시 모바일 상품권 바코드를 제시해 주세요.', - validityPeriod: '발급일로부터 90일', - }, - { - id: 7, - name: '천연 설거지 비누', - type: 'PARTNER', - point: 1200, - description: '플라스틱 용기 없이 사용할 수 있는 고체형 설거지 비누입니다.', - }, - { - id: 8, - name: '영화 관람 기프티콘', - type: 'GIFTICON', - point: 6000, - usageGuide: '영화관 예매 시 쿠폰 번호를 등록해 사용해 주세요.', - validityPeriod: '발급일로부터 120일', - }, -]; - - -export const MOCK_EMPTY_SHIPPING_ADDRESS_RESPONSE: ShippingAddressListResponse = - { - isSuccess: true, - code: 'SHIPPING_ADDRESS_200_002', - message: '배송지 목록 조회에 성공했습니다.', - result: { - shippingAddresses: [], - }, - }; - -export const MOCK_SHIPPING_ADDRESS_RESPONSE: ShippingAddressListResponse = { - isSuccess: true, - code: 'SHIPPING_ADDRESS_200_002', - message: '배송지 목록 조회에 성공했습니다.', - result: { - shippingAddresses: [ - { - shippingAddressId: 3, - addressType: 'HOME', - receiverName: '허건우', - phone: '010-5685-9058', - postalCode: '14662', - address1: '경기도 부천시 원미구 지봉로 43', - address2: '가톨릭대학교 성심교정', - isDefault: false, - }, - ], - }, -}; - -export const MOCK_ADDRESS_SEARCH_RESPONSE: ApiResponse = { - isSuccess: true, - code: 'ADDRESS_SEARCH_200_001', - message: '주소 검색에 성공했습니다.', - result: { - addressCandidates: [ - { - roadAddress: '경기도 부천시 원미구 지봉로 43', - jibunAddress: - '경기도 부천시 원미구 역곡동 산43-1 가톨릭대학교 성심교정', - postalCode: '14662', - buildingName: '가톨릭대학교 성심교정', - }, - { - roadAddress: '서울특별시 종로구 지봉로 43', - jibunAddress: '서울특별시 종로구 창신동 243', - postalCode: '03104', - buildingName: null, - }, - { - roadAddress: '경기도 부천시 원미구 지봉로 43-3', - jibunAddress: '경기도 부천시 원미구 역곡동 28-3', - postalCode: '14662', - buildingName: null, - }, - { - roadAddress: '경기도 부천시 원미구 지봉로 43-7', - jibunAddress: '경기도 부천시 원미구 역곡동 28-10 우석 미소지움', - postalCode: '14662', - buildingName: '우석 미소지움', - }, - { - roadAddress: '경기도 부천시 원미구 지봉로 43-11', - jibunAddress: '경기도 부천시 원미구 역곡동 28-11', - postalCode: '14662', - buildingName: null, - }, - ], - page: 1, - size: 10, - totalCount: 5, - hasNext: false, - }, -}; diff --git a/src/pages/home-page.tsx b/src/pages/home-page.tsx index a2a5084..e16fddf 100644 --- a/src/pages/home-page.tsx +++ b/src/pages/home-page.tsx @@ -5,7 +5,7 @@ import LogoutIcon from '../assets/icons/logout.svg'; import BigLogo from '../assets/icons/Big-logo.svg?react'; import RewardIcon from '../assets/icons/reward.svg'; import TrashIcon from '../assets/icons/trash.svg'; -import { HOME_SERVICE_MENU_ITEMS } from '../mocks/home'; +import { HOME_SERVICE_MENU_ITEMS } from '../constants/home'; import type { HomeServiceMenuItem } from '../types/home'; import { useNavigate } from 'react-router-dom'; import { getMyInfo } from '../apis/user'; @@ -133,7 +133,7 @@ export default function HomePage() { - {/* 홈 서비스 메뉴입니다. 아이콘은 mock 데이터의 icon 값으로 매칭합니다. */} + {/* 홈 서비스 메뉴입니다. 아이콘은 메뉴 설정의 icon 값으로 매칭합니다. */}

어떤 서비스를 찾으시나요?

diff --git a/src/pages/reward-page/reward-address-complete-page.tsx b/src/pages/reward-page/reward-address-complete-page.tsx index 6b0bb5b..dde933d 100644 --- a/src/pages/reward-page/reward-address-complete-page.tsx +++ b/src/pages/reward-page/reward-address-complete-page.tsx @@ -1,17 +1,18 @@ -import { Navigate, useNavigate, useParams } from 'react-router-dom'; +import { Navigate, useLocation, useNavigate } from 'react-router-dom'; import FullCheck from '../../assets/icons/full-check.svg'; -import { mockRewardProducts } from '../../mocks/reward'; + +interface RewardAddressCompleteLocationState { + addressCreated?: boolean; +} export default function RewardAddressCompletePage() { const navigate = useNavigate(); - const { productId } = useParams<{ productId: string }>(); - const numericProductId = Number(productId); - const product = Number.isSafeInteger(numericProductId) - ? mockRewardProducts.find(({ id }) => id === numericProductId) - : undefined; + const { state } = useLocation(); + const addressCreated = (state as RewardAddressCompleteLocationState | null) + ?.addressCreated; - if (!product || product.type !== 'PARTNER') { - return ; + if (!addressCreated) { + return ; } return ( @@ -35,7 +36,7 @@ export default function RewardAddressCompletePage() {