Interface WorkbenchNotificationCapability

Type Declaration

• [key: string]: unknown

  Arbitrary metadata associated with the capability.

• OptionalcssClass?: string | string[]

  Specifies CSS class(es) to add to the notification, e.g., to locate the notification in tests.

• OptionalgroupParamsReducer?: string

  Enables aggregation of parameters of notifications of the same group.

  To aggregate parameters, define a topic that receives a 'reduce' request before showing a new notification if one of the same group is already showing. This request contains both previous and new parameters. Respond with the parameters for the new notification.

  Example: - Replies to reduce requests sent to topic `notifications/reducer`, counting notifications.

  import {Beans} from '@scion/toolkit/bean-manager';
  import {MessageClient} from '@scion/microfrontend-platform';
  
  Beans.get(MessageClient).onMessage<{prevParams: Record<string, unknown>; currParams: Record<string, unknown>}>('notifications/reducer', request => {
    const {prevParams, currParams} = request.body!;
  
    const count = (prevParams['count'] ?? 0) as number;
    return {...currParams, count: count + 1};
  });
  Copy

• path: string

  Specifies the path to the microfrontend.

  The path is relative to the base URL given in the application manifest, or to the origin of the manifest file if no base URL is specified.

  Path segments can reference capability parameters using the colon syntax.

  {
    "params": [
      {"name": "id", "required": true}
    ],
    "properties": {
      "path": "products/:id", // `:id` references a capability parameter
    }
  }
  Copy

  Empty Path Required if Host Capability

  Notification capabilities of the host application require an empty path. In the route, use canMatchWorkbenchNotificationCapability guard to match the notification capability.

  Example: - Route matching a notification capability with qualifier {notification: 'info'}

  import {Routes} from '@angular/router';
  import {canMatchWorkbenchNotificationCapability} from '@scion/workbench';
  
  const routes: Routes = [
    {path: '', canMatch: [canMatchWorkbenchNotificationCapability({notification: 'info'})], component: InfoComponent},
  ];
  Copy

• OptionalshowSplash?: boolean

  Instructs the workbench to show a splash, such as a skeleton or loading indicator, until the notification microfrontend signals readiness.

  By default, the workbench shows a loading indicator. A custom splash can be configured in the workbench host application.

  This property is not supported if a host microfrontend.

  See

  WorkbenchNotification.signalReady

• Optionalsize?: WorkbenchNotificationSize

  Specifies the size of the notification, required for notifications provided by applications other than the workbench host application.

  For the notification to adapt to the size of the microfrontend content, set the size to auto and report the microfrontend's preferred size using PreferredSizeService in the microfrontend.

  Example: - Reporting the preferred size in the microfrontend

  import {Beans} from '@scion/toolkit/bean-manager';
  import {PreferredSizeService} from '@scion/microfrontend-platform';
  
  Beans.get(PreferredSizeService).fromDimension(<Microfrontend HTMLElement>);
  
  Copy