id: 'mypage-addresses' status: in-progress

My Page Addresses

Reference

URL: http://standard-commerce.makitt.localhost:3006/admin?uiKit=standard-commerce&component=mypage-addresses
위치: 마이페이지 > 주소록 관리
구조: 주소 목록 + 추가/수정 폼 + 주소 검색 모달
React 레퍼런스에서 직접 변환

React Component

Path: apps/makitt-standard-commerce/src/components/assets/mypage-addresses/
Status: implemented
반응형: 모바일/데스크톱 레이아웃 대응 (useIsMobile)
i18n: 아직 하드코딩 (ko)

Prerequisites

makitt-server (shop-api)

고객 대면 API. shop storefront에서 호출.

API	Method	Endpoint	Status
주소 목록	GET	`/shop/{shopId}/customers/me/addresses`	available
주소 생성	POST	`/shop/{shopId}/customers/me/addresses`	available
주소 수정	PUT	`/shop/{shopId}/customers/me/addresses/{addressId}`	available
주소 삭제	DELETE	`/shop/{shopId}/customers/me/addresses/{addressId}`	available
기본 주소 설정	PUT	`/shop/{shopId}/customers/me/addresses/{addressId}/default`	available
주소 검색	GET	`/shop/{shopId}/address/search`	available
체크아웃 정책	GET	`/shop/{shopId}/checkout-policy`	available
마켓 프로필	GET	`/shop/{shopId}/market-profiles`	available

makitt-server (admin-api)

셀러 어드민에서 이 기능의 데이터를 관리하기 위한 API.

API	Method	Endpoint	Status
체크아웃 정책 조회	GET	`/api/v1/shops/{shopId}/checkout-policy`	available
체크아웃 정책 수정	PUT	`/api/v1/shops/{shopId}/checkout-policy`	available

makitt-server (도메인/모델링)

항목	내용	Status
DynamoDB Entity	CustomerAddress (PK: `CUSTOMER#{customerId}`, SK: `ADDRESS#{addressId}`)	available
Domain Service	`CustomerAddressService`	available
Application	`CustomerAddressApplication`	available
ShippingFieldConfig	`entranceMethodOptions` 필드 추가됨	available

makitt-web (셀러 어드민 UI)

기능	설명	Status
배송 필드 설정	배송메모/출입방법 옵션 관리	available
출입방법 옵션 관리	entranceMethodOptions CRUD	available (방금 추가)

makitt-shop (HCS 렌더링)

항목	설명	Status
form renderer	폼 + input + select + checkbox	available
modal renderer	주소 검색 모달	available
repeat binding	주소 목록 반복 렌더링	available
`customer.addresses` resource	주소 목록 조회 리소스	available
`customer.fieldConfig` resource	주소 필드 설정 리소스	available
`address.save` action	주소 생성/수정 액션	available
`address.delete` action	주소 삭제 액션	available
`address.setDefault` action	기본 주소 설정 액션	available
`address.search` action	주소 검색 액션	available

HCS Conversion Notes

구조 매핑

section (root) — state, resource
├── breadcrumb (container)
├── hero row (container + heading + button)
├── auth gate (visible: !authenticated → login prompt)
├── address list section (visible: authenticated)
│   └── address card (repeat: addresses.items)
│       ├── label + default badge + actions
│       ├── meta (name, email, phone)
│       └── address text + delivery memo
├── address form section (visible: showForm)
│   └── form (submit: address.save)
│       ├── label input
│       ├── country select
│       ├── name inputs (2-col)
│       ├── email input
│       ├── phone input (code select + number)
│       ├── address search button + address fields
│       ├── billing same checkbox + billing fields
│       ├── delivery memo select + custom input
│       ├── entrance method select + custom input
│       ├── default checkbox
│       └── action buttons (cancel + submit)
└── globals.modals: address search modal

바인딩 전략

주소 목록: resource: customer.addresses → repeat: addresses.items as addr
배송메모 옵션: checkout.policy 리소스에서 shippingFieldConfigs 참조
출입방법 옵션: 동일하게 shippingFieldConfigs.entranceMethodOptions
인증 상태: state.isLoggedIn 글로벌 상태 참조
폼 제출: address.save 액션 (addressId 유무로 create/update 분기)

제한 사항

폼 동적 전환: create/update 분기를 단일 address.save 액션으로 처리 필요
주소 검색: 모달 내 검색 API 호출을 address.search 액션으로 구현 필요
동적 옵션: 마켓별 배송메모/출입방법 옵션은 checkout.policy 리소스 바인딩 필요
국가별 전화번호 코드: market.profiles 리소스에서 동적 빌드 필요

다음 단계

@makitt/api에 customer resource domain 등록 (addresses, address)
@makitt/api에 address.* action domain 등록
@makitt/api에 checkout.policy resource 등록
HCS JSON 에셋을 실제 리소스/액션과 연동 테스트