UI Activation - Atoti Hub

Atoti Market Risk extends the Atoti UI host application via the mr-sdk, activated by importing and calling the activate function in the Atoti UI starter.

Activating Atoti Market Risk

Download and set up the latest version of the Atoti UI starter application. See the Atoti UI tutorial here.
To activate Atoti Market Risk, make the following changes: In package.json:

"dependencies": {
+   "@activeviam/mr-sdk": 6.0.7,
+   "@tanstack/react-query": ^5.8.1,
 ...
  }

In index.tsx:

+ import { activate } from "@activeviam/mr-sdk";

const extension: ExtensionModule = {
  activate: async (configuration) => {
    ...
+    activate({configuration});
  }
}

In env.development.js and env.production.js, ensure the following exist:

A server used as the Content Server
An Atoti Market Risk server with the key “MR”

These elements could refer to the same server. For example:

window.env = {
  contentServerVersion: "6.0.4",
  contentServerUrl: "http://localhost:10010/mr-application",
  activePivotServers: {
    MR: {
      url: "http://localhost:10010/mr-application",
      version: "6.0.4",
    },
  },
};

Build and run the starter, now with the Atoti Market Risk features enabled.

Configuring Atoti Market Risk

The example above activates Atoti Market Risk with a default configuration and default settings. Here’s how to modify them.

Change the configuration

The configuration parameter is the entry-point to configuring the Atoti UI “host application”. It is supplied to the activate function that modifies it to add the Atoti Market Risk features. If you want to make changes like adding or removing a plugin, changing the application’s title or adding an HOC, you can modify the configuration object after invoking activate. For example:

const extension: ExtensionModule = {
  activate: async (configuration) => {
    // default application name
    configuration.applicationName = "AtotiUI";
     ...
    // changes the application name to Atoti Market Risk
    activate({configuration});
    // Customized application name
    configuration.applicationName = "My Atoti Market Risk";
  },
};

Change the settings

The activate function accepts a settings and a basSettings argument to let you configure the Atoti Market Risk features and the BAS features respectively. You can use the default values exported from the SDK as an override basis:

import { activate, settings, basSettings } from "@activeviam/mr-sdk";

const extension: ExtensionModule = {
  activate: async (configuration) => {
    ...
    activate({
      configuration
      settings: {
        ...settings,
        ...{
          // customize here
        }
      },
      basSettings: {
        ...basSettings,
        ...{
          // customize here
        }
      }
    });
  },
};

For more information:

Atoti Market Risk settings, see UI settings.
BAS settings, see UI Components.

Combining Atoti Market Risk with other solutions or modules

To combine multiple solutions and modules, simply repeat the steps in the combined SDK’s “Activating” section.

You can only combine solution SDKs that have an Atoti UI peer dependency equal to 5.1.*.

Example:

import { activate as mrActivate } from "@activeviam/mr-sdk";
import { activate as frtbActivate } from "@activeviam/frtb-sdk";

const extension: ExtensionModule = {
  activate: async (configuration) => {
    ...
    mrActivate({ configuration });
    frtbActivate({ configuration });
  },
};

​Activating Atoti Market Risk

​Configuring Atoti Market Risk

​Change the configuration

​Change the settings

​Combining Atoti Market Risk with other solutions or modules

Activating Atoti Market Risk

Configuring Atoti Market Risk

Change the configuration

Change the settings

Combining Atoti Market Risk with other solutions or modules