chore: update UI views to use Expo 55

Author: sidorchukandrew

android/src/main/java/com/youversion/reactnativesdk/views/YVPBibleReaderView.kt

@@ -8,6 +8,7 @@ import androidx.compose.ui.Modifier
 import com.youversion.platform.core.bibles.domain.BibleReference
 import com.youversion.platform.reader.BibleReader
 import expo.modules.kotlin.AppContext
+import expo.modules.kotlin.views.ComposableScope
 import expo.modules.kotlin.views.ComposeProps
 import expo.modules.kotlin.views.ExpoComposeView
 
@@ -30,7 +31,7 @@ class YVPBibleReaderView(context: Context, appContext: AppContext) :
     override val props = BibleReaderViewProps()
 
     @Composable
-    override fun Content(modifier: Modifier) {
+    override fun ComposableScope.Content() {
         BibleReader(
             appName = props.appName.value ?: "",
             appSignInMessage = props.signInMessage.value ?: "",

android/src/main/java/com/youversion/reactnativesdk/views/YVPBibleTextView.kt

@@ -13,6 +13,7 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
 import expo.modules.kotlin.AppContext
 import expo.modules.kotlin.viewevent.EventDispatcher
+import expo.modules.kotlin.views.ComposableScope
 import expo.modules.kotlin.views.ComposeProps
 import expo.modules.kotlin.views.ExpoComposeView
 
@@ -43,16 +44,16 @@ class YVPBibleTextView(context: Context, appContext: AppContext) :
     private val onTap by EventDispatcher()
 
     @Composable
-    override fun Content(modifier: Modifier) {
+    override fun ComposableScope.Content() {
         // TODO: Replace with actual BibleText composable when Kotlin SDK is ready
         Box(
-            modifier = modifier
+            modifier = Modifier
                 .fillMaxWidth()
                 .padding(16.dp)
         ) {
             Text(
                 text = "BibleTextView placeholder - versionId: ${props.versionId.value}, " +
-                       "book: ${props.bookUSFM.value}, chapter: ${props.chapter.value}",
+                        "book: ${props.bookUSFM.value}, chapter: ${props.chapter.value}",
                 color = Color.Gray
             )
         }

android/src/main/java/com/youversion/reactnativesdk/views/YVPBibleWidgetView.kt

@@ -14,6 +14,7 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import expo.modules.kotlin.AppContext
+import expo.modules.kotlin.views.ComposableScope
 import expo.modules.kotlin.views.ComposeProps
 import expo.modules.kotlin.views.ExpoComposeView
 
@@ -36,7 +37,7 @@ class YVPBibleWidgetView(context: Context, appContext: AppContext) :
     override val props = BibleWidgetViewProps()
 
     @Composable
-    override fun Content(modifier: Modifier) {
+    override fun ComposableScope.Content() {
         val isDark = when (props.colorScheme.value) {
             "dark" -> true
             "light" -> false
@@ -45,7 +46,7 @@ class YVPBibleWidgetView(context: Context, appContext: AppContext) :
 
         // TODO: Replace with actual BibleWidget composable when Kotlin SDK is ready
         Box(
-            modifier = modifier
+            modifier = Modifier
                 .fillMaxWidth()
                 .padding(16.dp)
         ) {

android/src/main/java/com/youversion/reactnativesdk/views/YVPSignInWithYouVersionButton.kt

@@ -5,17 +5,14 @@ import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.MutableState
 import androidx.compose.runtime.mutableStateOf
-import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Shape
 import com.youversion.platform.ui.views.SignInWithYouVersionButton
 import com.youversion.platform.ui.views.SignInWithYouVersionButtonDefaults
 import com.youversion.platform.ui.views.SignInWithYouVersionButtonMode
 import expo.modules.kotlin.AppContext
-import expo.modules.kotlin.views.AutoSizingComposable
+import expo.modules.kotlin.views.ComposableScope
 import expo.modules.kotlin.views.ComposeProps
-import expo.modules.kotlin.views.Direction
 import expo.modules.kotlin.views.ExpoComposeView
-import java.util.EnumSet
 
 data class SignInWithYouVersionButtonProps(
     val mode: MutableState<String?> = mutableStateOf("full"),
@@ -30,16 +27,14 @@ class YVPSignInWithYouVersionButton(context: Context, appContext: AppContext) :
 //    private val onTap by EventDispatcher()
 
     @Composable
-    override fun Content(modifier: Modifier) {
-        AutoSizingComposable(shadowNodeProxy, axis = EnumSet.of(Direction.HORIZONTAL, Direction.VERTICAL)) {
-            SignInWithYouVersionButton(
-                mode = mode(),
-                stroked = stroked(),
-                shape = shape(),
-                dark = isDark(),
-                permissions = { HashSet() }
-            )
-        }
+    override fun ComposableScope.Content() {
+        SignInWithYouVersionButton(
+            mode = mode(),
+            stroked = stroked(),
+            shape = shape(),
+            dark = isDark(),
+            permissions = { HashSet() }
+        )
     }
 
     fun mode(): SignInWithYouVersionButtonMode {

android/src/main/java/com/youversion/reactnativesdk/views/YVPVotdView.kt

@@ -13,6 +13,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
 import expo.modules.kotlin.AppContext
+import expo.modules.kotlin.views.ComposableScope
 import expo.modules.kotlin.views.ComposeProps
 import expo.modules.kotlin.views.ExpoComposeView
 
@@ -27,7 +28,7 @@ class YVPVotdView(context: Context, appContext: AppContext) :
     override val props = VotdViewProps()
 
     @Composable
-    override fun Content(modifier: Modifier) {
+    override fun ComposableScope.Content() {
         val isDark = when (props.colorScheme.value) {
             "dark" -> true
             "light" -> false
@@ -36,7 +37,7 @@ class YVPVotdView(context: Context, appContext: AppContext) :
 
         // TODO: Replace with actual VerseOfTheDay composable when Kotlin SDK is ready
         Box(
-            modifier = modifier
+            modifier = Modifier
                 .fillMaxWidth()
                 .padding(16.dp)
         ) {