chore: use appropriate Host for each platform

Author: sidorchukandrew

src/components/BibleReaderView.tsx

@@ -1,12 +1,15 @@
-import { Host } from "@expo/ui/swift-ui";
+import { Host as AndroidHost } from "@expo/ui/jetpack-compose";
+import { Host as IosHost } from "@expo/ui/swift-ui";
 import { requireNativeView } from "expo";
-import { StyleSheet } from "react-native";
+import { Platform, StyleSheet } from "react-native";
 
 import { BibleReference } from "../types";
 
 const NativeView: React.ComponentType<NativeProps> =
   requireNativeView("BibleReaderView");
 
+const PlatformHost = Platform.OS === "ios" ? IosHost : AndroidHost;
+
 /**
  * A full-featured Bible reader component.
  * It allows the user to control font customizations, switch Bible versions and access their verse highlights.
@@ -15,13 +18,13 @@ const NativeView: React.ComponentType<NativeProps> =
  */
 export function BibleReaderView({ reference, ...props }: BibleReaderViewProps) {
   return (
-    <Host style={styles.view}>
+    <PlatformHost style={styles.view}>
       <NativeView
         hasReference={!!reference}
         {...(reference || {})}
         {...props}
       />
-    </Host>
+    </PlatformHost>
   );
 }
 

src/components/SignInWithYouVersionButton.tsx

@@ -1,7 +1,10 @@
-import { CommonViewModifierProps, Host } from "@expo/ui/swift-ui";
+import { Host as AndroidHost } from "@expo/ui/jetpack-compose";
+import { CommonViewModifierProps, Host as IosHost } from "@expo/ui/swift-ui";
 import { fixedSize } from "@expo/ui/swift-ui/modifiers";
 import { requireNativeView } from "expo";
-import { StyleProp, ViewStyle } from "react-native";
+import { Platform, StyleProp, ViewStyle } from "react-native";
+
+const PlatformHost = Platform.OS === "ios" ? IosHost : AndroidHost;
 
 const NativeView: React.ComponentType<NativeProps> = requireNativeView(
   "SignInWithYouVersionButton",
@@ -61,7 +64,7 @@ export function SignInWithYouVersionButton({
   ...props
 }: SignInWithYouVersionButtonProps) {
   return (
-    <Host matchContents={{ vertical: true, horizontal: true }} style={style}>
+    <PlatformHost matchContents style={style}>
       <NativeView
         {...props}
         mode={mode}
@@ -71,6 +74,6 @@ export function SignInWithYouVersionButton({
         onTap={onPress}
         modifiers={[fixedSize()]}
       />
-    </Host>
+    </PlatformHost>
   );
 }