Skip Navigation

Shopping Tile Widgets

The business purpose of Shopping Tile Widgets is to allow Red Apps to add tiles into results of shopping search and pricing.

tile widget shopping

Shopping Details, after expanding search result:

tile widget shopping details

Pricing, after 'Sell & Save Price' on previous step

tile widget shopping pricing


Red Apps can contribute to Shopping Tile Widgets in two ways, depending on the place in the flow

  1. via IAirPricingService for React tile in pricing drawer

  2. via ExtensionPointService for search result tiles


Tiles can be added to

  1. Shopping search result drawer with shopping-flight-segment config.

getService(DrawerService).addConfig(['shopping-flight-segment'], shoppingDrawerConfig);
  1. Pricing drawer using createPricingTile method from IAirPricingService.

getService(IAirPricingService).createPricingTile(PricingTile, showPricingModal, 'Pricing Details SDK');


For shopping search tile the FlightSegment model from sabre-ngv-app/app/common/data/flight/FlightSegment package is used.

For pricing drawer the AirPricingData model from sabre-ngv-pricing/response/interfaces/AirPricingData module is used.

Detailed APIs of configs and data models used to configure and work with tile widgets can be found in TypeScript API Documentation.