Guide to migrate from Beagle Analytics 1.0 to Beagle Analytics 2.0

In this section we describe Beagle Analytics in general walking you through the migration to Beagle Analytics version 2.

What is Beagle Analytics?

Analytics is a Beagle feature that tags certain events such as clicking in a component or loading a screen.

About Analytics 1.0

In its first version, you would have to implement a ClickEvent or a ScreenEvent in the Backend, as shown in the example below:

ClickEvent(
   category = "category-button",
   label = "label-button",
   value = "value-button"
)
ScreenEvent(
   screenName = "FALLBACK"
)

Each event had to be declared in its own component defined on the backend, for example:

We have listed an example bellow for a Button component declared at the backend and configured with an analytic event:

Button(
   text = "Analytics 1",
   onPress = listOf(
       Alert("Analytics 1", "Trying again!")
   ),
   clickAnalyticsEvent = ClickEvent(
       category = "category-button",
       label = "Label-button",
       value = "value-button"
   )
)

Once declared in the Backend, the events (with the information listed in them) could be retrieved from the frontend using a custom class to handle them.

  • This class must extend itself from a Beagle inner class called Analytics. This class gathers event information into an object called event. You can check the Android signature for reference below:
@BeagleComponent
class SampleAnalytics: Analytics {
   override fun trackEventOnClick(event: ClickEvent) {
       //This code block will run when a ClickEvent is received
  Log.i("analytics1", "$event")
   }
   override fun trackEventOnScreenAppeared(event: ScreenEvent) {
       //This code block will run when a Screen is rendered
  Log.i("analytics1", "screenUp -> "+ event.screenName)
   }
   override fun trackEventOnScreenDisappeared(event: ScreenEvent) {
       //This code block will run when a Screen disappears
   }
}

About Analytics 2.0

Analytics 2.0 has highly improved the control over the tracking of Beagle Events. These can still be mapped in the backend and retrieved from frontend but now it also possible to enable tracking for actions and its properties directly from your app without even having to map them in the backend.

An example on how this class will look like on the Android has been set up below:

@BeagleComponent
class SampleAnalytics2:AnalyticsProvider {
   override fun getConfig(): AnalyticsConfig = object: AnalyticsConfig{
       override var actions: Map<String, List<String>>? = hashMapOf(
           "beagle:alert" to listOf("message")
       )
       override var enableScreenAnalytics: Boolean? = true
   }
   override fun createRecord(record: AnalyticsRecord) {
       Log.i("analytics2", record.toString())
   }
}

The general configuration of what should and should not generate analytics events is in the frontend, but it is still possible to control the events from the backend.

Now, the property that holds analytics events is part of the action, an not the button or screen anymore, as in Analytics 1. This property is called analytics

Here follows an action sample that was declared with analytics settings in the backend

Alert(
   title = "Analytics 2",
   message = "Trying again!",
   analytics = ActionAnalyticsConfig.Enabled(
       ActionAnalyticsProperties(
           attributes = listOf("message", "title")
       )
   )
)

Note that ActionAnalyticsConfig is set to .Enabled, that is what makes the frontend capture the event that triggers the record function and demonstrate it

ActionAnalyticsConfig had a few properties, and here we only list the attributes for the action we want information about, but there is another property called AdditionalEntries that could send extra information with in this event.

Migrating from Analytics 1 to Analytics 2

Let’s start with the backend. While it is no longer necessary to create events in the backend, this functionality is available for Analytics 2 and event tracking can be performed from the backend as well.

All information, previously implemented in specific attributes in the clickEvent class, are now automatically sent to the frontend.

  1. Delete the ClickEvent or ScreenEvent implementation on your components (Screen, button, touchable, or any other clickable custom component that is declared with this settings)
  2. Add the ActionAnalyticsConfig.Enabled code to the analytics property for any action you want to get analytics for.
  3. We have listed below the before and after of a button with analytics 1 and 2 functionalities in the backend. We have also listed the information that will be retrieved in the frontend (We listed the information on each object as a string):
  1. Now, in the frontend, just delete the custom class for analytics 1 and implement a new class for analytics 2.
  2. Follow the analytics 2 class example listed in this guide for Android and test it using the Alert action.
  3. For other platforms (WEB, iOS), check the examples listed in our documentation to implement AnalysticsConfig.
  4. Remember to log the actions you want to access even when the backend doesn’t specify anything in AnalyticsProvider getConfig() function
  5. Now that AnalyticsProvider has been implemented, just run your application and the events will be received in the frontend.