Appointments- Create UI screen Type of Care (FE only)

[b-rocha]

Description

We're working to get ahead of the Appointments by building out the front-end (only) for screens that are unlikely to change.

This is the first screen users will go to in the Appointments flow, to select the type of care they're booking an appointment for.

The values for these radio buttons will be hardcoded on the front end and should look like this to match the data on VA.gov:

export const TYPES_OF_CARE = [
  {
    id: '323',
    idV2: 'primaryCare',
    name: 'Primary care',
    group: 'primary',
    ccId: 'CCPRMYRTNE',
    cceType: 'PrimaryCare',
    specialties: ['207QA0505X', '363LP2300X', '363LA2200X', '261QP2300X'],
  },
  {
    id: '160',
    idV2: 'clinicalPharmacyPrimaryCare',
    name: 'Pharmacy',
    group: 'primary',
  },
  {
    id: '502',
    idV2: 'outpatientMentalHealth',
    name: 'Mental health',
    group: 'mentalHealth',
  },
  {
    id: '125',
    idV2: 'socialWork',
    name: 'Social work',
    group: 'mentalHealth',
  },
  {
    id: '211',
    idV2: 'amputation',
    name: 'Amputation care',
    group: 'specialty',
  },
  {
    id: '203',
    idV2: 'audiology',
    name: 'Audiology and speech',
    label: 'Audiology and speech (including hearing aid support)',
    group: 'specialty',
    ccId: ['CCAUDHEAR', 'CCAUDRTNE'],
    cceType: 'Audiology',
  },
  {
    id: '372',
    idV2: 'moveProgram',
    name: 'MOVE! weight management program',
    group: 'specialty',
  },
  {
    id: '123',
    idV2: 'foodAndNutrition',
    name: 'Nutrition and food',
    group: 'specialty',
    ccId: 'CCNUTRN',
    cceType: 'Nutrition',
    specialties: ['133V00000X', '133VN1201X', '133N00000X', '133NN1002X'],
  },
  {
    id: 'tbd-podiatry',
    idV2: 'podiatry',
    name: 'Podiatry',
    label: 'Podiatry (only available online for Community Care appointments)',
    ccId: 'CCPOD',
    group: 'specialty',
    cceType: 'Podiatry',
    specialties: [
      '213E00000X',
      '213EG0000X',
      '213EP1101X',
      '213ES0131X',
      '213ES0103X',
    ],
  },
  {
    id: 'SLEEP',
    name: 'Sleep medicine',
    group: 'specialty',
  },
  {
    id: 'EYE',
    name: 'Eye care',
    group: 'specialty',
  },
  {
    id: 'covid',
    idV2: 'covid',
    name: 'COVID-19 vaccine',
  },
];

export const TYPES_OF_SLEEP_CARE = [
  {
    id: '349',
    idV2: 'cpap',
    name: 'Continuous Positive Airway Pressure (CPAP)',
  },
  {
    id: '143',
    idV2: 'homeSleepTesting',
    name: 'Sleep medicine and home sleep testing',
  },
];

export const TYPES_OF_EYE_CARE = [
  {
    id: '408',
    idV2: 'optometry',
    name: 'Optometry',
    ccId: 'CCOPT',
    cceType: 'Optometry',
    specialties: ['152W00000X', '152WC0802X'],
  },
  {
    id: '407',
    idV2: 'ophthalmology',
    name: 'Ophthalmology',
  },
];

export const AUDIOLOGY_TYPES_OF_CARE = [
  {
    ccId: 'CCAUDRTNE',
    idV2: 'audiology-routine exam',
    name: 'Routine hearing exam',
    specialties: ['231H00000X', '237600000X', '261QH0700X'],
  },
  {
    ccId: 'CCAUDHEAR',
    idV2: 'audiology-hearing aid support',
    name: 'Hearing aid support',
    specialties: ['231H00000X', '237600000X'],
  },
];

Acceptance Criteria

• [ ] Create UI screen Type of Care
• [ ] Title text says "What type of care do you need?"
• [ ] List component with radio buttons on the right is used to list types of care
• [ ] Options for types of care are as follows:
  • Amputation care
  • Audiology and speech (including hearing aid support)
  • Covid-19 vaccine
  • Eye care
  • Mental health
  • MOVE! weight management program
  • Nutrition and food
  • Pharmacy
  • Podiatry (only available for Community Care appointments)
  • Primary care
  • Sleep medicine
  • Social work
• [ ] Cancel is displayed at the top left of the screen
• [ ] ? icon is displayed at the top right of the screen
• [ ] "Back" button (half-width button) and "Continue" button (Half-width button) are listed at the bottom

Specs

Sketch-Type of Care

[MekoHong]

Updated AC to remove - [ ] "Why am I seeing this?" expandable/collapse link displayed above Back & Continue buttons along with updated image. @rarroyo23

[DJUltraTom]

tested by: https://dsvavsp.testrail.io/index.php?/cases/view/19410

[DJUltraTom]

Verified this is showing in the most recent RC though hidden behind feature flag. Moving to closed