Skip to main content

Multiple environments (e.g. mobile and desktop)

If you manage multiple environments (e.g., mobile and desktop), there are a few wrinkles to how you might choose to deploy CommandBar.

How can I give my users an experience specific to the environment?​

Fortunately, CommandBar is very flexible allowing you to customize the user experience to the environment.

If the environment experiences have little to no overlap: the recommended approach is to create a separate tenant for each venue (one for desktop, one for mobile, etc.). In this scenario, you call init based on the environment. Note that this option is only available on Growth and Enterprise plans.

import { init } from 'commandbar';
...
const env = getEnv();
if (env == 'mobile') {
  init('MY_MOBILE_WORKSPACE_ORG_ID');
} else {
  init('MY_DESKTOP_WORKSPACE_ORG_ID');
}

How can I control which products a user sees in each environment?​

You can use the products property of the instanceAttributes argument in .boot to specify which products should be included in the user’s experience.

const userId = getUserId();
...
const env = getEnv();
if (env == 'mobile') {
	window.CommandBar.boot(userId, {}, {products: ['help_hub']};
} else {
	window.CommandBar.boot(userId, {}, {products: ['nudges', 'help_hub']};
}