GSoC 2025: Translation Builder for OpenMRS Form Builder
Project Title: Translation Builder for OpenMRS Form Builder
Contributor: Bharath Kumar Shetty
Mentors: Nethmi Rodrigo and Anjula Samarasinghe
Project Link: Wiki Page
Repository: openmrs/openmrs-esm-form-builder
Overview
The OpenMRS Form Builder is a tool that helps create forms for healthcare data collection. However, it lacked a way to manage translations for multilingual support.
My project introduced a Translation Builder - a new feature inside Form Builder — that allows users to:
View and manage translations for form elements.
Fetch saved translations from the backend and merge them with the form schema.
Upload translation files back to the backend.
Edit translations directly within the Form Builder UI.
Download translation files for external use.
Ensure reliability with unit tests and comprehensive end-to-end tests .
This makes it much easier for implementers to build forms in multiple languages.
Objectives
Build a full-fledged Translation Builder component inside Form Builder.
Integrate with backend to fetch, merge, and upload translations.
Add download/upload support for translation files.
Ensure robust state management for translations.
Provide end-to-end test coverage to guarantee reliability.
Contributed Repository
OpenMRS Form Builder microfrontend
Pull Requests
main
← Bharath-K-Shetty:feat/O3-4752
opened 03:17PM - 12 Jun 25 UTC
## Requirements
- [ ] This PR has a title that briefly describes the work don… e including the ticket number. If there is a ticket, make sure your PR title includes a [conventional commit](https://o3-docs.openmrs.org/docs/frontend-modules/contributing.en-US#contributing-guidelines) label. See existing PR titles for inspiration.
- [ ] My work conforms to the [OpenMRS 3.0 Styleguide](https://om.rs/styleguide) and [design documentation](https://om.rs/o3ui).
- [ ] My work includes tests or is validated by existing tests.
## Summary
This PR marks the first major contribution to the Interactive Translation Builder for the GSoC 2025 project. It introduces several foundational features aimed at enabling seamless multilingual form editing and previewing. The key functionalities implemented include:
- Extraction of Translatable Strings: Automatically identifies and extracts all translatable fields (e.g., question labels, answer choices) from the form schema.
- Language Selector for Editing: A dropdown to switch between different languages, allowing users to view and edit translations for each language individually.
- Edit Translation Modal: A modal interface for editing specific translation strings in a user-friendly way.
- Primary Language Selector for Preview: Enables users to choose the language in which the form should be previewed.
- Form Preview in Selected Language: Integrates translation updates into the schema, allowing live preview of the form in the selected language without altering the global app language.
## Screenshots
1.**All traslatable strings from the form schema.**

**2.Edit translation string modal**

**3.Language selector to switch between the languages to add/edit translation**

**4.Main Language selector.**

**4.Previewing the form in the selected language from the main language selector..**

https://github.com/user-attachments/assets/9347f83e-d5c5-4547-8548-22c70c5e4e56
## Related Issue
https://openmrs.atlassian.net/browse/O3-4752
## Other
main
← Bharath-K-Shetty:feat/O3-4768
opened 01:11PM - 01 Jul 25 UTC
## Requirements
- [x] This PR has a title that briefly describes the work don… e including the ticket number. If there is a ticket, make sure your PR title includes a [conventional commit](https://o3-docs.openmrs.org/docs/frontend-modules/contributing.en-US#contributing-guidelines) label. See existing PR titles for inspiration.
- [ ] My work conforms to the [OpenMRS 3.0 Styleguide](https://om.rs/styleguide) and [design documentation](https://om.rs/o3ui).
- [ ] My work includes tests or is validated by existing tests.
## Summary
This pr covers:
- A download icon or button appears in the Translation Builder UI next to the language selector.
- When clicked, the translation strings for the selected language are downloaded in a .json file formatted for Initializer.
- File naming should follow:
`
{form_name}_translations_{languageCode}-core_demo.json`
- The JSON should include key-value pairs of translation strings in the selected language.
## Screenshots
https://github.com/user-attachments/assets/c4192503-a3b8-4ceb-a307-7abd6c5655da
## Related Issue
https://openmrs.atlassian.net/browse/O3-4768
## Other
main
← Bharath-K-Shetty:feat/O3-4766
opened 08:25AM - 03 Jul 25 UTC
## Requirements
- [x] This PR has a title that briefly describes the work don… e including the ticket number. If there is a ticket, make sure your PR title includes a [conventional commit](https://o3-docs.openmrs.org/docs/frontend-modules/contributing.en-US#contributing-guidelines) label. See existing PR titles for inspiration.
- [ ] My work conforms to the [OpenMRS 3.0 Styleguide](https://om.rs/styleguide) and [design documentation](https://om.rs/o3ui).
- [ ] My work includes tests or is validated by existing tests.
## Summary
This pr focuses on
- A "Translated" tab that shows only completed translations.
- An "Untranslated" tab that shows strings pending translation.
- Ensure switching tabs filters the list accordingly.
- Added a better Empty state
## Screenshots
https://github.com/user-attachments/assets/972004e3-7985-4cd0-8969-da837dd14315
## Related Issue
https://openmrs.atlassian.net/browse/O3-4766
## Other
main
← Bharath-K-Shetty:feat/O3-4767
opened 01:14PM - 12 Jul 25 UTC
## Requirements
- [x] This PR has a title that briefly describes the work don… e including the ticket number. If there is a ticket, make sure your PR title includes a [conventional commit](https://o3-docs.openmrs.org/docs/frontend-modules/contributing.en-US#contributing-guidelines) label. See existing PR titles for inspiration.
- [ ] My work conforms to the [OpenMRS 3.0 Styleguide](https://om.rs/styleguide) and [design documentation](https://om.rs/o3ui).
- [ ] My work includes tests or is validated by existing tests.
## Summary
This pr includes-
- A search input field is available above the list of strings.
- As the user types, the list dynamically filters to show matching keys or translations.
- Works across both "Translated" and "Untranslated" tabs.
## Screenshots
https://github.com/user-attachments/assets/8aa93c30-4445-4d84-adc9-14a827e18965
## Related Issue
https://openmrs.atlassian.net/browse/O3-4767
## Other
main
← Bharath-K-Shetty:feat/O3-4899
opened 03:29PM - 23 Jul 25 UTC
## Requirements
- [ ] This PR has a title that briefly describes the work don… e including the ticket number. If there is a ticket, make sure your PR title includes a [conventional commit](https://o3-docs.openmrs.org/docs/frontend-modules/contributing.en-US#contributing-guidelines) label. See existing PR titles for inspiration.
- [ ] My work conforms to the [OpenMRS 3.0 Styleguide](https://om.rs/styleguide) and [design documentation](https://om.rs/o3ui).
- [ ] My work includes tests or is validated by existing tests.
## Summary
Overview:
This PR implements the feature to fetch saved translation files from the backend for a selected language and intelligently merge them with the current form schema in the Translation Builder. It ensures that only valid translations (i.e., keys still present in the schema) are retained and used.
This PR covers:
- Fetching translation files from the backend for the selected language.
- Merging backend translations with the current schema using extractTranslationStringsFromSchema.
- Only including translations whose keys are still present in the schema.
- Ignoring outdated keys and using schema strings as fallback for missing translations.
## Screenshots
https://github.com/user-attachments/assets/44a4708a-d3be-4dda-9ed6-986710c9e1c7
## Related Issue
https://openmrs.atlassian.net/browse/O3-4899
## Other
main
← Bharath-K-Shetty:feat/O3-4946
opened 12:58PM - 07 Aug 25 UTC
## Requirements
- [x] This PR has a title that briefly describes the work don… e including the ticket number. If there is a ticket, make sure your PR title includes a [conventional commit](https://o3-docs.openmrs.org/docs/frontend-modules/contributing.en-US#contributing-guidelines) label. See existing PR titles for inspiration.
- [x] My work conforms to the [OpenMRS 3.0 Styleguide](https://om.rs/styleguide) and [design documentation](https://om.rs/o3ui).
- [x] My work includes tests or is validated by existing tests.
## Summary
This PR covers:
- Implemented uploadBackendTranslations utility to upload translations as form resources using OpenMRS REST API.
- Handles:
1. Generating a translation file blob from the form schema.
2. Deleting existing clobdata entries if present.
3. Posting the new translation file to the /clobdata endpoint.
4. Attaching the file as a named form resource using` POST /form/:uuid/resource`.
- Displays success and error snackbars after attempting upload.
- Ensures only valid translations are uploaded (falls back to default strings for English).
- Gracefully handles scenarios where translation is missing for the selected language.
## Screenshots
https://github.com/user-attachments/assets/5d7d37f9-6cff-4c86-8660-7cb01a9bcb95
## Related Issue
https://openmrs.atlassian.net/browse/O3-4946
## Other
main
← Bharath-K-Shetty:fix/O3-4964
opened 04:13PM - 14 Aug 25 UTC
## Requirements
- [ ] This PR has a title that briefly describes the work don… e including the ticket number. If there is a ticket, make sure your PR title includes a [conventional commit](https://o3-docs.openmrs.org/docs/frontend-modules/contributing.en-US#contributing-guidelines) label. See existing PR titles for inspiration.
- [ ] My work conforms to the [OpenMRS 3.0 Styleguide](https://om.rs/styleguide) and [design documentation](https://om.rs/o3ui).
- [ ] My work includes tests or is validated by existing tests.
## Summary
This PR refactors the Translation Builder to improve translation retention and schema sync:
- Add per-language in-memory caching to keep user edits across language switches.
- Introduce mergeTranslations(local, backend, fallback) to deterministically merge values: local > backend > fallback.
- Add a schema-driven incremental sync effect that adds new keys and removes deleted ones without overwriting existing translations.
- Update language switcher to reuse cached translations and to fetch+merge only when needed.
- Ensure translations saved to formSchema.translations reflect merged state.
## Screenshots
## Related Issue
https://openmrs.atlassian.net/browse/O3-4964
## Other
main
← Bharath-K-Shetty:test/O3-4968
opened 01:44AM - 17 Aug 25 UTC
## Requirements
- [x] This PR has a title that briefly describes the work don… e including the ticket number. If there is a ticket, make sure your PR title includes a [conventional commit](https://o3-docs.openmrs.org/docs/frontend-modules/contributing.en-US#contributing-guidelines) label. See existing PR titles for inspiration.
- [ ] My work conforms to the [OpenMRS 3.0 Styleguide](https://om.rs/styleguide) and [design documentation](https://om.rs/o3ui).
- [x] My work includes tests or is validated by existing tests.
## Summary
This PR adds comprehensive end-to-end tests for the TranslationBuilder component to ensure proper functionality and user experience across different workflows.
- Added 8 comprehensive test workflows covering TranslationBuilder functionality
- Added robust selectors and waiting mechanisms for Carbon Design System components
- Scoped selectors to avoid conflicts with duplicate elements (e.g., language dropdowns)
## Test Coverage
1. **Basic Translation Builder Display** - Verifies core UI components are rendered
2. **Language Selection and Switching** - Tests language dropdown functionality
3. **Translation Filtering by Tabs** - Tests All/Translated/Untranslated filtering
4. **Translation Search Functionality** - Tests search input and filtering
5. **Edit Individual Translation** - Tests editing translations through modal
6. **Download Translation File** - Tests download functionality
7. **Upload Translation File** - Tests upload button functionality
8. **Translation State Management** - Tests translation entry interactions
## Screenshots
## Related Issue
https://openmrs.atlassian.net/browse/O3-4968
## Other
main
← Bharath-K-Shetty:test/O3-5000
opened 11:17AM - 29 Aug 25 UTC
## Requirements
- [ ] This PR has a title that briefly describes the work don… e including the ticket number. If there is a ticket, make sure your PR title includes a [conventional commit](https://o3-docs.openmrs.org/docs/frontend-modules/contributing.en-US#contributing-guidelines) label. See existing PR titles for inspiration.
- [ ] My work conforms to the [OpenMRS 3.0 Styleguide](https://om.rs/styleguide) and [design documentation](https://om.rs/o3ui).
- [ ] My work includes tests or is validated by existing tests.
## Summary
This PR adds unit tests to improve reliability and ensure correct behavior of the Translation Builder.
Key Test Coverage:
- Rendering: Verify Translation Builder UI renders with schema (tabs, dropdown, buttons, search).
- Translations Display: Confirm fallback and overridden translations appear correctly.
- Editing: Validate EditTranslationModal opens, updates schema on save, and cancels without changes.
- Filtering & Search: Ensure tabs (All/Translated/Untranslated) and search filtering work.
- Language Switching: Confirm translations update when switching languages, including backend merge.
- Download: Test translation download, with error handling when no translations exist.
- Upload: Mock upload flow with success and failure cases, showing proper snackbar messages.
## Screenshots
## Related Issue
## Other
Demo video
Weekly Blog Posts
Hi! I’m Bharath Kumar Shetty, an engineering student passionate about systems programming, open source, and building impactful tech. I’m…
Reading time: 4 min read
Hey everyone! 🙌
Reading time: 1 min read
Hey everyone!
Reading time: 2 min read
Summary of Work
Over the 12 weeks, I:
Designed and built the Translation Builder UI and workflows .
Connected it to the backend for fetching and uploading translations .
Implemented download/upload functionality for translation files.
Enhanced state management so user edits are preserved during schema updates.
Wrote Comprehensive e2e test workflows covering translation scenarios.
Participated in weekly mentor sync calls and squad calls to refine progress.
Learnings & Takeaways
This project helped me learn:
How to design a new feature from scratch in a large open-source codebase.
Best practices in React state management and schema synchronization.
Writing Playwright e2e tests and designing test workflows.
Following OpenMRS 3.0 design guidelines and coding standards.
Collaborating effectively with mentors and the community.
Acknowledgements
I want to sincerely thank my mentors Nethmi Rodrigo and Anjula Samarasinghe , who were always supportive and guided me through challenges.
Special thanks to the GSoC administrators Jayasanka and Beryl for their continuous encouragement, timely support, and for keeping everything well organized throughout the program.
Thanks to the OpenMRS community and my fellow GSoC contributors for their feedback and encouragement throughout this journey.
This marks the completion of my GSoC 2025 project - Translation Builder. I look forward to continuing my contributions to OpenMRS beyond GSoC.
4 Likes