Draft: Init setup i18n

[medamineziraoui]

Description: Add traduction feature, and add select language to user profile in both english and french languages.

Type of change New feature ( breaking change with adds functionality )

Platform tests

• [ ] Android
• [ ] Iphone

Checklist:

• [ ] Add select language in user user profile so we can switch languages.

• [ ] Add libs react-i18next i18next

• [ ] Add new file i18n.ts in the src/config folder

• [ ] Add locales folder in the src directory

• [ ] Add index.ts in locales containing

  export * as en from './en';
  export * as fr from './fr';

• [ ] Add both en and fr in the locales folder

• [ ] Add trads for text that will be translated in both fr and en texts

• [ ] Update get account query

  export const useAccount = (config: UseQueryOptions<Account> = {}) => {
  const { i18n } = useTranslation();
  ...
  const { data: account, ...rest } = useQuery(
  ['account'],
  (): Promise<Account> => axios.get('/account'),
  {
    onSuccess: (data) => {
      i18n.changeLanguage(data?.langKey);
      if (config?.onSuccess) {
        config?.onSuccess(data);
      }
    },
    ...
  };

• [ ] Change Update Account query

  export const useUpdateAccount = (
  config: UseMutationOptions<Account, unknown, Account> = {}
  ) => {
  const { i18n } = useTranslation();
  ...
  {
    onMutate: (data) => {
      i18n.changeLanguage(data?.langKey);
      if (config?.onMutate) {
        config.onMutate(data);
      }
    },
    ...config,
  }
  ...

• [ ] Add th configuration

  import i18n from 'i18next';
  import { initReactI18next } from 'react-i18next';
  import * as locales from '../locales';
  import { AVAILABLE_LANGUAGES, DEFAULT_LANGUAGE_KEY } from '../constants/i18n';
  i18n
  .use(initReactI18next)
  .init({
  defaultNS: 'common',
  resources: locales,
  lng: DEFAULT_LANGUAGE_KEY,
  fallbackLng: DEFAULT_LANGUAGE_KEY,
  interpolation: {
    escapeValue: false
  },
  });
  i18n.on('languageChanged', (langKey) => {
  // store langukey in the smartphone local storage
  });
  export default i18n;

• [ ] Update trads (duh)

Files to translate ( en ):

• [ ] general:
  • [ ] yes: yes
  • [ ] no: No
  • [ ] update: Update
  • [ ] error: An error occurred
  • [ ] retry: Retry
  • [ ] loading: Loading...
• [ ] Account
  • [ ] updateError: An error occurred while updating your profile, please retry
  • [ ] updateSuccess: Your profile has been updated
  • [ ] myAccount: My account
  • [ ] emailAdress: Email address
  • [ ] requiredEmail: Email address is required
  • [ ] invalidEmail: Email is invalid
  • [ ] firstName: First Name
  • [ ] firstNamePlaceholder: John
  • [ ] lastName: Last Name
  • [ ] lastNamePlaceholder: Doe
  • [ ] logout: Logout
• [ ] About
  • [ ] title: About this app
  • [ ] appVersion: App version
  • [ ] buildNumber: Build number
  • [ ] environnement: Environnement
  • [ ] mode: Mode
  • [ ] isHermesEngine: Using Hermes JS Engine
• [ ] networkHelper
  • [ ] title: Network helper
  • [ ] ipv6: IPV6 Address:
  • [ ] ipv4: IPV4 Address:
  • [ ] ssid: SSID
  • [ ] apiUrl: Api URL:
  • [ ] backend: Backend connected:
  • [ ] notConnected: Not Connected
  • [ ] connected: Connected
• [ ] home
  • [ ] welcome: Welcome
• [ ] Login
  • [ ] title: Log in
  • [ ] password: Password
  • [ ] passwordRequired: Password is required
  • [ ] forgetPassword: Forgot Password?
  • [ ] login: Log In
  • [ ] needAccount: Need an Account?
  • [ ] register: Register Now!
  • [ ] about: About this app
• [ ] register
  • [ ] title: Register
  • [ ] registerSuccess: Your account has been created successfully. You can now log in
  • [ ] alreadyExist: This email is already used by another account
  • [ ] registerError: An error occurred while trying to create your account, please retry
  • [ ] minLengthPassword: Password should have at least 6 characters
  • [ ] confirmPassword: Confirm Password
  • [ ] confirmPasswordRequired: Password confirmation is required
  • [ ] notMatchPassword: Passwords do not match
  • [ ] register: Register
• [ ] resetPassword
  • [ ] title: Reset Password
  • [ ] emailHelper: Enter the email address you used to register
  • [ ] sendMail: Send Email