Skip to main content

LogRocket integration

CommandBar’s integration with LogRocket works in two directions:

  1. CommandBar —> LogRocket: send CommandBar-generated events to LogRocket, so you have a fuller picture of user engagement
  2. LogRocket —> CommandBar: use LogRocket user traits and events for Who and When targeting in CommandBar
One-time configuration

Once configured, the integration will "just work" — no maintenance required. You will not need to make any code changes to handle new traits.

Sending CommandBar events to LogRocket

This is a 1-step integration!

Navigate to Integrations and click Enable on the LogRocket integration card.

LogRocket integration card

How does this work? What pages will events be sent from?

Events generated by CommandBar will now flow to LogRocket from any page in your product where (a) CommandBar is booted and (b) LogRocket is installed.

Why don’t I see events flowing through?

CommandBar sends events to LogRocket via LogRocket.track(). If you use a different LogRocket SDK version, you can do the following:

  1. Disable the integration

    Disabling the LogRocket integration

  2. After you init CommandBar, put the following code in your app:

    window.CommandBar.addEventSubscriber((eventName, eventData) => {
    // replace the line below with your SDK method
    LogRocket.track();
    });

Using LogRocket data and events in CommandBar

You can (1) send LogRocket user events to CommandBar; and (2) send LogRocket events to CommandBar

Sending properties to CommandBar

You can send any of the existing user properties that you send to LogRocket to CommandBar Here’s a simplified code snippet:

// Your existing user properties
var userId = '123456',
var userProperties = {
name: "Roger Rocket",
email: "roger@logrocket.com",
plan: "pro",
role: "admin",
...
};

// Passed to LogRocket
LogRocket.identify(userId, userProperties);

// And additionally sent to CommandBar:
window.CommandBar.boot(userID, userProperties);

// Adding one-off or session only properties to CommandBar is easy too:
window.CommandBar.addMetadata("userIsWorkspaceOwner", true);

Sending events to CommandBar

All events sent to LogRocket can also be relayed to CommandBar. This allows you to treat any LogRocket event the same way as a natively-generated CommandBar event.

// Many companies using PostHog events have a globally available function
// to track events. The simplest way to ingest all events is to add a
// CommandBar SDK call to trackEvent to this function.

const reportEvent = (event, eventProperties) => {
LogRocket.track(event, eventProperties);
window.CommandBar.trackEvent(event, eventProperties);
};