Skip to main content

CMS

@archibald/commerce/cms implements the @archibald/cms contract against SAP Commerce content: pages, content slots and components served through the OCC CMS API, with SmartEdit awareness for in-context editing.

How to use

Client

Configure the CMSClient with the commerce adapter — previewOptions enables SmartEdit live editing:

// src/{platform}/client/api/creators/cms.ts
import { CMSClient } from '@archibald/cms';
import { CommerceCMSAdapter } from '@archibald/commerce/cms';

import { api } from 'shop/client/api';

export default new CMSClient({
adapter: CommerceCMSAdapter,
api,
previewOptions: {
authorizedUrls: Config.get('hybris.smartedit.authorizedUrls', []),
scriptPath: '/public/webApplicationInjector.js',
enableLiveUpdates: true
}
});

Server

// src/{platform}/server/module/server.tsx
import { CMSModule } from '@archibald/cms';
import { CommerceCMSProvider } from '@archibald/commerce/cms';

new CMSModule({ provider: new CommerceCMSProvider({ config: () => this.configService.get('hybris.api') }) });

The provider is the extension seam: the shop template's portal platform subclasses it (UserRoleCommerceCMSProvider extends CommerceCMSProvider) to filter content by user role.

API reference

ExportSideWhat it is
CommerceCMSAdapterclientCMSClient adapter for OCC CMS pages/components, SmartEdit-aware
CMS components & interfacesclientTyped interfaces for OCC component payloads plus supporting components
CommerceCMSProviderserverCMSModule provider fetching pages/slots/components from OCC; subclass to customize

Configuration

  • hybris.api — OCC host and paths, through the provider's config callback.
  • hybris.smartedit.authorizedUrls — origins allowed to drive the SmartEdit preview.

Further documentation