Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Issue with Applying Custom Translations in react-filerobot-image-editor #523

Open
WarisWorks opened this issue Feb 3, 2025 · 0 comments
Labels

Comments

@WarisWorks
Copy link

Is your feature request related to a problem?
I’m currently using react-filerobot-image-editor in my project and encountering an issue with applying custom translations for the Uyghur language. Despite passing the translations object via the translations prop, the UI remains in English.

This is frustrating because I need to localize the UI for Uyghur-speaking users, and I’ve verified that the translation keys match the expected structure. I’ve tried various approaches without success.

I’d like the react-filerobot-image-editor to fully support custom translations via the translations prop. The expected behavior is that when a valid translations object is passed, the UI should reflect the provided translations instead of the default English text.

Describe alternatives you’ve considered
1. Passing translations directly as props:
I tried passing the translations directly to the FilerobotImageEditor component.

<FilerobotImageEditor
source={imageUrl}
translations={UYGHUR_TRANSLATIONS}
onSave={(editedImageObject) => onSave(editedImageObject.imageBase64)}
onClose={onClose}
defaultTabId={TABS.ADJUST}
defaultToolId={TOOLS.CROP}
/>

2.	Applying translations through a configuration object:

I also tried adding the translations in a config object, but the issue persists.
3. Cache Clearing & Version Updates:
Cleared cache, reinstalled packages, and updated to the latest version of react-filerobot-image-editor, but no changes were observed.

Additional context

Here’s an example of my translations file:

export const UYGHUR_TRANSLATIONS = {
toolbar: {
FINETUNE: 'تەڭشەك',
FILTERS: 'سۈزگۈچلەر',
ADJUST: 'تەڭشەش',
WATERMARK: 'بەلگە',
ANNOTATE: 'ئىزاھلاش',
RESIZE: 'چوڭايتىش',
},
tools: {
CROP: 'كىسىش',
ROTATE: 'ئايلاندۇرۇش',
FLIP_X: 'X بويىچە ئايلاندۇرۇش',
FLIP_Y: 'Y بويىچە ئايلاندۇرۇش',
BRIGHTNESS: 'يورۇقلۇق',
CONTRAST: 'قارا-ئاق',
HSV: 'رەڭ تەڭشەش',
WARMTH: 'ئىسسىقلىق',
BLUR: 'تۈگۈشتۈرۈش',
THRESHOLD: 'ئۆلچەم',
POSTERIZE: 'پوستېرلاشتۇرۇش',
PIXELATE: 'پېكسېلاشتۇرۇش',
NOISE: 'شۇغلانما',
},
};

Environment:
• react-filerobot-image-editor version: [Insert version here]
• React version: [Insert version here]
• Browser: [Insert browser info, e.g., Chrome 120]
• OS: [Insert OS, e.g., macOS Ventura]
Thank you in advance for your support! 🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant