Vacms 16144 VAMC service location paragraphs - and merge VBA

src/site/components/phone-number.drupal.liquid

@@ -1,7 +1,11 @@
 <h{{ phoneHeaderLevel }}>{{ phoneLabel | default: 'Phone' }}</h{{ phoneHeaderLevel }}>
 <div>
   <va-telephone
+    {% if phoneNumberType %}
+    {{ phoneNumberType }}
+    {% endif %}
     contact="{{ phoneNumber | removeDashes }}"
     extension="{{ phoneExtension | default: '' }}"
+    message-aria-describedby="{{ phoneLabel }}" />
   />
 </div>

src/site/components/phone.drupal.liquid

@@ -8,6 +8,7 @@
           phoneExtension = number.fieldPhoneExtension
           phoneLabel = number.fieldPhoneLabel | default: 'Phone'
           phoneHeaderLevel = phoneHeaderLevel
+          phoneNumberType = false
         %}
       {% endfor %}
     {% endif %}
@@ -19,6 +20,7 @@
           phoneExtension = number.fieldPhoneExtension
           phoneLabel = number.fieldPhoneLabel | default: 'Fax'
           phoneHeaderLevel = phoneHeaderLevel
+          phoneNumberType = false
         %}
       {% endfor %}
     {% endif %}
@@ -30,6 +32,7 @@
           phoneExtension = number.fieldPhoneExtension
           phoneLabel = number.fieldPhoneLabel | default: 'SMS'
           phoneHeaderLevel = phoneHeaderLevel
+          phoneNumberType = 'sms'
         %}
       {% endfor %}
     {% endif %}
@@ -41,6 +44,7 @@
           phoneExtension = number.fieldPhoneExtension
           phoneLabel = number.fieldPhoneLabel | default: 'TTY'
           phoneHeaderLevel = phoneHeaderLevel
+          phoneNumberType = 'tty'
         %}
       {% endfor %}
     {% endif %}

src/site/facilities/health_care_local_health_service.drupal.liquid

@@ -1,89 +1,4 @@
-<h4 data-template="facilities/health_care_local_health_service">Contact information</h4>
-
 {% for location in locations %}
