@life-hack-tools/switch-lang

Shared React Native language switcher and i18next setup helpers for Life Hack Tools apps.

Install

npm install @life-hack-tools/switch-lang

This package expects the app to provide the runtime peer dependencies:

• @react-native-async-storage/async-storage
• expo-haptics
• expo-localization
• i18next
• react
• react-i18next
• react-native
• react-native-reanimated

Usage

Initialize i18n once from the app entrypoint:

import { setupI18n } from '@life-hack-tools/switch-lang';
import en from './locales/en.json';
import ja from './locales/ja.json';
import vi from './locales/vi.json';

setupI18n({
  supportedLangs: ['ja', 'en', 'vi'],
  resources: {
    ja: { translation: ja },
    en: { translation: en },
    vi: { translation: vi },
  },
  storageKey: '@my_app_language',
  fallbackLng: 'ja',
});

Render the switcher:

import { LanguagePill, setLanguage } from '@life-hack-tools/switch-lang';
import { useTranslation } from 'react-i18next';

const LANGUAGES = [
  { code: 'ja', label: 'JA', flag: '🇯🇵' },
  { code: 'en', label: 'EN', flag: '🇺🇸' },
  { code: 'vi', label: 'VI', flag: '🇻🇳' },
];

export function LanguageSettings() {
  const { i18n } = useTranslation();

  return (
    <LanguagePill
      languages={LANGUAGES}
      current={i18n.language}
      onChange={(code) => setLanguage(code)}
    />
  );
}

API

setupI18n(options)

Creates and configures the shared i18next instance.

setLanguage(lang)

Changes the active language and persists it to AsyncStorage.

LanguagePill

Animated pill-style language selector.

Publish

npm version patch
npm publish --access public