A simple JavaScript module facilitating the seamless integration of Clarity tracking into web applications using clarity-js

clarityAnalytics.js

import { clarity } from "clarity-js";
import { isNil, isEmpty } from "ramda";

const isNilorEmpty = val => isNil(val) || isEmpty(val);

/**
 * Initializes Clarity tracking with the provided Clarity project Id, unique user identifier, and custom tags.
 * @param {string} clarityId - The Clarity project Id. This parameter is required.
 * @param {string} [uniqueId=""] - The unique identifier for the user.
 * @param {Object.<string, string>} [customTags={}] - Custom tags to be set for Clarity. Each key-value pair represents a custom tag and its value.
 *   - The tags can be any alphanumeric value including spaces.
 *   - The tag and its value can't be longer than 255 characters.
 */
const initializeClarity = (clarityId, uniqueId = "", customTags = {}) => {
  if (isNilorEmpty(clarityId)) {
    console.error("clarityId is a required parameter");
    return;
  }


  const tags = Object.keys(customTags);

  if (tags.length > 0) {
    tags.forEach(key => {
      clarity.set(key, customTags[key]);
    });
  }

  clarity.start({
    projectId: clarityId,
    upload: "https://m.clarity.ms/collect",
    track: true,
    content: true,
    cookies: tags
  });

  if (!isNilorEmpty(uniqueId)) {
    clarity.identify(uniqueId);
  }
};

const stopClarity = () => clarity.stop();

export default {
  initializeClarity,
  stopClarity
};