Skip to main content

Analytics

The Analytics module is responsible for managing events on a website. The module is composed of two main functions:

  • sendAnalyticsEvent - fires events in the browser. When you fire an event using this function, the event is only shared with the website's origin. The event is wrapped and sent to the Window object over standard postMessage calls.
  • useAnalyticsEvent - intercepts fired events and usually communicates with an analytics provider.

Analytics module

caution

Events sent via the Analytics module are not directly sent to any analytics provider (e.g., Google Analytics). This configuration can be done manually with the useAnalyticsEvent hook.

The Analytics module supports sending and receiving events of any shape, so you can implement your own types and override default ones.

Another central feature of the Analytics module is Enhanced Ecommerce-focused types based on Google Analytics 4 (GA4) data model.

List of types

The Analytics SDK comes with native types based on Enhance Ecommerce. All event types are available for use and extension. Here's the list of the events the analytics module natively supports:

TypeDescription
add_payment_infoReceives currency, value, coupon, payment_type, and items params.
add_shipping_infoReceives currency, value, coupon, shipping_tier, and items params.
add_to_cartReceives currency, value, and items params.
add_to_wishlistReceives currency, value, and items params.
begin_checkoutReceives currency, value, coupon, and items params.
loginReceives the method param.
purchaseReceives currency, transaction_id, value, affiliation, coupon, shippinh, tax and items params.
remove_from_cartReceives currency, value, and items params.
searchReceives the search_term param.
select_itemReceives item_list_id, item_list_name, and items params.
select_promotionReceives item_list_id, item_list_name, and items params.
shareReceives method, content_type, and item_id params.
signupReceives method, content_type, and item_id params.
view_cartReceives currency, value, and items params.
view_itemReceives currency, value, and items params.
view_item_listReceives item_list_id, item_list_name, and items params.
view_promotionReceives the items params.

Each of these events exports at least two types: the type of the event params and the event type itself.

As an example, the add_to_cart has two exported types: AddToCartParams<T extends Item = Item> and AddToCartEvent<T extends Item = Item>.

Also, some types are common to all events, such as the Item type. These types are particularly useful when overriding Item properties or a whole Item itself.

Google Analytics 4

Google Analytics is by far the industry-leading analytics solution that most ecommerce websites use, and the Analytics module was built with it in mind. All the module's helper functions and hooks use the Google Analytics 4 (GA4) data model by default. This way, you can use a code hinting tool to receive suggestions of GA4 events along with their recommended properties while coding.

To send the events to Google Analytics, you'll need to use the useAnalyticsEvent hook. The hook must listen to events from sendAnalyticsEvents and add them to the dataLayer (for Google Tag Manager - recommended) or call the gtag function directly (for gtag script implementations).

Code hinting

Leveraging from the Analytics module's type definitions, you can use IntelliSense suggestions for code hinting.

IntelliSense

Didn't find your answers? Ask the Community. For documentation suggestions, submit your feedback.

JOIN THE COMMUNITY

ON THIS PAGE