Profile Selection Modal
Profile list response and selected-profile event.
What This Example Demonstrates
The profile selector lets a customer choose the traveler, recipient, or account profile used by the current journey. It separates the profile API response from modal state and the resulting selection event.
How to Use It
Fetch profiles only for the authenticated customer and return the minimum fields required by the journey. Prefer sending a stable profile reference to ACP Engine or downstream tools instead of copying identity and document data into conversation state. Mask or omit sensitive identifiers in the UI when they are not required.
{
"description": "Extended logical payloads for the reference commerce UI. These examples can be used as mock API responses, Storybook fixtures, or frontend integration test data.",
"profileSelection": {
"apiResponse": {
"profiles": [
{
"id": 7,
"title": "Example User",
"first_name": "Example",
"last_name": "User",
"birth_date": "1990-01-01",
"nationality": "US",
"tc_identity_number": null,
"passport_number": "P1234567",
"phone": "+15551112233",
"email": "user@example.com",
"gender": "female",
"is_default": true,
"address_title": "Home",
"city": "Example City",
"district": "Manhattan"
}
]
},
"ProfileSelectionModalProps": {
"isOpen": true,
"isLoading": false
},
"selectedProfileEvent": {
"type": "PROFILE_SELECTED",
"profile": {
"id": 7,
"title": "Example User",
"first_name": "Example",
"last_name": "User",
"birth_date": "1990-01-01",
"nationality": "US",
"passport_number": "P1234567",
"phone": "+15551112233",
"email": "user@example.com",
"gender": "female",
"is_default": true,
"address_title": "Home",
"city": "Example City",
"district": "Manhattan"
}
}
}
}