Tracking usage of a feature

Like they say, you can't fix what you can't measure. Launching a feature is useless until you can receive customer feedback on feature usage. We are using mixpanel to track user behaviors and have made a utility to log events easily.

Analytics utility

Please refer to app\src\utils\analytics\appAnalytics.js for the utility methods and add yours accordingly.

When to log an event

Ideally log the event after everything else is done and response is successful. Example below:

const createTask = () => {
  const hide = message.loading(" Creating task from template...", 0);
  setCreateTaskLoader(true);
  dispatch({
    type: "template/createTaskFromTemplate",
    payload: {
      projectId,
      templateId,
    },
  }).then((res) => {
    if (res) {
      setCreateTaskLoader(false);
      setTimeout(hide, 0);
      const key = `open${Date.now()}`;
      notification.success({
        message: `Task #${res.taskId} is created successfully`,
        description: (
          <a
            href
            onClick={() => {
              history.replace(`/projects/${projectId}/tasks/${res.taskId}`);
              notification.close(key);
            }}
          >
            Click to view task
          </a>
        ),
        duration: 15,
        key,
      });
      setVisible(false);
 
      //>>> --- >>>track the event HERE, once everything is said and done
      logTaskTemplateUsedEvent();
    }
  });
};

Satori How to Create Effects