CSA Plugin Overview
This page provides details and information on the CSA plugin.
What is the CSA Plugin?
The CSA plugin is a user agent that allows customer service agents (middle office users) to access both customer and account details. Existing accounts can be serviced and new accounts can be created using very simple flows, all accessible through a simple and intuitive user interface.
Technical Design Ethos
The CSA plugin follows this design ethos:
- Web components are defined to render each "card" visible to the user
- Web components are defined on a more granular level where necessary or when reusability is possible
- Data only enters web components via attributes (properties)
- Data is only received from web components via events (
event.detailpayload objects) - CSA web components do not currently have public methods (this may change in the future).
- CSA employs “vanilla-router” as a mechanism for navigating between pages/cards/popups, the basic page skeleton is not normally re-rendered
- Web components themselves only handle the rendering of the page and simple validation. Accordingly, most have a corresponding "router" helper JavaScript library that manages transitions from vanilla-router, monitors for component events and initiates API calls and defines callback routines.
It is planned to create a base class for CSA web components that will implement common functionality and ensure consistency
Source Code
Main Folder
The CSA plugin souce code is located in the following folder within the Temenos Explorer repository:
/TemenosExplorer/public/plugins/CSA
Sub-Folders
The CSA plugin contains various sub-folders:
| Sub-Folder | Description |
|---|---|
| ./BaseJs/ | Local copy of Javascript libraries (including UUX) for standalone use only |
| ./config/ | Configuration required by the Temenos Explorer framework |
| ./css/ | Styling |
| ./dist/ | Bundled JavaScript (output of webpack build) |
| ./images/ | Images |
| ./js/ | JavaScript before bundling |
| ./src/ | Main source code |
Key Pages
There are some key pages within the CSA plugin whose source code is located in ./src/ in named sub-folders. These pages are accessed by the specified route.
| Sub-Folder | Route | Description |
|---|---|---|
| ./customer-search-criteria/ | criteria | The page where the user enters the customer search criteria |
| ./customer-search-results/ | results | The page which shows the customer search results |
| ./customer-overview/ | customer | The page which shows the customer overview |
| ./account-details/ | account | The page which shows the account details |
There are other pages which follow a similar naming convention and should be simple to locate.
Configuration
The CSA plugin has a single configuration file which is used in addition to the default Temenos Explorer configuration files:
/TemenosExplorer/public/plugins/CSA/CSA_config.js
This configuration file specifies the location of APIs among many other settings. The values will need to be configured on-site after delivery.
NB: for WAR deployments, see/consider ConfigServlet as a possible alternative to the direct use of the CSA_config.ts file mentioned above)
| Property | Type | Description |
|---|---|---|
| logging | Boolean | Controls whether debug logging occurs |
| MOCK* | Boolean | Controls whether mock data for the specified application is used |
| OVERVIEWSCREENINFINITYTABS | Boolean | Controls whether customer overview shows tabs relating to Infinity Spotlight |
| AUTH* | String | Authorization API keys for microservices |
| CODE* | String | Querystring code= API keys for microservices |
| SESSIONTIMEOUT* | String | Session timeout period, no longer used when CSA is run inside Temenos Explorer |
| MAXRECORDS | String | Maximum number of records requested from the Party microservice when searching for a customer |
| KEYCLOAK* | String | Keycloak server information, no longer used when CSA is run inside Temenos Explorer |
| TRANSACTSYSTEM | String | Indicates if connecting to Transact (no functionality is currently conditioned on this flag) |
| TRANSACTURL | String | Root URL of Transact JBoss |
| APIPREFIX* | String | Prefix of APIs used throughout CSA |
| APISUFFIX* | String | Suffix of APIs used throughout CSA |
| URL* | String | UXP Browser URLs, no longer used |
| INFINITYASSISTROOTURL | String | Root of Infinity Assist, no longer used |
| DOCUMENTROOTURL | String | Root URL of Document Management System (see View Documents functionality) |
| SRMSROOTURL | String | Root URL of SRMS (currently uses SRMS mock server) |
| FONT | String | Default font |
| DIRECTION | String | Default text direction, now controlled by the Temenos Explorer framework |
| LANGUAGE | String | Default language, now controlled by the Temenos Explorer framework |
| ENHANCEDACCESSIBILITY | String | Not used |
Multiple Customers
The CSA plugin permits the user to open five customers at the same time and easily switch between them. Consequently, CSA has to make sure that the correct data is displayed for the current customer.
A JSON object handles this data and is stored in the browser session storage under the key tabData. API response data for each card/page is held as a sub-object so that it can always be recalled when necessary.
In addition, a "Find Customer" tab is always available and its data is stored in a JSON object which is also stored in the browser session storage under the key searchData.
In addition to the tabData and searchData objects being stored in session storage they are also stored as normal JavaScript variables. This enables CSA to restore the state of these variables when the user presses F5 or they select a new role or language that necessitates a reload of the CSA plugin.
For more information on session storage, please see the state management reference.