Move TV detail hero content into body

app-tv/src/main/java/hu/bbara/purefin/app/content/episode/EpisodeScreen.kt

@@ -17,6 +17,7 @@ import hu.bbara.purefin.common.ui.PurefinWaitingScreen
 import hu.bbara.purefin.common.ui.components.MediaDetailOverviewSection
 import hu.bbara.purefin.common.ui.components.MediaDetailPlaybackSection
 import hu.bbara.purefin.common.ui.components.MediaDetailSectionTitle
+import hu.bbara.purefin.common.ui.components.TvMediaDetailBodyBox
 import hu.bbara.purefin.common.ui.components.TvMediaDetailScaffold
 import hu.bbara.purefin.core.data.navigation.LocalNavigationManager
 import hu.bbara.purefin.core.data.navigation.Route
@@ -78,10 +79,14 @@ internal fun EpisodeScreenContent(
     }
 
     TvMediaDetailScaffold(
-        backgroundImageUrl = tvMediaDetailBackgroundImageUrl(episode.imageUrlPrefix),
         resetScrollKey = episode.id,
-        modifier = modifier,
+        modifier = modifier
-        heroContent = {
+    ) {
+        item {
+            TvMediaDetailBodyBox(
+                backgroundImageUrl = tvMediaDetailBackgroundImageUrl(episode.imageUrlPrefix),
+                modifier = it
+            ) {
                 EpisodeHeroSection(
                     episode = episode,
                     seriesTitle = seriesTitle,
@@ -91,7 +96,7 @@ internal fun EpisodeScreenContent(
                 )
                 Spacer(modifier = Modifier.height(12.dp))
             }
-    ) {
+        }
         item {
             Column(modifier = it.fillMaxWidth()) {
                 Spacer(modifier = Modifier.height(16.dp))

app-tv/src/main/java/hu/bbara/purefin/app/content/movie/MovieScreen.kt

@@ -17,6 +17,7 @@ import hu.bbara.purefin.common.ui.PurefinWaitingScreen
 import hu.bbara.purefin.common.ui.components.MediaDetailOverviewSection
 import hu.bbara.purefin.common.ui.components.MediaDetailPlaybackSection
 import hu.bbara.purefin.common.ui.components.MediaDetailSectionTitle
+import hu.bbara.purefin.common.ui.components.TvMediaDetailBodyBox
 import hu.bbara.purefin.common.ui.components.TvMediaDetailScaffold
 import hu.bbara.purefin.common.ui.components.tvMediaDetailBackgroundImageUrl
 import hu.bbara.purefin.core.data.navigation.MovieDto
@@ -57,10 +58,14 @@ internal fun MovieScreenContent(
     }
 
     TvMediaDetailScaffold(
-        backgroundImageUrl = tvMediaDetailBackgroundImageUrl(movie.imageUrlPrefix),
         resetScrollKey = movie.id,
-        modifier = modifier,
+        modifier = modifier
-        heroContent = {
+    ) {
+        item {
+            TvMediaDetailBodyBox(
+                backgroundImageUrl = tvMediaDetailBackgroundImageUrl(movie.imageUrlPrefix),
+                modifier = it
+            ) {
                 MovieHeroSection(
                     movie = movie,
                     onPlay = onPlay,
@@ -69,7 +74,7 @@ internal fun MovieScreenContent(
                 )
                 Spacer(modifier = Modifier.height(12.dp))
             }
-    ) {
+        }
         item {
             Column(modifier = it.fillMaxWidth()) {
                 Spacer(modifier = Modifier.height(16.dp))

app-tv/src/main/java/hu/bbara/purefin/app/content/series/SeriesScreen.kt

@@ -18,6 +18,7 @@ import androidx.hilt.navigation.compose.hiltViewModel
 import hu.bbara.purefin.common.ui.PurefinWaitingScreen
 import hu.bbara.purefin.common.ui.components.MediaDetailOverviewSection
 import hu.bbara.purefin.common.ui.components.MediaDetailSectionTitle
+import hu.bbara.purefin.common.ui.components.TvMediaDetailBodyBox
 import hu.bbara.purefin.common.ui.components.TvMediaDetailScaffold
 import hu.bbara.purefin.common.ui.components.tvMediaDetailBackgroundImageUrl
 import hu.bbara.purefin.core.data.navigation.SeriesDto
@@ -70,10 +71,14 @@ internal fun SeriesScreenContent(
     }
 
     TvMediaDetailScaffold(
-        backgroundImageUrl = tvMediaDetailBackgroundImageUrl(series.imageUrlPrefix),
         resetScrollKey = series.id,
-        modifier = modifier,
+        modifier = modifier
-        heroContent = {
+    ) {
+        item {
+            TvMediaDetailBodyBox(
+                backgroundImageUrl = tvMediaDetailBackgroundImageUrl(series.imageUrlPrefix),
+                modifier = it
+            ) {
                 SeriesHeroSection(
                     series = series,
                     nextUpEpisode = nextUpEpisode,
@@ -84,7 +89,7 @@ internal fun SeriesScreenContent(
                 )
                 Spacer(modifier = Modifier.height(12.dp))
             }
-    ) {
+        }
         item {
             Column(modifier = it.fillMaxWidth()) {
                 Spacer(modifier = Modifier.height(16.dp))

app-tv/src/main/java/hu/bbara/purefin/common/ui/components/MediaDetailShell.kt

@@ -17,6 +17,7 @@ import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.layout.ContentScale
@@ -31,14 +32,12 @@ import org.jellyfin.sdk.model.api.ImageType
 internal val MediaDetailHorizontalPadding = 48.dp
 private val MediaDetailHeaderTopPadding = 104.dp
 private val MediaDetailHeaderBottomPadding = 36.dp
+private const val MediaDetailBodyImageWidthFraction = 0.56f
 
 @Composable
 internal fun TvMediaDetailScaffold(
-    backgroundImageUrl: String,
     resetScrollKey: Any,
     modifier: Modifier = Modifier,
-    headerHeightFraction: Float = 0.48f,
-    heroContent: @Composable ColumnScope.() -> Unit,
     bodyContent: LazyListScope.(Modifier) -> Unit = { _ -> }
 ) {
     val scheme = MaterialTheme.colorScheme
@@ -55,36 +54,33 @@ internal fun TvMediaDetailScaffold(
             .fillMaxSize()
             .background(scheme.background)
     ) {
-        item {
-            TvMediaDetailHeader(
-                backgroundImageUrl = backgroundImageUrl,
-                headerHeightFraction = headerHeightFraction,
-                heroContent = heroContent
-            )
-        }
         bodyContent(contentPadding)
     }
 }
 
 @Composable
-private fun TvMediaDetailHeader(
+internal fun TvMediaDetailBodyBox(
     backgroundImageUrl: String,
-    headerHeightFraction: Float,
+    modifier: Modifier = Modifier,
-    heroContent: @Composable ColumnScope.() -> Unit
+    heightFraction: Float = 0.48f,
+    content: @Composable ColumnScope.() -> Unit
 ) {
     val scheme = MaterialTheme.colorScheme
     val screenHeight = LocalConfiguration.current.screenHeightDp.dp
-    val headerHeight = screenHeight * headerHeightFraction
+    val bodyHeight = screenHeight * heightFraction
 
     Box(
-        modifier = Modifier
+        modifier = modifier
             .fillMaxWidth()
-            .heightIn(min = headerHeight)
+            .heightIn(min = bodyHeight)
     ) {
         PurefinAsyncImage(
             model = backgroundImageUrl,
             contentDescription = null,
-            modifier = Modifier.fillMaxSize(),
+            modifier = Modifier
+                .fillMaxSize()
+                .fillMaxWidth(MediaDetailBodyImageWidthFraction)
+                .align(Alignment.TopEnd),
             contentScale = ContentScale.Crop
         )
         Box(
@@ -118,13 +114,11 @@ private fun TvMediaDetailHeader(
             modifier = Modifier
                 .fillMaxWidth()
                 .padding(
-                    start = MediaDetailHorizontalPadding,
                     top = MediaDetailHeaderTopPadding,
-                    end = MediaDetailHorizontalPadding,
                     bottom = MediaDetailHeaderBottomPadding
                 )
         ) {
-            heroContent()
+            content()
         }
     }
 }