Languages and strings

Three locales are bundled: en, pt-BR and es.

Choosing a locale

<OfflineDetector locale="pt-BR">
  <App />
</OfflineDetector>

On the web the locale prop decides, and en is used when it is not given. On native the locale prop wins, and without it the device locale is used. Anything unknown resolves to en. The resolver never throws:

import { resolveLocale } from '@rogeriodocarmo/offline-detector-web'; // or -native

resolveLocale('pt-PT'); // 'pt-BR'
resolveLocale('es-MX'); // 'es'
resolveLocale('fr'); // 'en'

Any pt variant gives pt-BR, any es-* gives es, and anything else gives en.

The strings

Key	en	pt-BR	es
offline	No internet	Sem internet	Sin internet
offlineNoInterface	No network connection	Sem conexão com a rede	Sin conexión de red
offlineNoInternet	Connected, but no internet	Conectado, mas sem internet	Conectado, pero sin internet
online	Back online	Conexão restabelecida	Conexión restablecida
retry	Retry	Tentar novamente	Reintentar
checking	Checking…	Verificando…	Verificando…
continueOffline	Continue offline	Continuar offline	Continuar sin conexión
dismiss	Dismiss	Fechar	Cerrar
dismissHint	Swipe left or right to dismiss	Deslize para a esquerda ou direita para fechar	Desliza a izquierda o a derecha para descartar
indicatorLabelOnline	Online	Online	En línea
indicatorLabelOffline	No internet	Sem internet	Sin internet
indicatorLabelChecking	Checking connection	Verificando conexão	Verificando conexión
indicatorAccessibleName	Connection status: {status}	Status da conexão: {status}	Estado de la conexión: {status}
fullScreenTitle	No internet	Sem internet	Sin internet
fullScreenBody	Check your connection and try again.	Verifique sua conexão e tente novamente.	Revisa tu conexión e inténtalo de nuevo.
fullScreenRetry	Try again	Tentar novamente	Intentar de nuevo

{status} is replaced with the matching indicatorLabel* string.

Overriding strings

Pass a partial object. Each key you give wins over the locale's text; the rest stay.

<OfflineDetector locale="en" strings={{ offline: 'You are offline', retry: 'Try again' }}>
  <App />
</OfflineDetector>

The same merge is available as a function. These helpers, and resolveLocale above, are exported by both @rogeriodocarmo/offline-detector-web and @rogeriodocarmo/offline-detector-native, so one package is enough to import them:

import {
  resolveStrings,
  offlineMessage,
  indicatorName,
} from '@rogeriodocarmo/offline-detector-web'; // or -native

const strings = resolveStrings('pt-BR', { retry: 'Outra vez' });
offlineMessage(state, strings); // 'Sem internet' (always, by default)
offlineMessage(state, strings, true); // reason-aware: 'Sem conexão com a rede' or 'Conectado, mas sem internet'
indicatorName(strings, strings.indicatorLabelOffline); // 'Status da conexão: Sem internet'

An override set to undefined is ignored, and an empty string is kept. indicatorName treats the label as plain text.

Reason-aware messages

By default every offline message is offline. With distinguishReason, the message becomes offlineNoInterface when the reason is no-interface and offlineNoInternet when it is no-internet. The full-screen body does not change. The full-screen title is fullScreenTitle, on web and native alike, unless distinguishReason is on: then it is the reason-aware message.

Adding a language

The bundled tables cover three locales. For another language, pass a complete strings object, or the keys you need, together with the closest bundled locale.

About these docs

These docs are available in the same three languages. The translations were written with care but still need a review by native speakers.