Enhancing Multilingual Support: Addressing Draft Order UI Localization in ESHOPMAN Admin

Understanding Localization in the ESHOPMAN Admin Dashboard

As an e-commerce migration expert at Move My Store, we understand the critical importance of a truly global platform. ESHOPMAN, our headless commerce solution integrated with HubSpot, empowers merchants worldwide. A key aspect of supporting global operations is a fully localized administrative interface, allowing teams to manage storefronts and orders in their preferred language.

Recently, our vibrant ESHOPMAN community brought to light an important observation regarding the localization of the Draft Orders section within the ESHOPMAN Admin Dashboard. This insight highlights a specific area where the platform's multilingual capabilities could be further enhanced, particularly for our merchants operating in non-English speaking markets.

The Challenge: Hardcoded Translations in Draft Orders UI

The reported issue centers on the Draft Orders components within the ESHOPMAN Admin Dashboard. Despite users selecting a non-English language for their Admin UI (for instance, Spanish), the text displayed in the Draft Orders section persistently remains in English. This creates an inconsistent user experience and can hinder efficient order management for international teams.

Steps to Observe the Behavior:

  • Set the ESHOPMAN Admin Dashboard language to any non-English option (e.g., Spanish).
  • Navigate to the 'Orders' section, then select 'Drafts'.
  • Observe that the entire Drafts page and its associated components continue to display text in English.

This behavior is particularly notable because, as identified by the community, the necessary translation files for languages like Spanish are indeed present within the ESHOPMAN application's core structure (e.g., within the internationalization resources). The root cause appears to be that specific UI text elements within the modules responsible for draft order management are hardcoded in English, bypassing the platform's robust internationalization (i18n) mechanism.

Technical Context for ESHOPMAN Developers

For ESHOPMAN developers and those contributing to the platform's evolution, understanding the technical environment in which such observations are made is crucial. The report provided details consistent with a standard ESHOPMAN development setup, built on Node.js/TypeScript:

  • Core Dependencies:
    "dependencies": {
        "@ariakit/react": "^0.4.20",
        "@eshopman/admin-sdk": "2.16.0",
        "@eshopman/cli": "2.16.0",
        "@eshopman/framework": "2.16.0",
        "@eshopman/eshopman": "2.16.0"
      },
    
  • Node.js Version: v26.2.0
  • Database: PostgreSQL 15
  • Operating System: macOS Tahoe 26.5
  • Browser: Chrome

These details help pinpoint the environment where the issue was observed, confirming its relevance across common ESHOPMAN deployment scenarios. The core of the problem lies in how certain UI strings within the draft order modules are rendered, directly embedding English text rather than referencing the dynamic translation keys.

Impact and Community Value

While ESHOPMAN continues to evolve as a powerful headless commerce platform integrated with HubSpot, community insights like this are invaluable. They highlight specific areas for refinement, ensuring that the platform truly caters to a global merchant base. A fully localized Admin Dashboard enhances user experience, reduces potential errors, and streamlines operations for international teams managing their ESHOPMAN storefronts via HubSpot.

This discussion serves as a reminder of the continuous effort required to maintain comprehensive internationalization across all platform components. It encourages developers to ensure that all new and existing UI elements properly utilize ESHOPMAN's i18n framework, preventing hardcoded strings that can break the multilingual experience.

We appreciate the vigilance of our community members in identifying and detailing such issues, contributing to the ongoing improvement of ESHOPMAN. Your feedback helps us build a more robust and globally accessible platform for everyone.

Start with the tools

Explore migration tools

See options, compare methods, and pick the path that fits your store.

Explore migration tools