Introduction

Descope's Google Cloud Translation and AWS Translate connectors power automatic localization within one's authentication flow, allowing for the adaptation of language in your product to users' specific country or region. This article will go through setting up the connectors and enabling them in your flows.

Note: When the localization is performed, Descope will take the primary attribute and drop the region specific. An example would be a user in the es-MX locale, Descope will only load es and will translate for the user based on this locale.

Setting up Google Cloud and AWS Translate Connectors using 3rd Party Keys

Before diving into localization, set up your preferred connector—either Google Cloud Translation or AWS Translate.

Navigate to Connector

  • Go to your Descope dashboard
  • Navigate: Dashboard -> Connectors
  • Choose “Google Cloud Translate” or “AWS Translate”

Connector Setup

Fill out the necessary fields to link the chosen service with Descope.

For Google Cloud Translation

Get your Service Account JSON and associated Project ID from Google Cloud by following the instrucitons here.

localization connector initialization

Now, complete the required fields:

  • Connector name: Custom name for your connector. This will come in handy when creating multiple connectors from the same connector template.
  • (Optional) Connector description: Describe what your connector is used for.
  • Project ID: Your Google Cloud project ID.
  • Service Account JSON: Service Account JSON associated with the current project.

Make sure the Cloud Translation API is enabled for your project. For more information, see here.

For AWS Translate

Get your AWS Access Key ID, Secret Access Key, and Region by setting up AWS Translate here.

Now, complete the required fields:

  • Connector name: Custom name for your connector. This will come in handy when creating multiple connectors from the same connector template.
  • (Optional) Connector description: Describe what your connector is used for.
  • Access Key ID: Your AWS access key ID.

Test & Save

  • You can test if either of your connectors' configurations are working properly simply by hitting the Test button and viewing the Test Results panel.
  • Finalize and save by clicking Create.

Activating connectors

Navigate to Localization

  • Navigate to Localization section within the Descope console.
  • Select the applicable flow you want to localize from the dropdown, then click Configure Localization.

Start localization of a flow within Descope (Knowledge base guide).

Configuration

Once you have clicked Configure Localization, you will be prompted to select the connector, source language, and target languages.When you select the dropdown for Connector, choose either the Google Cloud or AWS connector that you previously set up for translations. Additionally, you have the option to specify which Target languages you want to support for your user base, determining the languages your content will be translated into.

Selecting a configured connector for localization of a flow in Descope (Knowledge base guide).
Once you have clicked Done, the localization will automatically be generated for the flow based on the returned translation. Below you can see an example configuration and the generated translation.

An example configuration of localization with a connector within Descope (Knowledge base guide).

An example output of connector based localization of a flow within Descope (Knowledge base guide).

Manually Overriding Connector Translations

When you configure localization with a connector, you can manually override the translation. When you override the translation, you will see the override highlighted like the below example.

An example of manually overriding connector based localization of a flow within Descope (Knowledge base guide).

(Optional) Testing & Customization with Descope Web Component:

If you’d like to test your translation, you can either simply change the language in your browser settings or configure the locale within the Descope component.This is an example of an updated Descope flow component to include locale.
​​ <descope-wc
  project-id="<project-id>"
  flow-id="<flow-id>"
  base-url="<base-url>"
  locale="<locale>"
  debug="true"
></descope-wc>

You can learn more in the Web Component readme.

All supported locales are accessible in your dashboard, specifically within each flow's settings where localization was enabled earlier.

localization connector locales