How to use the mixpanel-browser.register function in mixpanel-browser

property_blacklist: [
      '$initial_referrer',
      '$initial_referring_domain',
      '$referrer',
      '$referring_domain',
    ],
  }
  const apiHost = process.env.REACT_APP_MIXPANEL_HOST
  if (apiHost) {
    options['api_host'] = apiHost
  }
  mixpanel.init(token, options)
  // disable mixpanel to report data immediately
  mixpanel.opt_out_tracking()
  if (info?.disable_telemetry === false) {
    mixpanel.register({
      $current_url: getPathInLocationHash(),
    })
    mixpanel.opt_in_tracking()
  }
}

function authSuccess(json, signUp) {
  mixpanel.identify(json.data.id);
  mixpanel.people.set({
    $user_id: json.data.id,
    $username: json.data.username,
    $email: json.data.email,    // only special properties need the $
    $created: json.data.created_at,
    $last_login: new Date(),         // properties can be dates...
  });
  mixpanel.register({
    username: json.data.username,
    user_id: json.data.id,
  });
  return {
    type: AUTH_SUCCESS,
    user: json.data,
    client: json.client,
    accessToken: json.accessToken,
    uid: json.uid,
    tokenType: json.tokenType,
    meta: {
      mixpanel: {
        event: signUp ? MP_USER_SIGNUP : MP_USER_LOGIN,
        props: { location: 'client' },
      },
    },

componentWillReceiveProps(nextProps) {
    this.checkAuth(nextProps);
    if (!this.props.user.rehydrated && nextProps.user.rehydrated) {
      if (nextProps.isAuthenticated) {
        ipcRenderer.send('set-spectator-mode', nextProps.spectator);
        ipcRenderer.send('sign-in', nextProps.user.id);
        mixpanel.identify(nextProps.user.id);
        mixpanel.people.set({
          $username: nextProps.user.username,
          $email: nextProps.user.email,
        });
        mixpanel.register({
          username: nextProps.user.username,
          user_id: nextProps.user.id,
        });
        if (nextProps.user.hasTeamAccess) {
          this.props.loadTeam();
        }
        this.props.loadMatchNotifications();
        this.fetchInterval = this.props.setInterval(() => {
          this.props.loadMatchNotifications();
        }, 15000);
        this.props.clearCaptureError();
      }
      handleUploadRestarting(nextProps);
    } else {
      if (nextProps.captureStatus.currentUpload !== null &&
          (this.props.captureStatus.currentUpload === null ||

function updateUserSuccess(json, signupCompleted) {
  mixpanel.identify(json.data.id);
  mixpanel.people.set({
    $username: json.data.username,
    $email: json.data.email,
  });
  mixpanel.register({
    username: json.data.username,
  });
  if (signupCompleted) {
    mixpanel.track(MP_USER_COMPLETED_SIGNUP, {
      location: 'client',
    });
  }
  return {
    type: UPDATE_USER_SUCCESS,
    user: json.data,
    message: 'User Updated Successfully',
  };
}

isDemoUser,
  }: {
    username: string,
    password: string,
    isDemoUser?: boolean,
  }) => {
    try {
      const response = await login({
        username,
        password,
      });
      const isAuthorized = get(response, 'data.login.isAuthorized');
      const token = get(response, 'data.login.token');

      if (isAuthorized) {
        mixpanel.register({ username });
        mixpanel.track('Logged in');
        await Promise.all([
          saveCredentials({
            token,
            isDemoUser,
          }),
          this.props.saveToken({
            token,
            isDemoUser,
          }),
        ]);
        this.props.history.push('/');
      } else {
        this.setState({ isLoadingDemo: false, isLoading: false, error: 'Wrong Credentials!' });
      }
    } catch (e) {

componentWillMount() {
    this.checkAuth(this.props);
    if (this.props.isAuthenticated) {
      ipcRenderer.send('set-spectator-mode', this.props.spectator);
      ipcRenderer.send('sign-in', this.props.user.id);
      mixpanel.identify(this.props.user.id);
      mixpanel.people.set({
        $username: this.props.user.username,
        $email: this.props.user.email,
      });
      mixpanel.register({
        username: this.props.user.username,
        user_id: this.props.user.id,
      });
      if (this.props.user.hasTeamAccess) {
        this.props.loadTeam();
      }
      this.props.loadMatchNotifications();
      this.fetchInterval = this.props.setInterval(() => {
        this.props.loadMatchNotifications();
      }, 15000);
      this.props.clearCaptureError();
    }
    handleUploadRestarting(this.props);
  }

private setAnalyticsDimensions(serviceLevel: string, monthYear?: string) {
    if (!environment.analytics) {
      return;
    }

    const dimensions: {dimension1?: string; dimension2: string} = {dimension2: serviceLevel};
    if (monthYear) {
      dimensions.dimension1 = monthYear;
    }

    this.angulartics2GoogleAnalytics.setUserProperties(dimensions);

    if (environment.mixpanelKey) {
      mixpanel.register({'Registered on': monthYear, 'Service Level': serviceLevel});
    }
  }

export function trackEvent(event: AnalyticsEvent, config: AnalyticsConfig) {
  const { optedIn } = config

  log.debug('Trackable event', { event, optedIn })
  if (MIXPANEL_ID && optedIn) {
    if (event.superProperties) mixpanel.register(event.superProperties)
    if (event.name) mixpanel.track(event.name, event.properties)
  }
}

export function setMixpanelTracking(config: AnalyticsConfig) {
  if (MIXPANEL_ID) {
    if (config.optedIn) {
      log.debug('User has opted into analytics; tracking with Mixpanel')
      mixpanel.identify(config.appId)
      mixpanel.opt_in_tracking()
      mixpanel.register({ appVersion: CURRENT_VERSION, appId: config.appId })
    } else {
      log.debug('User has opted out of analytics; stopping tracking')
      mixpanel.opt_out_tracking()
      mixpanel.reset()
    }
  }
}