Hi, how can i translate an error message from the error hadling of an action?

Error Translation with errorTransformer Use the

errorTransformer

function in your client SDK to translate error messages from action error handling.

const errorTransformer = (error) => {
  const language = getClientLanguage(); // Get user's language
  
  const translationMap = {
    en: {
      "Trigger 404 failure": "I'm a pinecone",
      "SAMLStartFailed": "Failed to start SAML flow",
    },
    es: {
      "Trigger 404 failure": "Soy una piña", 
      "SAMLStartFailed": "Error al iniciar flujo SAML",
    },
    de: {
      "Trigger 404 failure": "Ich bin ein Pinienzapfen",
      "SAMLStartFailed": "SAML-Flow konnte nicht gestartet werden",
    }
  };
  const translations = translationMap[language] || translationMap['en'];
  return translations[error.type] || translations[error.text] || error.text;
};

SDK Configuration Pass the errorTransformer to your Descope component:

// React/Vue example
<Descope
  flowId="sign-up-or-in"
  errorTransformer={errorTransformer}
/>

• The errorTransformer receives an error object and returns a translated string • Custom flow errors from actions must be translated using the errorTransformer in the frontend SDK • You can map error types or error text to localized messages based on user language Descope Component Guide | Client SDK | Descope Documentation Customizing Localization | Descope Documentation

i dont use any sdk for the frontend.

Server-Side Error Translation Without a frontend SDK, you'll need to handle error translation on your server or in your flow configuration. Option 1: Custom Error Messages in Flow Builder 1. Select your action in the flow builder 2. Expand the error handling section 3. Set error handling to "Custom" 4. Add a condition that checks the error and routes to different screens with localized messages Option 2: Server-Side Translation

// In your backend API
function translateError(error, userLanguage) {
  const translations = {
    en: {
      "authentication_failed": "Authentication failed",
      "invalid_credentials": "Invalid credentials"
    },
    es: {
      "authentication_failed": "Falló la autenticación", 
      "invalid_credentials": "Credenciales inválidas"
    }
  };
  
  return translations[userLanguage]?.[error.type] || error.message;
}

Option 3: Flow Variables for Localization Use flow variables to store translated error messages and display them on error screens based on user locale. • Custom error handling in flows allows you to route to different screens with localized messages • You can add conditions after actions to handle errors with custom messages Actions Overview | Descope Documentation Customizing Flow Errors | Descope Documentation

its a web component.

Web Component Error Translation Since you're using a web component, you can handle error translation by listening to error events and updating the display.

// Listen for errors from the web component
const descopeWc = document.querySelector('descope-wc');
descopeWc.addEventListener('error', (event) => {
  const error = event.detail;
  const translatedMessage = translateError(error);
  
  // Update your UI with translated message
  displayError(translatedMessage);
});
function translateError(error) {
  const userLanguage = navigator.language.split('-')[0];
  
  const translations = {
    en: {
      "authentication_failed": "Authentication failed",
      "invalid_credentials": "Invalid credentials"
    },
    es: {
      "authentication_failed": "Falló la autenticación",
      "invalid_credentials": "Credenciales inválidas"
    }
  };
  
  return translations[userLanguage]?.[error.type] || error.message;
}

Alternative: Set Locale on Web Component

<descope-wc 
  project-id="your-project-id"
  flow-id="sign-up-or-in"
  locale="es">
</descope-wc>

• Web components emit error events that you can catch and translate client-side • The locale attribute on the web component handles built-in message translation Descope Component Guide | Client SDK | Descope Documentation