Configure Wallet Web UI

Overview

The configurations detailed below allow an FPX Wallet administrator to configure not only the look and feel, but also several functional aspects of the Wallet UI.

The following tables contain details of each parameter along with the accepted values. Where applicable, sample images have been provided to demonstrate the impact of the settings within the Wallet Web UI. The tables are followed by a code block that represents a sample instance of the walletui.config parameter under the Wallet deployment YAML file.

General Config Section

Parameter	Description	Accepted Values (Default)
url	Wallet Server URL.	{{WALLET_SERVER_URI}}
analytics_config.alias	Analytics service account alias name.	Alpha-numeric string (azureai)
analytics_config.instrumentationKey	Analytics service account instrumentation key.	Alpha-numeric string ()
client_id	Unique client ID required for device authorization when the Wallet Server makes the /device/token call to the Wallet UI. This must match the Authorization Server's OAuth Client ID specified during the Wallet OAuth Client creation step.	Alpha-numeric string (wallet-identos-clientid)
authorization_code_inputs	Number of code input fields for the Confirm Authorization page. Note:This value is currently hardcoded at 6 at the Wallet Server level and should not be changed in this parameter. Future versions of the Wallet will allow greater levels of customization.	Any positive integer (Restricted to the default of 6 currently.)
connectionsPagination	Defines the number of connection items to show for pagination on the Connection page. Sample Image - value set to 5	Any positive integer (15)
connectionsDetailsPagination	Defines the limit of account resources items to show for pagination on the Connection Details page.	Any positive integer (15)
whitelabel	Path for the client CSS file. The whitelabel.css file allows any default CSS elements that are preconfigured with a new deployment of FPX Wallet Web UI to be easily overridden. For the whitelabel.css styles to take precendence over others, it is mandatory to add the "!important" suffix to each style. The whitelabel.css file configured like any other standard CSS file.	File path/URL (/config-styles/whitelabel.css)
theme	Theme (primary colour) for the Sign-in page.	Alpha-numeric string (com.identos.nav.niagara)
favicon	Icon file (*.ico) that will be associated with the deployed Wallet instance.	Favicon filename with extension (favicon.ico)
logout_url	URL to logout a user.	Alpha-numeric string ()

Profile Config Section

