ded2f2751a
Previously, translations were generated and resolved purely based on the account locale. This caused issues in multi-team, multi-region setups where agents often work in different languages than the account default. For example, an account might be set to English, while an agent prefers Spanish. In this setup: - Translations were always created using the account locale. - Agents could not view content in their preferred language. - This did not scale well for global teams. There was also an issue with locale resolution during rendering, where the system would incorrectly default to the account locale even when a more appropriate locale should have been used. With this update, During rendering, the system first attempts to use the agent’s locale. If a translation for that locale does not exist, it falls back to the account locale. **How to test:** - Set agent locale to a specific language (e.g., zh_CN) and account language to en. - Translate a message. - Verify translated content displays correctly for the agent's selected locale - Do the same for another locale for agent. - With multiple translations on a message (e.g., zh_CN, es, ml), verify the UI shows the one matching agent's locale - Change agent locale and verify the displayed translation updates accordingly
50 lines
1.7 KiB
JavaScript
50 lines
1.7 KiB
JavaScript
import { computed } from 'vue';
|
|
import { useUISettings } from './useUISettings';
|
|
import { useAccount } from './useAccount';
|
|
|
|
/**
|
|
* Select translation based on locale priority.
|
|
* @param {Object} translations - Translations object with locale keys
|
|
* @param {string} agentLocale - Agent's preferred locale
|
|
* @param {string} accountLocale - Account's default locale
|
|
* @returns {string|null} Selected translation or null
|
|
*/
|
|
export function selectTranslation(translations, agentLocale, accountLocale) {
|
|
if (!translations || Object.keys(translations).length === 0) return null;
|
|
|
|
if (agentLocale && translations[agentLocale]) {
|
|
return translations[agentLocale];
|
|
}
|
|
if (accountLocale && translations[accountLocale]) {
|
|
return translations[accountLocale];
|
|
}
|
|
return translations[Object.keys(translations)[0]];
|
|
}
|
|
|
|
/**
|
|
* Composable to extract translation state/content from contentAttributes.
|
|
* @param {Ref|Reactive} contentAttributes - Ref or reactive object containing `translations` property
|
|
* @returns {Object} { hasTranslations, translationContent }
|
|
*/
|
|
export function useTranslations(contentAttributes) {
|
|
const { uiSettings } = useUISettings();
|
|
const { currentAccount } = useAccount();
|
|
|
|
const hasTranslations = computed(() => {
|
|
if (!contentAttributes.value) return false;
|
|
const { translations = {} } = contentAttributes.value;
|
|
return Object.keys(translations || {}).length > 0;
|
|
});
|
|
|
|
const translationContent = computed(() => {
|
|
if (!hasTranslations.value) return null;
|
|
return selectTranslation(
|
|
contentAttributes.value.translations,
|
|
uiSettings.value?.locale,
|
|
currentAccount.value?.locale
|
|
);
|
|
});
|
|
|
|
return { hasTranslations, translationContent };
|
|
}
|