Company Switcher initialization

The Company Switcher initializer configures the drop-in for managing multi-company contexts in B2B storefronts. Use initialization to customize company context management, header injection, session persistence, and GraphQL module integration.

Version: 1.0.6-beta5

Configuration options

The following table describes the configuration options available for the Company Switcher initializer:

Parameter	Type	Req?	Description
langDefinitions	LangDefinitions	No	Language definitions for internationalization (i18n). Override dictionary keys for localization or branding.
companyHeader	string	No	HTTP header name for company identification. Defaults to `‘X-Adobe-Company’`.
customerGroupHeader	string	No	HTTP header name for customer group identification. Defaults to `‘Magento-Customer-Group’`.
companySessionStorageKey	string	No	Session storage key for persisting company context. Defaults to `‘DROPIN__COMPANYSWITCHER__COMPANY__CONTEXT’`.
groupSessionStorageKey	string	No	Session storage key for persisting group context. Defaults to `‘DROPIN__COMPANYSWITCHER__GROUP__CONTEXT’`.
fetchGraphQlModules	FetchGraphQL[]	No	`GraphQL` modules that will have company headers applied. Defaults to `[]`.
groupGraphQlModules	FetchGraphQL[]	No	`GraphQL` modules that will have group headers applied. Defaults to `[]`.

Default configuration

The initializer runs with these defaults when no configuration is provided:

import { initializers } from '@dropins/tools/initializer.js';
import { initialize } from '@dropins/storefront-company-switcher';

// All configuration options are optional
await initializers.mountImmediately(initialize, {
  langDefinitions: {}, // Uses built-in English strings
  models: {}, // Uses default data models
  // Drop-in-specific defaults:
  // companyHeader: undefined // See configuration options below
  // customerGroupHeader: undefined // See configuration options below
  // companySessionStorageKey: undefined // See configuration options below
  // groupSessionStorageKey: undefined // See configuration options below
  // fetchGraphQlModules: undefined // See configuration options below
  // groupGraphQlModules: undefined // See configuration options below
});

Language definitions

Override dictionary keys for localization or branding. The langDefinitions object maps locale keys to custom strings that override default text for the drop-in.

import { initializers } from '@dropins/tools/initializer.js';
import { initialize } from '@dropins/storefront-company-switcher';

const customStrings = {
  'AddToCart': 'Add to Bag',
  'Checkout': 'Complete Purchase',
  'Price': 'Cost',
};

const langDefinitions = {
  default: customStrings,
};

await initializers.mountImmediately(initialize, { langDefinitions });

Tip

For complete dictionary customization including all available keys and multi-language support, see the Company Switcher Dictionary page.

Customizing data models

Extend or transform data models by providing custom transformer functions. Use the models option to add custom fields or modify existing data structures returned from the backend.

Available models

The following models can be customized through the models configuration option:

Note

No customizable models are available for this drop-in.

The following example shows how to customize the CustomModel model for the Company Switcher drop-in:

import { initializers } from '@dropins/tools/initializer.js';
import { initialize } from '@dropins/storefront-company-switcher';

// Configure GraphQL modules to receive company headers
await initializers.mountImmediately(initialize, {
  // Add company headers to specific GraphQL modules
  fetchGraphQlModules: ['commerce-cart', 'commerce-checkout'],
  groupGraphQlModules: ['commerce-pricing'],
  // Custom header names for backend integration
  companyHeader: 'X-Company-Context',
  customerGroupHeader: 'X-Customer-Group',
});

Drop-in configuration

The Company Switcher initializer configures the drop-in for managing multi-company contexts in B2B storefronts. Use initialization to customize company context management, header injection, session persistence, and GraphQL module integration.

import { initializers } from '@dropins/tools/initializer.js';
import { initialize } from '@dropins/storefront-company-switcher';

await initializers.mountImmediately(initialize, {
  langDefinitions: {},
  companyHeader: 'X-Custom-Header',
  customerGroupHeader: 'X-Custom-Header',
  companySessionStorageKey: 'customKey',
  groupSessionStorageKey: 'customKey',
  fetchGraphQlModules: [],
  groupGraphQlModules: [],
});

Note

Refer to the Configuration options table for detailed descriptions of each option.

Configuration types

The following TypeScript definitions show the structure of each configuration object:

langDefinitions

Maps locale identifiers to dictionaries of key-value pairs. The default locale is used as the fallback when no specific locale matches. Each dictionary key corresponds to a text string used in the drop-in UI.

langDefinitions?: {
  [locale: string]: {
    [key: string]: string;
  };
};