Arrangements

Constant data based on the information defined in the i18n configuration of the Visualizer application supports RTL layout and displays the data in a right-to-left layout and Arabic. The following data are configured in the i18n file: Static data, Master data, Client side error messages, Fabric side error messages, and Back-end error messages.

• Static data

  Static data includes the data used to populate different labels and buttons or displayed as constant information to the user. This data is displayed as configured in the i18n file and does not depend on any other configurations. The application displays the data in a right-to-left layout and in Arabic.

  • Welcome messages (for example - Good morning user)
  • User prompts (for example - Please enter username and password)
  • Informative text (for example - Incorrect username or password)
  • Acknowledgment messages (for example - User has successfully enrolled)
• Master data

  Master data includes the information used to set options in menu lists or drop-downs. The master data is in the DBX DB, and the corresponding configuration is maintained in the i18n file. The application displays the data in a right-to-left layout and in Arabic. The master data includes, but is not limited to,

  • Accounts module - Account type (for example - Savings, Checking)
  • Transfers module - Recipient list (for example - name and contact details for different recipients)
  • Generic (common across modules) - Country names (for example - India, China)
• Client side error messages

  Client side error messages: The application displays the error messages bound with the client-side in a right-to-left layout and Arabic. Examples of client-side error messages:

  • Dashboard module
    • Cannot read property null of undefined.
    • Container is not defined.
  • Payments module
    • Presentation controller is not defined.
    • Payment amount cannot be greater than the total outstanding amount.
• Middleware (Fabric side) error message

  The application displays the equivalent client-side mapped messages of every Fabric layer error message to the user in a right-to-left layout and in Arabic. All exceptions or error messages displayed as-is from the middleware and do not have corresponding client-side mappings will not be translated into Arabic. Examples of middleware error messages:

  • Dashboard module
    • Invalid Token: Token expired
    • Session has been timed out.
  • Payments module
    • "dbpErrCode": 12403
    • "dbpErrMsg": "SECURITY EXCEPTION - UNAUTHORIZED ACCESS"
• Back-end error messages

  The application displays the equivalent client-side mapped messages of every backend-related error message to the user in a right-to-left layout and Arabic. All exceptions or error messages displayed as-is from the backend/Microservices and do not have corresponding client-side mappings will not be translated into Arabic. Examples of backend error messages:

  • Dashboard module
    • errCode 12504: Transaction is denied due to max transaction limit
    • Incorrect username or password.
  • Payments module
    • "dbpErrCode": "15001"
    • "dbpErrMsg": "Backend Integration Failed"

Dynamic data includes data directly retrieved from Microservice or Transact and has no corresponding mapping in the i18n file. The information is subject to change based on specific configurations. Any data entered by the user on the screen also count as dynamic data. The dynamic content includes, but is not limited to,

• Terms and conditions
• Alerts and notifications
• Campaign and marketing data
• The application displays the dynamic data keyed in by the user in the app as-is. For example, the application displays the information entered in English as in English itself and does not apply any format or language changes to the keyed-in data.

Enable RTL Support for a New Project

1. Configure Internationalization (i18n) in the Quantum Visualizer app project to enable the RTL support in the application. Follow the steps mentioned in Internationalization and Supporting RTL Languages documentation for details on i18n settings, configuring locales, and completing other configurations to enable RTL support in Quantum Visualizer.
2. After configuring the locale, go to Project Explorer and select Responsive web/ Desktop> frmLogin.
3. On the Properties panel, go to the Action tab.
4. Under General, beside init, click Edit. The Action Editor window appears.
5. On the left pane, navigate to Function > Add snippet.
6. Add the following code and click Save.
   kony.application.setApplicationBehaviors({"rtlMirroringInWidgetPropertySetter": true});
   
7. On the main menu, click Build > Build and Publish Web.
8. Modify the language in Web browser settings to Arabic. The RTL alignment is enabled in the application.