Skip Navigation

Decision Support Bar Tiles

Custom widget can be added to shopping decision support bar.

decision support bar shopping
decision support bar shopping tile

Tile content

The content class of the tile widget should extend Tile<ShoppingData> class.

Then in selfDrawerContextModelPropagated method the setDataContent method is call with object that describes the look of the tile.

For example:

    caption: '',
    contentTitle: 'SDK Decision Support',
    contents: [
            content: `Departure airport: ${shoppingData.getDepartureAirportIata()} \n Departure date: ${shoppingData.getDepartureDate()}`
    footer: 'Departure Airport: ' + shoppingData.getDepartureAirportIata()

The contentTitle and footer` fields are shown by default:

decision support bar shopping tile

The contents is shown when the bar is extended:

decision support bar extended

caption field is not used in the decision bar context.


Tiles can be added to decision support bar using DrawerService addConfig method with shopping-response as a key and Tile as a param:

private registerDecisionSupportTile(): void {
    const supportBarTile = new TileWidgetDrawerConfig(DecisionSupportTile);
    getService(DrawerService).addConfig(['shopping-response'], supportBarTile);


The ShoppingData model (from sabre-ngv-app/app/responses/shopping/models module) is send to selfDrawerContextModelPropagated with data that can be used to create proper view.


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


You can see examples of tile widgets contributions in com.sabre.redapp.example3.web.tilewidgets sample.