Change tabs to segmented button group

[thejordanwood]

Description

The View list and View map tabs currently on mobile aren't recommended by the Design System Team. At a Design System Council meeting on 1/16/2025, we brought an experimental design ticket to them asking if we can use the USWDS segmented button group. It was decided that we would use the segmented button group the mobile app uses and test this styling during usability testing. If this tests well, our team can contribute it back to the design system and make it an official component.

• VA segmented button group

Design

Facility Locator Figma file

Current (tabs)

Updated (segmented button group)

Engineering Notes

QA / Testing

• Design review
• Accessibility review

Acceptance criteria

• Feature work is placed behind a feature toggle to be viewed in Staging only, while preserving Production behavior: facility_locator_mobile_map_update
• Mapbox always needs to be in the DOM whether displayed or not. Button select determines if it is displayed.
• New segmented button component take the place of the tabs
• When switching between list and map, the search parameters persist
• When changing search parameters, both list and map update
• Design matches Figma file