-  {% include "src/site/paragraphs/service_location.drupal.liquid" with
-    single = location.entity
-    serviceLocationSubHeaderLevel = 5
+  {% include "src/site/paragraphs/service_location.drupal.liquid" with single = location.entity serviceLocationSubHeaderLevel = 5
   %}
-{% endfor %}
-
-{% if locationEntity.fieldReferralRequired or locationEntity.fieldWalkInsAccepted or locationEntity.fieldOnlineSchedulingAvailabl %}
-  <h5 data-template="facilities/health_care_local_health_service">Appointments</h5>
-
-  {% assign introText = 'Contact us to schedule, reschedule, or
-    cancel your appointment. If a referral is required, you’ll need to contact your
-    primary care provider first.'
-  %}
-
-  {% case locationEntity.fieldHserviceApptIntroSelect %}
-    {% when 'custom_intro_text' %}
-      {% if locationEntity.fieldHserviceApptLeadin != empty %}
-        {% assign introText = locationEntity.fieldHserviceApptLeadin %}
-      {% endif %}
-    {% when 'no_intro_text' %}
-      {% assign introText = '' %}
-  {% endcase %}
-
-  {% if introText != empty %}
-    <p class="vads-u-margin--0" data-template="facilities/health_care_local_health_service">
-      {{  introText }}
-    </p>
-  {% endif %}
-
-
-  {% comment %}
-    if fieldPhoneNumbersParagraph has values
-    use phone numbers from entities
-  {% endcomment %}
-  {% if locationEntity.fieldPhoneNumbersParagraph.length > 0 %}
-    <div class="vads-u-display--flex vads-u-flex-direction--column vads-u-margin-bottom--1" data-template="facilities/health_care_local_health_service">
-      {% for number in locationEntity.fieldPhoneNumbersParagraph %}
-        {% include "src/site/components/phone-number.drupal.liquid" with
-          phoneNumber = number.entity.fieldPhoneNumber
-          phoneExtension = number.entity.fieldPhoneExtension
-          phoneLabel = number.entity.fieldPhoneLabel
-          phoneHeaderLevel = 5
-        %}
-      {% endfor %}
-    </div>
-  {% else %}
-    <div class="vads-u-display--flex vads-u-flex-direction--column vads-u-margin-bottom--1" data-template="facilities/health_care_local_health_service">
-      {% include "src/site/components/phone-number.drupal.liquid" with
-        phoneNumber = fieldPhoneNumber
-        phoneLabel = 'Main Phone'
-        phoneHeaderLevel = 5
-      %}
-    </div>
-  {% endif %}
-
-  {% assign OMIT_REFERRAL_OR_WALKIN = "not_applicable, unknown" %}
-
-  {% if locationEntity.fieldReferralRequired %}
-    {% unless OMIT_REFERRAL_OR_WALKIN contains locationEntity.fieldReferralRequired %}
-      <p class="vads-u-margin-bottom--1" data-template="facilities/health_care_local_health_service">
-        <strong>Referral required?</strong>
-        {% if locationEntity.fieldReferralRequired == '1' %}Yes{% else %}No{% endif %}
-      </p>
-    {% endunless %}
-  {% endif %}
-
-  {% if locationEntity.fieldWalkInsAccepted %}
-    {% unless OMIT_REFERRAL_OR_WALKIN contains locationEntity.fieldWalkInsAccepted %}
-      <p class="vads-u-margin-bottom--1" data-template="facilities/health_care_local_health_service">
-        <strong>Walk-ins accepted?</strong>
-        {% if locationEntity.fieldWalkInsAccepted == '1' %}Yes{% else %}No{% endif %}
-      </p>
-    {% endunless %}
-  {% endif %}
-
-  {% if locationEntity.fieldOnlineSchedulingAvailabl == '1' %}
-    <a class="usa-button vads-u-margin-bottom--0"
-       data-entity-substitution="canonical"
-       data-entity-type="node"
-       data-template="facilities/health_care_local_health_service"
-       href="/health-care/schedule-view-va-appointments"
-       title="Schedule and manage health appointments">
-      Schedule an appointment online
-    </a>
-  {% endif %}
-{% endif %}
+{% endfor %}

src/site/facilities/service_address.drupal.liquid

@@ -5,29 +5,34 @@
     </h{{ serviceLocationAddressHeaderLevel }}>
   {% endif %}
 
-  {% comment %}
-    Include street address only if fieldUseFacilityAddress is false
-  {% endcomment %}
-  {% if serviceLocationAddress.fieldUseFacilityAddress == false %}
-    {% if serviceLocationAddress.fieldAddress.addressLine1 %}
+  {% if serviceLocationAddress.fieldUseFacilityAddress and facilityAddress %}
+    {% assign hasAddress = true %}
+    {% assign addressData = facilityAddress %}
+  {% elsif location.entity.fieldServiceLocationAddress %}
+    {% assign hasAddress = true %}
+    {% assign addressData = location.entity.fieldServiceLocationAddress.entity.fieldAddress %}
+  {% endif %}
+
+  {% if hasAddress %}
+    {% if addressData.addressLine1 %}
       <span class="vads-u-margin-bottom--0">
-        {{ serviceLocationAddress.fieldAddress.addressLine1 }}
+        {{ addressData.addressLine1 }}
       </span>
     {% endif %}
 
-    {% if serviceLocationAddress.fieldAddress.addressLine2 %}
+    {% if addressData.addressLine2 %}
       <span class="vads-u-margin-bottom--0">
-        {{ serviceLocationAddress.fieldAddress.addressLine2 }}
+        {{ addressData.addressLine2 }}
       </span>
     {% endif %}
 
-    {% if serviceLocationAddress.fieldAddress.locality %}
-      {% if serviceLocationAddress.fieldAddress.administrativeArea%}
-        {% if serviceLocationAddress.fieldAddress.postalCode %}
+    {% if addressData.locality %}
+      {% if addressData.administrativeArea%}
+        {% if addressData.postalCode %}
           <span class="vads-u-margin-bottom--0">
-            {{ serviceLocationAddress.fieldAddress.locality }},
-            {{ serviceLocationAddress.fieldAddress.administrativeArea }}
-            {{ serviceLocationAddress.fieldAddress.postalCode }}
+            {{ addressData.locality }},
+            {{ addressData.administrativeArea }}
+            {{ addressData.postalCode }}
           </span>
         {% endif %}
       {% endif %}

src/site/filters/liquid.js

@@ -823,6 +823,7 @@ module.exports = function registerFilters() {
   };
 
   liquid.filters.replace = (string, oldVal, newVal) => {
+    if (!string) return null;
     const regex = new RegExp(oldVal, 'g');
     return string.replace(regex, newVal);
   };

src/site/includes/vba_facilities/services.liquid

@@ -79,11 +79,11 @@
           {% endif %}
 
           {% for fServiceLocation in entity.facilityService.fieldServiceLocation %}
-            {% include "src/site/includes/vba_facilities/service_location.liquid" with location = fServiceLocation entityLabel = facilityLabel serviceHeader = facilityServiceHeader serviceDescription = facilityServiceDescription
+            {% include "src/site/paragraphs/service_location.drupal.liquid" with single = fServiceLocation.entity serviceLocationSubHeaderLevel = 5 serviceLocationType="VBA" serviceHeader = facilityServiceHeader serviceDescription = facilityServiceDescription
             %}
           {% endfor %}
           {% for rServiceLocation in entity.regionalService.fieldServiceLocation %}
-            {% include "src/site/includes/vba_facilities/service_location.liquid" with location = rServiceLocation entityLabel = regionalLabel serviceHeader = regionalServiceHeader serviceDescription = regionalServiceDescription
+            {% include "src/site/paragraphs/service_location.drupal.liquid" with single = rServiceLocation.entity serviceLocationSubHeaderLevel = 5 serviceLocationType="VBA" serviceHeader = regionalServiceHeader serviceDescription = regionalServiceDescription
             %}
           {% endfor %}
 

src/site/paragraphs/service_location.drupal.liquid

@@ -1,62 +1,174 @@
-{% include "src/site/facilities/service_address.drupal.liquid" with
-  serviceLocationAddress = single.fieldServiceLocationAddress.entity
-  serviceLocationAddressHeaderLevel = serviceLocationSubHeaderLevel
-%}
-
-{% comment %}
-  single.fieldHours values:
-  - 0 = Use facility hours
-  - 1 = Do not specify hours
-  - 2 = Display specific hours
-{% endcomment %}
-
-{% if single.fieldHours != "1" %}
-  <h{{ serviceLocationSubHeaderLevel }} data-template="paragraphs/service_location">Hours</h{{ serviceLocationSubHeaderLevel }}>
-{% endif %}
-
-{% case single.fieldHours %}
-  {% when '2' %}
-    {% if single.fieldOfficeHours %}
-      {% include "src/site/includes/hours.liquid" with allHours = single.fieldOfficeHours headerType = 'included' %}
-    {% endif %}
-  {% when '0' %}
-    {% if fieldOfficeHours %}
-      {% include "src/site/includes/hours.liquid" with allHours = fieldOfficeHours headerType = 'included' %}
+<div class="vads-u-padding-x--2 vads-u-margin-top--2 vads-u-margin-bottom--2 vads-u-border--1px">
+  {% if serviceHeader %}
+    <h4 class="vads-u-margin-top--2">
+    {{ serviceHeader }}
+  </h4>
+  {% endif %}
+
+  {% if serviceDescription %}
+  <p id="vba-service-body-{{ entityId }}">
+    {{ serviceDescription | drupalToVaPath | phoneLinks }}
+  </p>
+  {% endif %}
+
+
+  {% comment %} 
+    possibly values for fieldOfficeVists
+      no
+      yes_appointment_only
+      yes_first_come_first_served_basis
+      yes_with_or_without_appointment
+  {% endcomment %}
+  {% if single.fieldOfficeVisits and single.fieldOfficeVisits != "no" %}
+    <div class="vads-u-margin-top--0p5" data-testid="service-location-field-office-visits">
+      <p>
+        <i class="fas fa-building vads-u-margin-right--0p5"></i>
+        {% case single.fieldOfficeVisits %}
+          {% when "yes_appointment_only" %}
+            Visit our office, with an appointment only
+          {% when "yes_with_or_without_appointment" %}
+            Visit our office, with or without an appointment
+          {% when "yes_first_come_first_served_basis" %}
+            Visit our office, first come, first served
+        {% endcase %}
+      </p>
+    </div>
+  {% endif %}
+
+  {% comment %} 
+    possibly values for fieldVirtualSupport
+      value: 'no'
+      value: yes_appointment_only
+      value: yes_first_come_first_served_basis
+      value: yes_with_or_without_appointment
+  {% endcomment %}
+  {% if single.fieldVirtualSupport and single.fieldVirtualSupport != "no" %}
+    <div data-testid="service-location-virtual-support">
+      <p>
+        <i class="fas fa-calendar vads-u-margin-right--0p5"></i> Schedule a virtual appointment
+      </p>
+    </div>
+  {% endif %}
+
+
+  {% if fieldReferralRequired %}
+    <div>
+      <p>
+        {% case fieldReferralRequired %}
+          {% when "1","2" %}
+            <i class="fas fa-check-circle vads-u-margin-right--0p5"></i> A referral is required
+          {% when "not_applicable","0" %}
+            <i class="fas fa-times-circle vads-u-margin-right--0p5"></i> A referral is not required
+        {% endcase %}
+      </p>
+    </div>
+  {% endif %}
+
+  {% if single.fieldVirtualSupport == "yes_appointment_only" or single.fieldVirtualSupport == 'yes_with_or_without_appointment' or single.fieldOfficeVisits == 'yes_appointment_only' or single.fieldOfficeVisits == 'yes_with_or_without_appointment' %}
+    <div>
+      <h{{serviceLocationSubHeaderLevel}} class="vads-u-margin-top--0 vads-u-line-height--1 vads-u-margin-bottom--1" data-testid="service-location-appoinments-header">Appointments</h{{serviceLocationSubHeaderLevel}} >
+    </div>
+    {% if single.fieldApptIntroTextType != 'remove_text' %}
+      {% if single.fieldApptIntroTextType == 'customize_text' and single.fieldApptIntroTextCustom != empty  %}
+        <p data-testid="service-location-custom-text">{{ single.fieldApptIntroTextCustom | drupalToVaPath | phoneLinks }}</p>
+      {% elsif single.fieldApptIntroTextType == 'use_default_text' %}
+        <p data-testid="service-location-default-text">
+          Contact us to schedule, reschedule, or cancel your appointment. If a referral is required, 
+          you’ll need to contact your primary care provider first.
+        </p>
+      {% endif %}
     {% endif %}
-{% endcase %}
-
-{% if single.fieldAdditionalHoursInfo %}
-  <span data-template="paragraphs/service_location"><i>{{ single.fieldAdditionalHoursInfo }}</i></span>
-{% endif %}
-
-{% comment %}
-  Conditionally display facility phone number
-{% endcomment %}
-{% if fieldPhoneNumber and single.fieldUseMainFacilityPhone %}
-  {% include "src/site/components/phone-number.drupal.liquid" with
-    phoneNumber = fieldPhoneNumber
-    phoneLabel = 'Main Phone'
+  {% endif %}
+
+  {% comment %}
+    Conditionally display facility phone number
+  {% endcomment %}
+  {% if fieldPhoneNumber and single.fieldUseMainFacilityPhone %}
+    <div class="vads-u-margin-bottom--2" data-testid="service-location-main-facility-phone">
+      {% include "src/site/components/phone-number.drupal.liquid" with
+        phoneNumber = fieldPhoneNumber
+        phoneLabel = 'Main Phone'
+        phoneHeaderLevel = serviceLocationSubHeaderLevel
+      %}
+    </div>
+  {% endif %}
+
+  {% if single.fieldOnlineSchedulingAvail == "yes" %}
+    <div class="vads-u-margin-bottom--2" data-testid="service-location-action-link-online">
+      <a class="vads-c-action-link--blue" href="/health-care/schedule-view-va-appointments">
+        Schedule an appointment online
+      </a>
+    </div>
+  {% endif %}
+
+
+  {% comment %} Includes header for clinic name {% endcomment %}
+  {% include "src/site/facilities/service_address.drupal.liquid" with
+    serviceLocationAddress = single.fieldServiceLocationAddress.entity
+    serviceLocationAddressHeaderLevel = serviceLocationSubHeaderLevel
+  %}
+
+  {% comment %}
+    Display each additional phone number provided
+  {% endcomment %}
+  {% include "src/site/components/phone.drupal.liquid" with
+    numbers = single.fieldPhone
     phoneHeaderLevel = serviceLocationSubHeaderLevel
   %}
-{% endif %}
-
-{% comment %}
-  Display each additional phone number provided
-{% endcomment %}
-{% include "src/site/components/phone.drupal.liquid" with
-  numbers = single.fieldPhone
-  phoneHeaderLevel = serviceLocationSubHeaderLevel
-%}
-
-{% if single.fieldEmailContacts %}
-  {% for email in single.fieldEmailContacts %}
-    <p class="vads-u-margin-y--1" data-template="paragraphs/service_location">
-    {% if email.entity.fieldEmailLabel %}
-      <h{{ serviceLocationSubHeaderLevel }}>{{ email.entity.fieldEmailLabel }} </h{{ serviceLocationSubHeaderLevel }}>
-    {% endif %}
-    <a aria-label="{{ email.entity.fieldEmailAddress }}"
-        data-template="paragraphs/service_location"
-        href="mailto:{{ email.entity.fieldEmailAddress }}">{{ email.entity.fieldEmailAddress }}
-    </a>
-  {% endfor %}
-{% endif %}
+
+  {% if single.fieldOtherPhoneNumbers.length > 0 %}
+    <div class="vads-u-display--flex vads-u-flex-direction--column vads-u-margin-bottom--1" data-template="facilities/health_care_local_health_service" data-testid="service-location-show-other-phone-numbers">
+      {% for number in single.fieldOtherPhoneNumbers %}
+        {% include "src/site/components/phone-number.drupal.liquid" with
+          phoneNumber = number.entity.fieldPhoneNumber
+          phoneExtension = number.entity.fieldPhoneExtension
+          phoneLabel = number.entity.fieldPhoneLabel
+          phoneHeaderLevel = 5
+        %}
+      {% endfor %}
+    </div>
+  {% endif %}
+
+  {% if single.fieldEmailContacts %}
+    {% for email in single.fieldEmailContacts %}
+      <p class="vads-u-margin-y--1" data-template="paragraphs/service_location" data-testid="service-location-email-contact">
+      {% if email.entity.fieldEmailLabel %}
+        <h{{ serviceLocationSubHeaderLevel }}>{{ email.entity.fieldEmailLabel }} </h{{ serviceLocationSubHeaderLevel }}>
+      {% endif %}
+      <a aria-label="{{ email.entity.fieldEmailAddress }}"
+          data-template="paragraphs/service_location"
+          href="mailto:{{ email.entity.fieldEmailAddress }}">{{ email.entity.fieldEmailAddress }}
+      </a>
+    {% endfor %}
+  {% endif %}
+
+  {% comment %}
+    single.fieldHours values:
+    - 0 = Use facility hours
+    - 1 = Do not specify hours
+    - 2 = Display specific hours
+  {% endcomment %}
+
+  {% if single.fieldHours != "1" %}
+    <h{{ serviceLocationSubHeaderLevel }} data-template="paragraphs/service_location" data-testid="service-location-field-hours">Service Hours</h{{ serviceLocationSubHeaderLevel }}>
+  {% endif %}
+  {% if single.fieldHours != empty %}
+    <div class="vads-u-margin-bottom--2">
+    {% case single.fieldHours %}
+      {% when '2' %}
+        {% if single.fieldOfficeHours %}
+          {% include "src/site/includes/hours.liquid" with allHours = single.fieldOfficeHours headerType = 'included' %}
+        {% endif %}
+      {% when '0' %}
+        <p data-testid="service-location-field-hours-same-as-facility">
+          The service hours are the same as our facility hours.
+        </p>
+    {% endcase %}
+    </div>
+  {% endif %}
+  {% if single.fieldAdditionalHoursInfo %}
+    <p>
+      <span data-template="paragraphs/service_location"><i>{{ single.fieldAdditionalHoursInfo }}</i></span>
+    </p>
+  {% endif %}
+</div>

src/site/paragraphs/tests/vamc/template/fixtures/non_clinical_service_location.json

@@ -0,0 +1,92 @@
+{
+  "fieldAddress": {
+    "addressLine1": "1100 North College Avenue",
+    "addressLine2": null,
+    "postalCode": "72703-1944",
+    "locality": "Fayetteville",
+    "administrativeArea": "AR"
+  },
+  "reverseFieldFacilityLocationNode": {
+    "entities": [
+      {
+        "entityId": "46268",
+        "fieldServiceNameAndDescripti": {
+          "entity": {
+            "entityId": "1026",
+            "entityLabel": "Medical records",
+            "name": "Medical records"
+          },
+          "targetId": 1026
+        },
+        "fieldServiceLocation": [
+          {
+            "entity": {
+              "status": true,
+              "fieldAdditionalHoursInfo": null,
+              "fieldEmailContacts": [],
+              "fieldOfficeHours": [
+                {
+                  "day": 1,
+                  "starthours": 800,
+                  "endhours": 1630,
+                  "comment": ""
+                },
+                {
+                  "day": 2,
+                  "starthours": 800,
+                  "endhours": 1630,
+                  "comment": ""
+                },
+                {
+                  "day": 3,
+                  "starthours": 800,
+                  "endhours": 1630,
+                  "comment": ""
+                },
+                {
+                  "day": 4,
+                  "starthours": 800,
+                  "endhours": 1630,
+                  "comment": ""
+                },
+                {
+                  "day": 5,
+                  "starthours": 800,
+                  "endhours": 1630,
+                  "comment": ""
+                }
+              ],
+              "fieldHours": "2",
+              "fieldPhone": [
+                {
+                  "entity": {
+                    "fieldPhoneLabel": "Medical Records",
+                    "fieldPhoneNumber": "479-443-4301",
+                    "fieldPhoneExtension": "65052",
+                    "fieldPhoneNumberType": "tel"
+                  }
+                }
+              ],
+              "fieldUseMainFacilityPhone": false,
+              "fieldServiceLocationAddress": {
+                "entity": {
+                  "fieldUseFacilityAddress": true,
+                  "fieldBuildingNameNumber": "Building 1",
+                  "fieldClinicName": "Room 1-44",
+                  "fieldWingFloorOrRoomNumber": "Basement",
+                  "fieldAddress": {
+                    "addressLine1": "",
+                    "addressLine2": "",
+                    "postalCode": "",
+                    "locality": "",
+                    "administrativeArea": ""
+                  }
+                }
+              }
+            }
+          }
+        ]
+      }
+    ]
+  }
+}

src/site/paragraphs/tests/vamc/vamc_field_service_location.unit.spec.js

@@ -0,0 +1,95 @@
+/* eslint-disable @department-of-veterans-affairs/axe-check-required */
+import { expect } from 'chai';
+import { getByTestId } from '@testing-library/dom';
+import { parseFixture, renderHTML } from '../../../tests/support';
+
+describe('VBA accordions for Service Locations', () => {
+  const fixture = parseFixture(
+    'src/site/paragraphs/tests/vamc/template/fixtures/health_care_local_facility.json',
+  );
+  const processedFixture = {
+    fieldAddress: fixture.fieldAddress,
+    fieldPhoneNumber: fixture.fieldPhoneNumber,
+    fieldOfficeHours: fixture.fieldOfficeHours,
+  };
+  it('should render render contents of COVID service', async () => {
+    // has onlineScheduling
+    // has fieldOtherPhoneNumbers
+    // should show Appointments header
+    // should show main number
+    const covidVaccinesEntity =
+      fixture.fieldLocalHealthCareService[0].entity.fieldServiceLocation[0]
+        .entity;
+    const covidHTML = await renderHTML(
+      'src/site/paragraphs/service_location.drupal.liquid',
+      {
+        ...processedFixture,
+        single: covidVaccinesEntity,
+      },
+    );
+    expect(getByTestId(covidHTML, 'service-location-field-office-visits')).to
+      .exist;
+    expect(getByTestId(covidHTML, 'service-location-appoinments-header')).to
+      .exist;
+    expect(getByTestId(covidHTML, 'service-location-main-facility-phone')).to
+      .exist;
+    expect(getByTestId(covidHTML, 'service-location-show-other-phone-numbers'))
+      .to.exist;
+    expect(getByTestId(covidHTML, 'service-location-field-hours')).to.exist;
+    expect(getByTestId(covidHTML, 'service-location-custom-text')).to.exist;
+  });
+  it('should render render contents of Anesthesia service', async () => {
+    // No onlineScheduling
+    // remove text
+    // no clinic name
+    // should show Appointments header (but because they say yes_with_appoinment)
+    // should show main number
+    const anesthesiaEntity =
+      fixture.fieldLocalHealthCareService[3].entity.fieldServiceLocation[0]
+        .entity;
+    const anesthesiaHTML = await renderHTML(
+      'src/site/paragraphs/service_location.drupal.liquid',
+      {
+        ...processedFixture,
+        single: anesthesiaEntity,
+      },
+    );
+    expect(getByTestId(anesthesiaHTML, 'service-location-field-office-visits'))
+      .to.exist;
+    expect(getByTestId(anesthesiaHTML, 'service-location-appoinments-header'))
+      .to.exist; // this one is odd - since it says yes_with_appoinment
+    expect(getByTestId(anesthesiaHTML, 'service-location-main-facility-phone'))
+      .to.exist;
+    // other expects will cause to fail
+  });
+  it('should render render contents of Gynecology service', async () => {
+    // Yes onlineScheduling
+    // default text
+    // Has clinic name
+    // should show Appointments header
+    // should show icon for office visits
+    // should NOT show main number
+    // should show other phone numbers
+    const gynecologyEntity =
+      fixture.fieldLocalHealthCareService[4].entity.fieldServiceLocation[0]
+        .entity;
+    const gynecologyHTML = await renderHTML(
+      'src/site/paragraphs/service_location.drupal.liquid',
+      {
+        ...processedFixture,
+        single: gynecologyEntity,
+      },
+    );
+    expect(getByTestId(gynecologyHTML, 'service-location-field-office-visits'))
+      .to.exist;
+    expect(getByTestId(gynecologyHTML, 'service-location-appoinments-header'))
+      .to.exist;
+    expect(
+      getByTestId(gynecologyHTML, 'service-location-show-other-phone-numbers'),
+    ).to.exist;
+    expect(getByTestId(gynecologyHTML, 'service-location-field-hours')).to
+      .exist;
+    expect(getByTestId(gynecologyHTML, 'service-location-default-text')).to
+      .exist;
+  });
+});

src/site/stages/build/drupal/graphql/file-fragments/appointmentItems.graphql.js

@@ -4,19 +4,5 @@
  *
  */
 module.exports = `
-  fieldHserviceApptLeadin
-  fieldHserviceApptIntroSelect
-  fieldOnlineSchedulingAvailabl
   fieldReferralRequired
-  fieldWalkInsAccepted
-  fieldPhoneNumbersParagraph {
-    entity {
-      ... on ParagraphPhoneNumber {
-        fieldPhoneExtension
-        fieldPhoneLabel
-        fieldPhoneNumber
-        fieldPhoneNumberType
-      }
-    }
-  }
 `;

src/site/stages/build/drupal/graphql/file-fragments/appointmentServiceLocationItems.graphql.js

@@ -0,0 +1,23 @@
+/*
+ *
+ * Appointments info for a facility service under the Service Location
+ *
+ */
+module.exports = `
+  fieldVirtualSupport
+  fieldOnlineSchedulingAvail
+  fieldUseFacilityPhoneNumber
+  fieldOtherPhoneNumbers {
+    entity {
+      ... on ParagraphPhoneNumber {
+        fieldPhoneNumber
+        fieldPhoneNumberType
+        fieldPhoneExtension
+        fieldPhoneLabel
+      }
+    }
+  }
+  fieldOfficeVisits
+  fieldApptIntroTextType
+  fieldApptIntroTextCustom
+`;

src/site/stages/build/drupal/graphql/paragraph-fragments/serviceLocation.paragraph.graphql.js

@@ -1,3 +1,5 @@
+const appointmentServiceLocationItems = require('../file-fragments/appointmentServiceLocationItems.graphql');
+
 /*
  *
  * A service location for a facility service.
@@ -7,6 +9,7 @@ module.exports = `
   fieldServiceLocation {
     entity {
       ... on ParagraphServiceLocation {
+        ${appointmentServiceLocationItems}
         status
         fieldServiceLocationAddress {
           entity {