robinwobin.dev
forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 馃挮
1# Translation
2
3A hook for translating text on-device for inline display.
4
5## Translating text
6
7```tsx
8const langPrefs = useLanguagePrefs()
9const {translate} = useTranslate({key: post.uri})
10
11// ...
12
13void translate({
14 text: record.text,
15 targetLangCode: langPrefs.primaryLanguage,
16})
17```
18
19## Clearing/hiding a translation
20
21```tsx
22const {clearTranslation} = useTranslate({key: post.uri})
23
24// ...
25
26clearTranslation()
27```
28
29## Rendering a translation
30
31```tsx
32const {translationState} = useTranslate({key: post.uri})
33
34// ...
35
36switch (translationState.status) {
37 case 'idle':
38 // Default state; render a link that calls `translate`.
39 break;
40 case 'loading':
41 // On-device translation is in progress; render a loading spinner.
42 break;
43 case 'success':
44 // Translation complete; render `translationState.translatedText` and a link
45 // that calls `clearTranslation`.
46 break;
47 case 'error':
48 // On-device translation failed; render `translationState.message` and a
49 // link to `translate` from `useGoogleTranslate` as a fallback.
50 break;
51}
52```
53
54## Notes
55
56* Android only supports two-letter language codes.
57 * For example, this means it doesn鈥檛 differentiate between `pt-BR` and `pt-PT`.
58* Android and iOS only support a subset of the language options we offer (iOS supports fewer than Android).
59* Individual language packs must be downloaded on iOS.