How to setup streaks?

This article explains how to set up streaks feature on your custom storefront.

Before you start

  1. Setting up streaks requires use of Loop storefront API here.
  2. To learn what is streaks and how to set it up on your admin portal, please refer to this help article.

Pre-requisites

  1. Configure everything in Loop admin (program, eligibility, streak length, grace period, rewards, texts) and set the program Active.
  2. On the storefront, you only fetch streak details and render the banner (no streak logic on frontend).
  3. Keep subscriptionId ready and pass locale if you want localized banner texts in the endpoint.

Storefront API - Fetch Streak Details

Note: If locale is not passed, the API returns content in the store’s default language.

Endpoint payload (what it returns)

The response includes:

  • programName (string): streak program name
  • streakLength (integer): total milestones (example: 5-order streak)
  • gracePeriod (integer): allowed window after due date to keep the streak
  • status (string): current streak state (example: ACTIVE)
  • nextDueDate (string): next scheduled order date/time (UTC)
  • rewards (array): milestone list

Each milestone contains:

  • orderNumber (integer): milestone number (1, 2, 3…)
  • rewardType (string): reward at that milestone (example: NONE, GIFT)
  • rewardConfig (object | null): reward metadata (null when rewardType=NONE)
  • texts (object): banner text + optional images (locale-aware via ?locale=)