Custom Analytics

Start of documentation content

Formally includes custom analytics handlers, however this is disabled by default for privacy reasons.

Use of onAnalytics

By writing a small adaptor you can wire up Formally to your own Analytics API. This does not allow you to track additional features, just to dispatch them to a different service. This may allow greater data sovereignty.

You can override the default analytics handler

import { Formally } from 'formally';

<Formally
  onAnalytics={({ eventType, sessionId, formId, formVersionId }) => {
    // Send anonymous statistics to your own analytics service
    //
    // eventType is either "form-focus", "page-change", or "form-submit".
    //
    // sessionId is a string id randomly generated
    // * per browser tab, and
    // * per form, and
    // * per page load.
    // The sessionId is not persisted (in any storage/cookies etc) so
    // every page load will regenerate the sessionId.
    // The sessionId is just derived from math.random() and it's not
    // cryptographically seeded by any user identifiable details.
    // The purpose of the sessionId is to associate multiple analytics
    // events with a single user session of a form.

    if (eventType === 'form-submit') {
      // call your analytics service when the form submits
    }

    // nothing needs to be returned from this function
  }}
/>;