Parameter	Description	Suggested Value (Default)
profile_configs.name	Show/Hide the signed-in user name in the profile card on the Profile page. Sample Image	true/false (true)
profile_configs.description	Show/Hide the description below the profile card on the Profile page. Sample Image	true/false (true)
profile_configs.gradient_color_1	Gradient color 1 for the profile card background on the Profile page.	Hex value for colour (#666666)
profile_configs.gradient_color_2	Gradient color 2 for the profile card background on the Profile page.	Hex value for colour (#666666)
profile_configs.notifications	Show/Hide notifications on the Profile page. Sample Image	true/false (false)
profile_configs.numberOfNotificationToShow	Defines the number of notification items to show for pagination on the Profile page.	Any positive integer (2)
profile_configs.verifiableCredentialOfferInterval	Defines the frequency at which the Wallet UI will poll the Wallet Server in relation to the Verifiable Credentials feature. See the Verifiable Credentials section for more information.	5000
profile_configs.verifiableCredentialProofRequestInterval	Defines the frequency at which the Wallet UI will poll the Wallet Server in relation to the Verifiable Credentials feature. See the Verifiable Credentials section for more information.	13000

Parameter	Description	Suggested Value (Default)
consent_configs.enable_source_toggle	Show/Hide the toggle button for disabling a source on the Consent page. Sample image	true/false (true)
consent_configs.enable_scope_toggle	Show/Hide the toggle button for disabling scope on the Consent page. Sample image	true/false (true)
consent_configs.succes_redirect_timeout	The number of milliseconds to wait before closing the Success modal after successfully submitting the permissions on the Consent page.	Timeout value in milliseconds (5000)
consent_configs.enable_change_button	Show/hide the 'Change' button on Consent page. The 'Change' button gives user the ability to switch the information source. Sample Image	true/false (true)
my_activity_configs.multiple_accounts_enable	Enable/Disable the ability to connect multiple accounts for same data source. Sample image	true/false (true)

Setting_configs Section

Parameter	Description	Suggested Value (Default)
setting_configs.header	Title of each section.	Alpha-numeric string ()
setting_configs.items.image_url	Path to the icon image for each item.	URL/Path of the icon image
setting_configs.items.title	Title for the item.	Alpha-numeric string ()
setting_configs.items.type	Identifier for each item. This is for internal code reference and will not display on-screen. - Sample image - 'current_account' and 'managed_account' - Sample image - Delete Account - Sample image - Logout - Sample image - Other string, e.g. Support	Out-of-the-box values with existing Wallet UI functionality are 'current_account', 'managed_accounts', 'delete_account' and 'logout'. The parameter also supports any other string that can be configured to perform other functions, for example, link to external reference sites. (managed_accounts)
setting_configs.items.subtitle	Description for the item. Sample image	Alpha-numeric string ()
setting_configs.items.has_arrow	Show/Hide visual arrow icon for for links. Sample image	true/false (true)
setting_configs.items.link.url	URL for the item if the item is supposed to be a hyperlink.	Valid hyperlink
setting_configs.items.link.is_external	If set to 'true', the user is informed and redirected outside the Wallet.	true/false (true)
setting_configs.items.reasons	Allows you to specify up to four reasons for deleting a Wallet account. Applicable ONLY when the `setting_configs.items.type` is set to 'delete_account'. Sample image	Any string value

Localization configuration for the Wallet Web UI is detailed in the Language Configuration section.

{
    "url": "{{WALLET_SERVER_URI}}",
    "analytics_config": { 
        "alias": "azureai",
        "instrumentationKey": "3279cb7-b053-4f83-b308-6eb380ee2620"
    },
    "client_id": "wallet-identos-clientid",
    "authorization_code_inputs": 6,
    "connectionsPagination": 15,
    "connectionsDetailsPagination": 15,
    "whitelabel": "/config-styles/whitelabel.iaa.css",
    "theme": "com.identos.nav.niagara",
    "favicon": "/assets/favicon.ico",
    "logout_url": "{{IDP_LOGOUT_URL}}",
    "profile_configs": {
        "name": true,
        "description": true,
        "gradient_color_1": "#669ecc",
        "gradient_color_2": "#334f66",
        "notifications": false,
        "numberOfNotificationToShow": 2,
        "verifiableCredentialOfferInterval": 5000,
        "verifiableCredentialProofRequestInterval": 13000
    },
    "consent_configs": {
        "enable_source_toggle": true,
        "enable_scope_toggle": true,
        "success_redirect_timeout": 5000,
        "enable_change_button": true
    },
    "my_activity_configs": {
        "multiple_accounts_enable": true
    },
    "setting_configs": [{
        "header": "settings__account_title",
        "items": [
        {   
            "image_url": "",
            "type": "current_account",
            "subtitle": "settings__current_account_subtitle",
            "has_arrow": false
        },
        {   
            "image_url": "",
            "title": "settings__managed_account_title",
            "type": "managed_accounts",
            "subtitle": "settings__managed_account_subtitle",
            "has_arrow": true
        }
        ]
    },
    {
        "header": "settings__more_title",
        "items": [
        {
            "type": "logout",
            "image_url": "",
            "title": "logout__logout"
        },
        {
            "type": "delete_account",
            "image_url": "",
            "title": "settings__delete_account_title"
            "reasons": [
                "settings__delete_account_modal_select_option_1_label",
                "settings__delete_account_modal_select_option_2_label",
                "settings__delete_account_modal_select_option_3_label",
                "settings__delete_account_modal_select_option_4_label",
            ]
        }, 
        {
            "type": "support",
            "link": {
                "url": "https://google.com", 
                "is_external": true
            },
            "title": "settings__support_title",
            "has_arrow": false
        }]
    }]
}

Overview​

General Config Section​

Profile Config Section​

Consent and My Activity Config Section​

Setting_configs Section​

Overview

General Config Section

Profile Config Section

Consent and My Activity Config Section

Setting_configs Section