Skip to main content

Chat localization

This guide explains how to customize the text of UI elements in DIAL Chat using the next-i18next internationalization framework. You should be familiar with deploying DIAL Chat and editing its configuration files.

Note

DIAL Chat currently supports only the en locale folder for text overrides. Full multi-language support is on the roadmap.

Prerequisites​

  • A deployed DIAL Chat instance
  • Access to the DIAL Chat filesystem or deployment configuration

Step 1: Create the locales directory​

DIAL Chat looks for translation overrides in the locales/ directory inside its public assets folder. In the DIAL Chat repository, this is located at apps/chat/public/locales/. If you deploy Chat via Docker, mount your custom locales/ directory to the same path inside the container.

Create a sub-folder for the target language (currently only en):

apps/chat/public/locales/
└── en/
├── chat.json
├── common.json
├── markdown.json
├── promptbar.json
├── settings.json
├── sidebar.json
├── files.json
└── header.json

Each JSON file corresponds to a UI area:

FileUI area
chat.jsonChat conversation area
common.jsonShared labels and buttons
markdown.jsonMarkdown-related UI text
promptbar.jsonPrompt list panel
settings.jsonSettings dialog
sidebar.jsonConversation list panel
files.jsonFile management UI
header.jsonHeader bar

Step 2: Provide translations​

In each JSON file, add key-value pairs where the key is the original English text and the value is the replacement text. Only the pairs you provide are overridden—unlisted strings keep their defaults.

For example, to translate "New conversation" in the sidebar to French, add to apps/chat/public/locales/en/sidebar.json:

{
"New conversation": "Nouvelle conversation"
}

Before:

Default sidebar text

After:

Translated sidebar text

Step 3: Apply changes​

Add the updated locales directory to your DIAL Chat deployment. You do not need to rebuild the application—the changes take effect on the next page load.

Further reading​