UI Activation
Each UI project is designed as an extension of the Atoti UI “host application”. This section explains how you can easily combine these extensions into a running Atoti CVA Risk Capital application.
Activating Atoti CVA Risk Capital
- Download and set up the latest version of the Atoti UI starter application.
info
See the Atoti UI tutorial on how to set up the UI.
-
To activate Atoti CVA Risk Capital, make the following changes:
In
package.json
:"dependencies": { + "@activeviam/cvarc-sdk": 5.1.1, ... }
In
index.tsx
:+ import { activate } from "@activeviam/cvarc-sdk"; const extension: ExtensionModule = { activate: async (configuration) => { ... + activate({configuration}); } }
In
env.development.js
andenv.production.js
, ensure the following exist:- A server used as the Content Server
- An Atoti CVA Risk Capital server with the key “CVARC”
These elements could refer to the same server. For example:
window.env = { contentServerVersion: "6.0.0", contentServerUrl: "http://localhost:9090/cvarc-starter", activePivotServers: { CVARC: { url: "http://localhost:9090/cvarc-starter", version: "6.0.0", }, }, };
-
Build and run the starter, now with the Atoti CVA Risk Capital features enabled.
Configuring Atoti CVA Risk Capital
The example above activates Atoti CVA Risk Capital 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 CVA Risk Capital 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 CVA Risk Capital
activate({configuration});
// Customized application name
configuration.applicationName = "My Atoti CVA Risk Capital";
},
};
Change the settings
The activate
function accepts a settings
and a basSettings
argument to let you configure the Atoti CVA Risk Capital 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/cvarc-sdk";
const extension: ExtensionModule = {
activate: async (configuration) => {
...
activate({
configuration
settings: {
...settings,
...{
// customize here
}
},
basSettings: {
...basSettings,
...{
// customize here
}
}
});
},
};
For more information on the BAS settings, see UI Components.
Combining Atoti CVA Risk Capital with other solutions or modules
To combine multiple solutions and modules, simply repeat the steps in the combined SDK’s “Activating” section.
warning
You can only combine solution SDKs that have an Atoti UI peer dependency equal to 5.1.*.
Example:
import { activate as cvarcActivate } from "@activeviam/cvarc-sdk";
import { activate as frtbActivate } from "@activeviam/frtb-sdk";
const extension: ExtensionModule = {
activate: async (configuration) => {
...
cvarcActivate({ configuration });
frtbActivate({ configuration });
},
};