diff --git a/modules/expo-bluesky-translate/index.ts b/modules/expo-bluesky-translate/index.ts index d75c667969..35339e7d62 100644 --- a/modules/expo-bluesky-translate/index.ts +++ b/modules/expo-bluesky-translate/index.ts @@ -1,4 +1,5 @@ export { - ExpoBlueskyTranslateView, isAvailable, + NativeTranslationModule, + NativeTranslationView, } from './src/ExpoBlueskyTranslateView' diff --git a/modules/expo-bluesky-translate/ios/ExpoBlueskyTranslateModule.swift b/modules/expo-bluesky-translate/ios/ExpoBlueskyTranslateModule.swift index 55677a18b5..afa8137229 100644 --- a/modules/expo-bluesky-translate/ios/ExpoBlueskyTranslateModule.swift +++ b/modules/expo-bluesky-translate/ios/ExpoBlueskyTranslateModule.swift @@ -5,14 +5,14 @@ import SwiftUI public class ExpoBlueskyTranslateModule: Module { public func definition() -> ModuleDefinition { Name("ExpoBlueskyTranslate") - View(ExpoBlueskyTranslateView.self) { - Events("onClose") - Prop("text") { (view: ExpoBlueskyTranslateView, text: String) in - view.props.text = text - } - Prop("isPresented") { (view: ExpoBlueskyTranslateView, isPresented: Bool) in - view.props.isPresented = isPresented + + AsyncFunction("presentAsync") { (text: String) in + DispatchQueue.main.async { [weak state = TranslateViewState.shared] in + state?.isPresented = true + state?.text = text } } + + View(ExpoBlueskyTranslateView.self) {} } } diff --git a/modules/expo-bluesky-translate/ios/ExpoBlueskyTranslateView.swift b/modules/expo-bluesky-translate/ios/ExpoBlueskyTranslateView.swift index 8aa4bdf519..ca6e3be69c 100644 --- a/modules/expo-bluesky-translate/ios/ExpoBlueskyTranslateView.swift +++ b/modules/expo-bluesky-translate/ios/ExpoBlueskyTranslateView.swift @@ -2,36 +2,21 @@ import ExpoModulesCore import Foundation import SwiftUI -class TranslateViewProps: ObservableObject { - @Published var text: String = "" - @Published var children: [UIView]? - @Published var onClose: EventDispatcher - @Published var isPresented: Bool = false { - didSet { - if !isPresented { - self.onClose() - } - } - } - - init(onClose: EventDispatcher) { - self.onClose = onClose - } +class TranslateViewState: ObservableObject { + static var shared = TranslateViewState() + + @Published var isPresented = false + @Published var text = "" } class ExpoBlueskyTranslateView: ExpoView { - let props: TranslateViewProps - let onClose = EventDispatcher() - - override func didUpdateReactSubviews() { - let subChildren = self.reactSubviews() - props.children = subChildren - } - required init(appContext: AppContext? = nil) { - props = TranslateViewProps(onClose: onClose) - let hostingController = UIHostingController(rootView: TranslateView(props: props)) - super.init(appContext: appContext) - setupHostingController(hostingController) + if #available(iOS 14.0, *) { + let hostingController = UIHostingController(rootView: TranslateView()) + super.init(appContext: appContext) + setupHostingController(hostingController) + } else { + super.init(appContext: appContext) + } } } diff --git a/modules/expo-bluesky-translate/ios/TranslateView.swift b/modules/expo-bluesky-translate/ios/TranslateView.swift index 94aea9dd64..99b545252b 100644 --- a/modules/expo-bluesky-translate/ios/TranslateView.swift +++ b/modules/expo-bluesky-translate/ios/TranslateView.swift @@ -2,21 +2,16 @@ import SwiftUI import Translation struct TranslateView: View { - @ObservedObject var props: TranslateViewProps + @ObservedObject var state = TranslateViewState.shared var body: some View { if #available(iOS 17.4, *) { VStack { - ForEach(props.children?.indices ?? 0..<0, id: \.self) { index in - UIViewRepresentableWrapper(view: props.children?[index] ?? UIView()) - .frame( - width: props.children?[index].frame.width, - height: props.children?[index].frame.height) - } + UIViewRepresentableWrapper(view: UIView(frame: .zero)) } .translationPresentation( - isPresented: $props.isPresented, - text: props.text + isPresented: $state.isPresented, + text: state.text ) } } diff --git a/modules/expo-bluesky-translate/src/ExpoBlueskyTranslate.types.ts b/modules/expo-bluesky-translate/src/ExpoBlueskyTranslate.types.ts index 6a1ce3848a..a01d4d479d 100644 --- a/modules/expo-bluesky-translate/src/ExpoBlueskyTranslate.types.ts +++ b/modules/expo-bluesky-translate/src/ExpoBlueskyTranslate.types.ts @@ -1,8 +1,3 @@ -import React from 'react' - -export type ExpoBlueskyTranslateProps = { - text: string - isPresented?: boolean - children: React.ReactNode - onClose?: () => void +export type ExpoBlueskyTranslateModule = { + presentAsync: (text: string) => Promise } diff --git a/modules/expo-bluesky-translate/src/ExpoBlueskyTranslateView.ios.tsx b/modules/expo-bluesky-translate/src/ExpoBlueskyTranslateView.ios.tsx index c9434a9d5e..c62be669bb 100644 --- a/modules/expo-bluesky-translate/src/ExpoBlueskyTranslateView.ios.tsx +++ b/modules/expo-bluesky-translate/src/ExpoBlueskyTranslateView.ios.tsx @@ -1,14 +1,18 @@ import React from 'react' import {Platform} from 'react-native' -import {requireNativeViewManager} from 'expo-modules-core' +import {requireNativeModule, requireNativeViewManager} from 'expo-modules-core' -import {ExpoBlueskyTranslateProps} from './ExpoBlueskyTranslate.types' +import {ExpoBlueskyTranslateModule} from './ExpoBlueskyTranslate.types' -const NativeView: React.ComponentType = - requireNativeViewManager('ExpoBlueskyTranslate') +export const NativeTranslationModule = + requireNativeModule('ExpoBlueskyTranslate') -export function ExpoBlueskyTranslateView(props: ExpoBlueskyTranslateProps) { - return +const NativeView: React.ComponentType = requireNativeViewManager( + 'ExpoBlueskyTranslate', +) + +export function NativeTranslationView() { + return } export const isAvailable = Number(Platform.Version) >= 17.4 diff --git a/modules/expo-bluesky-translate/src/ExpoBlueskyTranslateView.tsx b/modules/expo-bluesky-translate/src/ExpoBlueskyTranslateView.tsx index 3af08a1508..4259927c79 100644 --- a/modules/expo-bluesky-translate/src/ExpoBlueskyTranslateView.tsx +++ b/modules/expo-bluesky-translate/src/ExpoBlueskyTranslateView.tsx @@ -1,6 +1,8 @@ -import {ExpoBlueskyTranslateProps} from './ExpoBlueskyTranslate.types' +export const NativeTranslationModule = { + presentAsync: async (_: string) => {}, +} -export function ExpoBlueskyTranslateView(_: ExpoBlueskyTranslateProps) { +export function NativeTranslationView() { return null } diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem.tsx index 503c180c42..e664b43325 100644 --- a/src/view/com/post-thread/PostThreadItem.tsx +++ b/src/view/com/post-thread/PostThreadItem.tsx @@ -31,8 +31,8 @@ import {PostThreadFollowBtn} from 'view/com/post-thread/PostThreadFollowBtn' import {atoms as a} from '#/alf' import {RichText} from '#/components/RichText' import { - ExpoBlueskyTranslateView, isAvailable as isNativeTranslateAvailable, + NativeTranslationModule, } from '../../../../modules/expo-bluesky-translate' import {ContentHider} from '../../../components/moderation/ContentHider' import {LabelsOnMyPost} from '../../../components/moderation/LabelsOnMe' @@ -637,14 +637,13 @@ function ExpandedPostDetails({ const pal = usePalette('default') const {_} = useLingui() const openLink = useOpenLink() - const [presented, setPresented] = React.useState(false) const onTranslatePress = React.useCallback(() => { if (isNativeTranslateAvailable) { - setPresented(true) + NativeTranslationModule.presentAsync(text) } else { openLink(translatorUrl) } - }, [openLink, translatorUrl]) + }, [openLink, text, translatorUrl]) return ( @@ -652,17 +651,13 @@ function ExpandedPostDetails({ {needsTranslation && ( <> · - setPresented(false)}> - - Translate - - + + + Translate + )} diff --git a/src/view/shell/index.tsx b/src/view/shell/index.tsx index 7d080e57b1..317ac0bde4 100644 --- a/src/view/shell/index.tsx +++ b/src/view/shell/index.tsx @@ -33,6 +33,7 @@ import {ErrorBoundary} from 'view/com/util/ErrorBoundary' import {MutedWordsDialog} from '#/components/dialogs/MutedWords' import {SigninDialog} from '#/components/dialogs/Signin' import {Outlet as PortalOutlet} from '#/components/Portal' +import {NativeTranslationView} from '../../../modules/expo-bluesky-translate' import {RoutesContainer, TabsNavigator} from '../../Navigation' import {Composer} from './Composer' import {DrawerContent} from './Drawer' @@ -93,6 +94,7 @@ function ShellInner() { +