diff --git a/src/components/PostControls/PostMenu/PostMenuItems.tsx b/src/components/PostControls/PostMenu/PostMenuItems.tsx index 13168bd2a3..9333723678 100644 --- a/src/components/PostControls/PostMenu/PostMenuItems.tsx +++ b/src/components/PostControls/PostMenu/PostMenuItems.tsx @@ -19,7 +19,6 @@ import {useNavigation} from '@react-navigation/native' import {DISCOVER_DEBUG_DIDS} from '#/lib/constants' import {useOpenLink} from '#/lib/hooks/useOpenLink' -import {useTranslate} from '#/lib/hooks/useTranslate' import {getCurrentRoute} from '#/lib/routes/helpers' import {makeProfileLink} from '#/lib/routes/links' import { @@ -95,6 +94,7 @@ import { import * as Prompt from '#/components/Prompt' import {useAnalytics} from '#/analytics' import {IS_INTERNAL} from '#/env' +import {useMaybeTranslateOnDevice} from '#/translation' import * as bsky from '#/types/bsky' let PostMenuItems = ({ @@ -133,7 +133,7 @@ let PostMenuItems = ({ const {hidePost} = useHiddenPostsApi() const feedFeedback = useFeedFeedbackContext() const openLink = useOpenLink() - const translate = useTranslate() + const translate = useMaybeTranslateOnDevice() const navigation = useNavigation() const {mutedWordsDialogControl} = useGlobalDialogsControlContext() const blockPromptControl = useDialogControl() diff --git a/src/translation/index.tsx b/src/translation/index.tsx index 7c5f05f33a..941a598a54 100644 --- a/src/translation/index.tsx +++ b/src/translation/index.tsx @@ -10,6 +10,7 @@ import {getLocales} from 'expo-localization' import {type TranslationTaskResult} from '@bsky.app/expo-translate-text/build/ExpoTranslateText.types' import {useOpenLink} from '#/lib/hooks/useOpenLink' +import {useTranslate} from '#/lib/hooks/useTranslate' import {getTranslatorLink} from '#/locale/helpers' import {logger} from '#/logger' import {useLanguagePrefs} from '#/state/preferences' @@ -95,11 +96,7 @@ const Context = createContext<{ sourceLangCode?: string, ) => Promise clearTranslation: () => void -}>({ - translationState: IDLE, - translate: async () => {}, - clearTranslation: () => {}, -}) +} | null>(null) Context.displayName = 'TranslationContext' /** @@ -120,6 +117,29 @@ export function useTranslateOnDevice() { return context } +/** + * Triggers the on-device translation, if within the TranslateOnDeviceProvider. + * Otherwise, falls back to linking out to Google Translate. + */ +export function useMaybeTranslateOnDevice() { + const onDeviceTranslation = useContext(Context) + const fallbackTranslation = useTranslate() + + return useCallback( + (text: string, targetLangCode: string, sourceLangCode?: string) => { + if (onDeviceTranslation) { + return onDeviceTranslation.translate( + text, + targetLangCode, + sourceLangCode, + ) + } + return fallbackTranslation(text, targetLangCode, sourceLangCode) + }, + [onDeviceTranslation, fallbackTranslation], + ) +} + export function Provider({children}: React.PropsWithChildren) { const [translationState, setTranslationState] = useState(IDLE)