#522 Add localization using React Context #561

Merged
c24elipe merged 1 commit from #522-implement-reacts-localization into team_2_week_3 2026-04-27 11:27:35 +00:00
Collaborator

Added language context (useLanguage.js), example language files (en.json/sv.json), and language selector component in settings.

Added language context (useLanguage.js), example language files (en.json/sv.json), and language selector component in settings.
Added language context (useLanguage.js), example language files (en.json/sv.json), and language selector component in settings.
Author
Collaborator

I tried to follow the same style as the useStyle.js. Components can use const { translate } = useLanguage() to display translated text. Language selection is saved in localStorage and is saved between sessions. Translation files are in frontend/src/locales/ just included as an example so you can see how it works.
Screenshot 2026-04-24 151723Screenshot 2026-04-24 151732

I tried to follow the same style as the useStyle.js. Components can use const { translate } = useLanguage() to display translated text. Language selection is saved in localStorage and is saved between sessions. Translation files are in frontend/src/locales/ just included as an example so you can see how it works. ![Screenshot 2026-04-24 151723](/attachments/e44ca32f-018d-4232-a02d-a4478c374200)![Screenshot 2026-04-24 151732](/attachments/eab63273-3e87-490c-99db-c67eba00954c)
Collaborator

Looks good overall.

The LanguageProvider is set up nicely and follows the same pattern as useStyle. Language selection and localStorage work as expected.

In my opinion, this is a solid foundation. Applying translate() across the UI could be handled in a separate PR to keep this one focused.

Clean and well-structured work, ready to merge.

Looks good overall. The LanguageProvider is set up nicely and follows the same pattern as useStyle. Language selection and localStorage work as expected. In my opinion, this is a solid foundation. Applying translate() across the UI could be handled in a separate PR to keep this one focused. Clean and well-structured work, ready to merge.
c24elipe left a comment
Collaborator

Looks alright on a glance

Looks alright on a glance
Collaborator

I do not know if it's my fault or a code fault, but I can't get the dropdown shown

image

I do not know if it's my fault or a code fault, but I can't get the dropdown shown ![image](/attachments/6156c75e-7c83-4184-bba5-0685325e6e88)
Author
Collaborator

Which branch are you on?

Which branch are you on?
Collaborator

It was a random cache on my end that was ghosting and messing it up

It was a random cache on my end that was ghosting and messing it up
Collaborator

Have looked it over and it compiles. Get merged

Have looked it over and it compiles. Get merged
c24elipe merged commit 9bd67d63e9 into team_2_week_3 2026-04-27 11:27:35 +00:00
c24elipe deleted branch #522-implement-reacts-localization 2026-04-27 11:27:37 +00:00
Collaborator

Everything works well on my side.

Everything works well on my side.
Collaborator

Hi @c24carso is this issue finnished? when i try to use the fuction on the newest branch i cant use it. If we need to create a new issue for this just say so, or if we use the existing issue

Hi @c24carso is this issue finnished? when i try to use the fuction on the newest branch i cant use it. If we need to create a new issue for this just say so, or if we use the existing issue
Sign in to join this conversation.
No reviewers
No milestone
No project
No assignees
4 participants
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
Andras/BoundlessFlowCampus2K!561
No description provided.