department-of-veterans-affairs / va-mobile-app

"If VA were a company, it would have a flagship mobile app."
https://department-of-veterans-affairs.github.io/va-mobile-app/
17 stars 2 forks source link

FE: Update demographic screen Contact Information #5819

Open MekoHong opened 1 year ago

MekoHong commented 1 year ago

Description

As a veteran, I want to view and confirm my contact information before checking in to my appointment

As part of this story we want to:

Future ticket 5922 will account for additional logic conditioning for showing/not showing demographic screens

Documentation

Get: v0/appointments/check-in/demographics

"mailingAddress": {
"street1": "string",
"street2": "string",
"street3": "string",
"city": "string",
"county": "string",
"state": "string",
"zip": "string",
"zip4": "string",
"country": "string"
},
"residentialAddress": {
"street1": "string",
"street2": "string",
"street3": "string",
"city": "string",
"county": "string",
"state": "string",
"zip": "string",
"zip4": "string",
"country": "string"
},
"homePhone": "string",
"officePhone": "string",
"cellPhone": "string",
"email": "string",

Acceptance Criteria

1. - [ ] Update Pre-registration screen [Contact Information](https://app.mural.co/t/adhoccorporateworkspace2583/m/adhoccorporateworkspace2583/1680618865216/19982c43fee09740dedbf4ebaf4e7f12f4787b84?wid=2-1684958921251) and ensure it displays the following information: - Display the VCL (veterans crisis line) banner on the top of the screen - Cancel displayed top left - Help icon and label is displayed on the top right 2. - [ ] Verify the following read only Contact info fields and details are displayed - Mailing address - Home address - Home phone - Mobile phone - Work phone - Email address 3. Integrate with Get: [/v0/appointments/check-in/demographics](https://department-of-veterans-affairs.github.io/va-mobile-app/api/#operation/appointmentCheckinDemographics) to populate data details 4. - [ ] Verify action buttons 'Yes' and 'No' are displayed at the bottom of the screen 5. - [ ] Create shell large panel Appointments Help screen with the following information - Screen Title: Appointments help - Heading: Need help with your appointment? - Close displayed on the top right 6. - [ ] Create shell screen Emergency Contact with the following information - Template: Full screen sub task - Screen Title: Is this your current emergency contact? - Cancel is displayed on the top left 7. - [ ] Create shell screen Check in with staff member with the following information - Template: Full screen sub task - Screen Title: Check in with a staff member - Close is displayed on the top left **Screen Logic and Transitions - Contact information screen** 8. - [ ] Verify when selecting 'Cancel' the user lands back on the Appt details page 9. - [ ] Verify when selecting the help icon the Appts Help large panel is displayed (shell screen) 10. - [ ] Verify when user selects 'Yes' button they are directed to the Emergency Contact screen (shell screen) 11. - [ ] Verify when user selects 'No' they are directed to the Check in with a staff member screen (shell screen) **Accessibility Requirements** Standard: 1. Everything on the page should be read by the screen reader. - If anything is being conveyed visually only (buttons, menu items, list, tables, images, headings, forms, etc) the component type needs to be announced by the screenreader. (Include name (title), role, value) Each page should support text resizing based on the OS font scaling settings without loss of content, content overlap, or horizontal scroll. 2. Each touch target must be at minimum 44px by 44px 3. All elements on a page should be able to be traversed by an auxiliary keyboard. As a user uses the keyboard to navigate a page, its focus element should be clear. 4. The app needs to support operability by tap (no gestures) or voice control only. In cases where gestures occur, e.g. scroll, ensure these simple gestures are operable through the OS’ built-in capabilities. 5. For all lists with more than 1 option/result, screen reader should specify count of each option as it reads the option ## Notes & Open Questions - Dependencies/Roadblocks: - Any internal/external dependencies? Yes, need endpoint service GET appointments/check-in/demographics - Test accounts needed? - Does this require QA? - Dev Notes: ## Ticket Checklist - [X] Acceptance criteria defined - [X] Labels added (front-end, back-end, feature) - [X] Linked to an Epic
dumathane commented 1 year ago

If Emergency Contact info needs to be reviewed display Emergency Contact screen If Emergency Contact info review is not required and Next of Kin does, display the Next of Kin info demographics screen If Neither Emergency Contact nor Next of Kin need to be reviewed display the You're checked in confirmation screen (see ticket)

This part is interesting. I think we'll need to query for whether we need each of these screens individually and know at the point of check-in button. Then unique 'onYes' code will have to supply the correct NavigateTo maybe in a switch case depending on the previously supplied/not supplied updates.

MekoHong commented 1 year ago

Hi @rbontrager can you add QA estimate for this ticket? Thanks!