refactor poster and video grids

app/src/main/java/com/owenlejeune/tvtime/ui/components/Grid.kt

@@ -61,7 +61,7 @@ fun StaticGrid(
         is StaticGridCells.Dynamic -> {
             BoxWithConstraints(modifier = modifier) {
                 val nColumns = maxOf((maxWidth / cells.minSize).toInt(), 1)
-                val spacing = maxWidth - (cells.minSize * nColumns)
+                val spacing = (maxWidth - (cells.minSize * nColumns)) / 10
                 StaticGridInternal(
                     columns = nColumns,
                     itemCount = itemCount,

app/src/main/java/com/owenlejeune/tvtime/ui/components/Posters.kt

@@ -30,11 +30,14 @@ import com.google.accompanist.pager.ExperimentalPagerApi
 import com.google.accompanist.pager.HorizontalPager
 import com.google.accompanist.pager.rememberPagerState
 import com.owenlejeune.tvtime.R
-import com.owenlejeune.tvtime.utils.TmdbUtils
 import com.owenlejeune.tvtime.api.tmdb.model.ImageCollection
 import com.owenlejeune.tvtime.api.tmdb.model.TmdbItem
 import com.owenlejeune.tvtime.extensions.dpToPx
 import com.owenlejeune.tvtime.extensions.listItems
+import com.owenlejeune.tvtime.utils.TmdbUtils
+
+private val POSTER_WIDTH = 127.dp
+private val POSTER_HEIGHT = 190.dp
 
 @OptIn(ExperimentalFoundationApi::class)
 @Composable
@@ -46,7 +49,7 @@ fun PosterGrid(
     fetchMedia(mediaList)
 
     LazyVerticalGrid(
-        cells = GridCells.Fixed(count = 3),
+        cells = GridCells.Adaptive(minSize = POSTER_WIDTH),
         contentPadding = PaddingValues(8.dp)
     ) {
         listItems(mediaList.value) { item ->
@@ -61,8 +64,8 @@ fun PosterGrid(
 @Composable
 fun PosterItem(
     modifier: Modifier = Modifier,
-    width: Dp = 127.dp,
+    width: Dp = POSTER_WIDTH,
-    height: Dp = 190.dp,
+    height: Dp = POSTER_HEIGHT,
     onClick: (Int) -> Unit = {},
     mediaItem: TmdbItem?
 ) {

app/src/main/java/com/owenlejeune/tvtime/ui/screens/DetailView.kt

@@ -29,6 +29,7 @@ import com.owenlejeune.tvtime.api.tmdb.DetailService
 import com.owenlejeune.tvtime.api.tmdb.MoviesService
 import com.owenlejeune.tvtime.api.tmdb.TvService
 import com.owenlejeune.tvtime.api.tmdb.model.*
+import com.owenlejeune.tvtime.extensions.listItems
 import com.owenlejeune.tvtime.ui.components.*
 import com.owenlejeune.tvtime.utils.TmdbUtils
 import kotlinx.coroutines.CoroutineScope
@@ -70,6 +71,7 @@ fun DetailView(
             modifier = Modifier.constrainAs(backdropImage) {
                 top.linkTo(parent.top)
                 start.linkTo(parent.start)
+                end.linkTo(parent.end)
             },
             mediaItem = mediaItem
         )
@@ -175,7 +177,8 @@ private fun ContentColumn(
         modifier = modifier
             .fillMaxWidth()
             .wrapContentHeight()
-            .padding(start = 16.dp, end = 16.dp, bottom = 16.dp)
+            .padding(start = 16.dp, end = 16.dp, bottom = 16.dp),
+        verticalArrangement = Arrangement.spacedBy(16.dp)
     ) {
         if (mediaType == MediaViewType.MOVIE) {
             MiscMovieDetails(mediaItem = mediaItem, service as MoviesService)
@@ -184,12 +187,12 @@ private fun ContentColumn(
         }
 
         if (mediaItem.value?.overview?.isNotEmpty() == true) {
-            OverviewCard(mediaItem = mediaItem, modifier = Modifier.padding(bottom = 16.dp))
+            OverviewCard(mediaItem = mediaItem)
         }
 
-        CastCard(itemId = itemId, service = service, modifier = Modifier.padding(bottom = 16.dp))
+        CastCard(itemId = itemId, service = service)
 
-        SimilarContentCard(itemId = itemId, service = service, modifier = Modifier.padding(bottom = 16.dp))
+        SimilarContentCard(itemId = itemId, service = service)
         
         VideosCard(itemId = itemId, service = service)
     }
@@ -381,7 +384,7 @@ fun VideosCard(itemId: Int?, service: DetailService, modifier: Modifier = Modifi
         }
     }
 
-    if (videoResponse.value != null) {
+    if (videoResponse.value != null && videoResponse.value!!.results.any { it.isOfficial }) {
         val results = videoResponse.value!!.results
         ExpandableContentCard(
             modifier = modifier,
@@ -406,7 +409,6 @@ fun VideosCard(itemId: Int?, service: DetailService, modifier: Modifier = Modifi
     }
 }
 
-@OptIn(ExperimentalFoundationApi::class)
 @Composable
 private fun VideoGroup(results: List<Video>, type: Video.Type, title: String) {
     val videos = results.filter { it.isOfficial && it.type == type }
@@ -417,18 +419,18 @@ private fun VideoGroup(results: List<Video>, type: Video.Type, title: String) {
             modifier = Modifier.padding(start = 12.dp, top = 8.dp)
         )
 
-        StaticGrid(
+        val posterWidth = 120.dp
-            modifier = Modifier
+        LazyRow(modifier = Modifier
-                .fillMaxWidth()
+            .padding(horizontal = 8.dp, vertical = 8.dp)
-                .padding(horizontal = 12.dp, vertical = 8.dp),
+        ) {
-            cells = StaticGridCells.Dynamic(110.dp),
+            listItems(videos) { video ->
-            itemCount = videos.size
+                FullScreenThumbnailVideoPlayer(
-        ) { i ->
+                    key = video.key,
-            val video = videos[i]
+                    modifier = Modifier
-            FullScreenThumbnailVideoPlayer(
+                        .width(posterWidth)
-                key = video.key,
+                        .height(80.dp)
-                modifier = Modifier.size(110.dp, 80.dp)
+                )
-            )
+            }
         }
     }
 }