i18n added and used in drawer component #11
Conversation
|
Thank you Nice Work! Check if the component is focusable and navigable by using the remote (or the keyboard in case of web. As it's a TV app it's important to provide a component usable from the distance and with a TV friendly design. Check https://developer.android.com/design/ui/tv/samples/jet-stream for some inspiration. |
app/_layout.tsx
Outdated
| @@ -6,6 +6,8 @@ import { useCallback, useEffect } from 'react'; | |||
|
|
|||
| import { MenuProvider } from '../components/MenuContext'; | |||
| import { GoBackConfiguration } from './remote-control/GoBackConfiguration'; | |||
| import { I18nextProvider } from 'react-i18next'; | |||
| import i18n from '@/components/i18n'; // Initialize i18n | |||
There was a problem hiding this comment.
nitpick: please remove the comment
components/i18n/index.tsx
Outdated
| import { initReactI18next } from 'react-i18next'; | ||
| import LanguageDetector from 'i18next-browser-languagedetector'; | ||
|
|
||
| // Import translation files |
components/i18n/index.tsx
Outdated
| translation: fr, | ||
| }, | ||
| }, | ||
| lng: 'en', // Default language |
There was a problem hiding this comment.
nitpick: same as above. Please remove comments
| @@ -7,6 +7,7 @@ import { SpatialNavigationFocusableView, SpatialNavigationRoot, SpatialNavigatio | |||
| import { Direction } from '@bam.tech/lrud'; | |||
| import { scaledPixels } from '@/hooks/useScale'; | |||
| import { LinearGradient } from 'expo-linear-gradient'; | |||
| import { useTranslation } from 'react-i18next'; | |||
There was a problem hiding this comment.
Please commit the package.json for the i18 npm package.
|
@Neha I have updated the PR as per your comment. |
Thank you @madhushree007 . Can you share where the language selector will be placed? and how the UI will look. |
|
@Neha It is already placed above the Menu. Please have a look at the screenshot. |
|
What about putting the language choices in a Setting Screen? I think it's the right place for all the configurations. |
|
@giolaq Do we have a Setting Screen? Or shall I create one? Perhaps we could have something similar to this |
|
I've created this to implement the Setting Screen |
Feature: i18n Internationalisation
This PR implements i18n. A dropdown/picker has been added to select the language. The text on the screen changes as per selected laguage.
By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.