Trigger Analytics

You can listen to various events on the triggers to generate you own analytics. These events can come from a Bubble or Card component.

Example

import { JoinStoriesView, JoinStories } from '@join-stories/react-native-widgets';

export default function Home() {
  useEffect(() => {
    const triggerAnalyticsSubscription = JoinStories.addTriggerAnalyticsListener((data) => {
      console.log(data);
    });

    return () => {
      triggerAnalyticsSubscription.remove();
    };
  }, [])
  
  return (
  	<SafeAreaView>
    	<Text>Welcome !</Text>
      <JoinStoriesView alias="<your_join_alias>" />
    </SafeAreaView>)
}

Event payload

Each event has the following basic payload:

{
  type: string;
  cpWidgetAlias: string;
  date: string;
  cpWidgetVersion: string;
  eventOwner: string;
  eventType: string;
  eventCategory: string;
  storyClicked: string;
}

type field is one of the events below.

List of events

Event name	additional parameters	Description
StoriesFetched		Each time the trigger fetch the list of stories from the API.
WidgetMounted		Each time the trigger is instantiated.
ComponentVisible50		After instantiation, the first time the trigger is visible at least on 50% of its height.
ComponentVisible75		After instantiation, the first time the trigger is visible at least on 75% of its height.
FirstClickOnWidget	`storyClicked`(string) : storyId	After instantiation, the first time the trigger is clicked to open the player.
AdditionalClickOnWidget	`storyClicked` (string) : storyId	Each time the trigger is clicked after the first click (see previous event).

Player Analytics

You can listen to various events on the player to generate you own analytics. These events can come from a player opened via a Bubble or Card component or via a Standalone Player.

Example

import { JoinStoriesView, JoinStories } from '@join-stories/react-native-widgets';

export default function Home() {
  useEffect(() => {
  	const playerAnalyticsSubscription = JoinStories.addPlayerAnalyticsListener((data) => {
      console.log(data);
    });

    return () => {
      playerAnalyticsSubscription.remove();
    };
  }, [])
  
  return (
  	<SafeAreaView>
    	<Text>Welcome !</Text>
      <JoinStoriesView alias="<your_join_alias>" />
    </SafeAreaView>)
}

Event payload

Each event has the following payload:

{
  type: string;
  storyId: string;
  cpIndex: string;
  cpTitle: string;
  cpScreenColor: string;
  eventOwner: string;
  date: string;
  eventCategory: string;
  storyPageCount: string;
}

type field is one of the events below.

List of events

Event name	Description
StoryPageVisible	Each time a chapter (equivalent to story page) starts playing.
StoryLastPageVisible	Each time the last chapter (last story page) starts playing.
StoryError	Something went wrong with the player
StoryClickOnCallToAction	Each time the user clicks on a CTA