Offers

This page describes all of the offer methods available within the Limio SDK.

groupOffers Function

The groupOffers function is used to organise a list of offers into groups based on their group__limio attribute. This function is particularly useful when you need to display offers categorised by their group in a component, such as a Switch component.

Function Signature

function groupOffers(offers: Array<LimioObject<Offer>> = [], groupLabels: Group[] = []): Array<GroupInfo>

Parameters

• offers (optional): An array of LimioObject<Offer> objects to be grouped.

  • Type: Array<LimioObject<Offer>>

  • Default: []

• groupLabels (optional): An array of Group objects that define the possible groups and their labels.

  • Type: Array<{ id: string, label: string, thumbnail?: string }>

  • Default: []

LimioObject Structure

The LimioObject<Offer> type represents an offer in the Limio system. It has the following structure:

type LimioObject<Offer> = {
  data: {
    attributes: {
      group__limio?: string;
      display_name__limio?: string;
      // ... other attributes specific to offers
    };
    // ... other data properties
  };
  // ... other top-level properties
};

Key points about LimioObject<Offer>:

• The group__limio attribute is used for grouping offers.

• The display_name__limio attribute typically contains the display name of the offer.

• There may be other attributes and properties specific to offers that are not used by the groupOffers function.

Return Value

The function returns an array of GroupInfo objects, where each object contains:

• groupId: The identifier of the group (string)

• id: The same as groupId (string)

• label: The display label for the group (string)

• offers: An array of LimioObject<Offer> objects belonging to that group

• thumbnail: The thumbnail URL for the group (string, optional)

Usage Example

import { groupOffers, useCampaign } from '@limio/sdk';

// Define your group labels
const groupLabels = [
  { id: 'monthly', label: 'Monthly Subscriptions', thumbnail: 'monthly.png' },
  { id: 'yearly', label: 'Annual Subscriptions', thumbnail: 'yearly.png' }
];

const { offers } = useCampaign()

// Group the offers
const groupedOffers = groupOffers(offers, groupLabels);

console.log(groupedOffers);
// Output:
// [
//   {
//     groupId: 'monthly',
//     id: 'monthly',
//     label: 'Monthly Subscriptions',
//     offers: [
//     // offer data simplified for this example 
//       { data: { attributes: { group__limio: 'monthly', display_name__limio: 'Basic Monthly' } } },
//       { data: { attributes: { group__limio: 'monthly', display_name__limio: 'Pro Monthly' } } }
//     ],
//     thumbnail: 'monthly.png'
//   },
//   {
//     groupId: 'yearly',
//     id: 'yearly',
//     label: 'Annual Subscriptions',
//     offers: [
//     // offer data simplified for this example 
//       { data: { attributes: { group__limio: 'yearly', display_name__limio: 'Premium Annual' } } }
//     ],
//     thumbnail: 'yearly.png'
//   },
//   {
//     groupId: 'weekly',
//     id: 'weekly',
//     label: 'Other',
//     offers: [
//     // offer data simplified for this example 
//       { data: { attributes: { group__limio: 'weekly', display_name__limio: 'Weekly Special' } } }
//     ],
//     thumbnail: ''
//   },
//   {
//     groupId: 'other',
//     id: 'other',
//     label: 'Other',
//     offers: [
//     // offer data simplified for this example 
//       { data: { attributes: { display_name__limio: 'Special Offer' } } }
//     ],
//     thumbnail: ''
//   }
// ]

Behaviour Notes

1. Offers are grouped based on their group__limio attribute.

2. If an offer doesn't have a group__limio attribute, it's grouped under "other".

3. For each unique group (including "other"), a GroupInfo object is created.

4. If a matching groupLabel is found:

   • The label is set to the matching group's label.

   • The thumbnail is set to the matching group's thumbnail (or an empty string if not provided).

5. If no matching groupLabel is found:

   • The label is set to "Other".

   • The thumbnail is set to an empty string.

6. The groupId and id are always set to the original group value from the offer.

7. If the offers array is empty, an empty array is returned.

8. If the groupLabels array is empty, all groups will have the label "Other" and an empty thumbnail.