Firebase RealTime Database Translation

props:

• children,
• defaultApp
• defaultLanguage = 'en'
• onWrite
• onRead
• storage = window?.localStorage
• languages = [{ name: 'English', shortCode: 'en' }]
• initialState = {}
• useHashes = false
• saveNewAutomatically = false
• isLive = false

Example:

const TranslationProvider = (props) => {
  const { children, currentApp = DEFAULT_APP } = props

  // [HELPER_FUNCTIONS]
  const onWrite = useCallback(
    ({ ref, value }) => database().ref(ref).update(value),
    []
  )
  const onRead = useCallback(
    ({ ref: path, setTranslations, options }) =>
      database()
        .ref(path)
        .on(
          'value',
          (snapshot) => setTranslations(snapshot?.val() || {}),
          options
        ),
    []
  )

  return (
    <Provider
      storage={AsyncStorage}
      db={database()}
      onWrite={onWrite}
      useHashes
      onRead={onRead}
      saveNewAutomatically
      languages={LANGUAGES}
      defaultLanguage={DEFAULT_LANGUAGE}
      currentApp={currentApp}>
      <TranslationContext.Consumer>
        {({ loaded }) =>
          loaded ? children : <ScreenLoading text="Translation is loading" />
        }
      </TranslationContext.Consumer>
    </Provider>
  )
}

Context value:

• setCurrentLanguage

• language

• translations

• saveTranslationForLanguage = ({ textLabel, shortCode, refEnding, appName }) => Promise

• loading

• loaded

• languages

• translationsRDBRef: translations/${currentApp}/${language}

• t