Fix Episode Images not loading

android-core/designsystem/src/main/kotlin/com/thomaskioko/tvmaniac/compose/components/Buttons.kt

@@ -9,7 +9,6 @@ import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.sizeIn
-import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.ButtonColors
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.MaterialTheme
@@ -93,7 +92,7 @@ fun TvManiacOutlinedButton(
     borderColor: Color,
     modifier: Modifier = Modifier,
     enabled: Boolean = true,
-    shape: Shape = RoundedCornerShape(4.dp),
+    shape: Shape = MaterialTheme.shapes.small,
     contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
     content: @Composable RowScope.() -> Unit,
 ) {

android-core/designsystem/src/main/kotlin/com/thomaskioko/tvmaniac/compose/components/Card.kt

@@ -14,7 +14,7 @@ import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.RectangleShape
+import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.Dp
@@ -26,14 +26,15 @@ fun TvPosterCard(
     posterImageUrl: String?,
     title: String,
     modifier: Modifier = Modifier,
+    shape: Shape = MaterialTheme.shapes.small,
     imageWidth: Dp = 120.dp,
     onClick: () -> Unit = {},
 ) {
     Card(
         modifier = modifier
             .width(imageWidth)
             .clickable { onClick() },
-        shape = RectangleShape,
+        shape = shape,
         elevation = CardDefaults.cardElevation(
             defaultElevation = 4.dp,
         ),

android-core/designsystem/src/main/kotlin/com/thomaskioko/tvmaniac/compose/components/Dialogs.kt

@@ -9,7 +9,6 @@ import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.RectangleShape
 import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.unit.dp
@@ -24,7 +23,7 @@ fun BasicDialog(
     enableConfirmButton: Boolean = true,
     enableDismissButton: Boolean = true,
     dismissButtonText: String? = null,
-    shape: Shape = RectangleShape,
+    shape: Shape = MaterialTheme.shapes.small,
     onDismissDialog: () -> Unit = {},
     confirmButtonClicked: () -> Unit = {},
     dismissButtonClicked: () -> Unit = {},

android-core/designsystem/src/main/kotlin/com/thomaskioko/tvmaniac/compose/theme/Shape.kt

@@ -0,0 +1,11 @@
+package com.thomaskioko.tvmaniac.compose.theme
+
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Shapes
+import androidx.compose.ui.unit.dp
+
+val tvManiacShapes = Shapes(
+    small = RoundedCornerShape(4.dp),
+    medium = RoundedCornerShape(8.dp),
+    large = RoundedCornerShape(16.dp),
+)

android-core/designsystem/src/main/kotlin/com/thomaskioko/tvmaniac/compose/theme/Theme.kt

@@ -54,6 +54,7 @@ fun TvManiacTheme(
         MaterialTheme(
             colorScheme = colorScheme,
             typography = tvManiacTypography,
+            shapes = tvManiacShapes,
             content = content,
         )
     }

android-core/resources/src/main/res/values/strings.xml

@@ -40,6 +40,7 @@
 
     <string name="title_settings">Settings</string>
     <string name="title_all_seasons">All Seasons</string>
+    <string name="title_all_episodes">All Episodes</string>
     <string name="title_watch_next">Watch Next</string>
     <string name="status_connected">Back Online!</string>
     <string name="status_no_connection">No Internet Connection!</string>

android-features/discover/src/main/java/com/thomaskioko/tvmaniac/discover/DiscoverScreen.kt

@@ -417,7 +417,7 @@ fun HorizontalPagerItem(
     }
 }
 
-@OptIn(ExperimentalSnapperApi::class)
+@OptIn(ExperimentalSnapperApi::class, ExperimentalFoundationApi::class)
 @Composable
 private fun RowContent(
     category: Category,
@@ -449,6 +449,8 @@ private fun RowContent(
                         posterImageUrl = tvShow.posterImageUrl,
                         title = tvShow.title,
                         onClick = { onItemClicked(tvShow.traktId) },
+                        modifier = Modifier
+                            .animateItemPlacement(),
                     )
                 }
             }

android-features/season-details/src/main/java/com/thomaskioko/tvmaniac/seasondetails/SeasonDetailsScreen.kt

@@ -7,10 +7,13 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.statusBarsPadding
+import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.LazyListState
+import androidx.compose.foundation.lazy.LazyRow
 import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.material3.ExperimentalMaterial3Api
@@ -41,10 +44,14 @@ import com.thomaskioko.tvmaniac.presentation.seasondetails.Loading
 import com.thomaskioko.tvmaniac.presentation.seasondetails.LoadingError
 import com.thomaskioko.tvmaniac.presentation.seasondetails.SeasonDetailsLoaded
 import com.thomaskioko.tvmaniac.presentation.seasondetails.SeasonDetailsState
+import com.thomaskioko.tvmaniac.presentation.seasondetails.model.Episode
 import com.thomaskioko.tvmaniac.presentation.seasondetails.model.SeasonDetails
 import com.thomaskioko.tvmaniac.resources.R
 import com.thomaskioko.tvmaniac.seasondetails.components.CollapsableContent
-import com.thomaskioko.tvmaniac.seasondetails.components.WatchNextContent
+import com.thomaskioko.tvmaniac.seasondetails.components.EpisodeItem
+import dev.chrisbanes.snapper.ExperimentalSnapperApi
+import dev.chrisbanes.snapper.rememberSnapperFlingBehavior
+import kotlinx.collections.immutable.ImmutableList
 import me.tatarka.inject.annotations.Assisted
 import me.tatarka.inject.annotations.Inject
 
@@ -106,8 +113,7 @@ internal fun SeasonDetailScreen(
                 navigateUp = onBackClicked,
             )
         },
-        modifier = modifier
-            .statusBarsPadding(),
+        modifier = modifier.statusBarsPadding(),
         content = { contentPadding ->
             when (state) {
                 Loading -> LoadingIndicator(
@@ -116,14 +122,13 @@ internal fun SeasonDetailScreen(
                         .wrapContentSize(Alignment.Center),
                 )
 
-                is LoadingError ->
-                    ErrorUi(
-                        errorMessage = state.message,
-                        onRetry = {},
-                        modifier = Modifier
-                            .fillMaxSize()
-                            .wrapContentSize(Alignment.Center),
-                    )
+                is LoadingError -> ErrorUi(
+                    errorMessage = state.message,
+                    onRetry = {},
+                    modifier = Modifier
+                        .fillMaxSize()
+                        .wrapContentSize(Alignment.Center),
+                )
 
                 is SeasonDetailsLoaded -> {
                     SeasonContent(
@@ -155,7 +160,7 @@ private fun TopBar(
 
 @Composable
 private fun SeasonContent(
-    seasonsEpList: List<SeasonDetails>?,
+    seasonsEpList: ImmutableList<SeasonDetails>?,
     initialSeasonName: String?,
     listState: LazyListState,
     contentPadding: PaddingValues,
@@ -179,15 +184,21 @@ private fun SeasonContent(
         LazyColumn(
             state = listState,
             contentPadding = contentPadding.copy(copyTop = false),
-            modifier = Modifier.fillMaxSize(),
+            modifier = Modifier
+                .padding(horizontal = 16.dp)
+                .fillMaxSize(),
         ) {
             item { Spacer(modifier = Modifier.height(64.dp)) }
 
             item { WatchNextContent(seasonsEpList.firstOrNull()?.episodes) }
 
             item { Spacer(modifier = Modifier.height(16.dp)) }
 
-            item { AllSeasonsTitle() }
+            item {
+                LabelTitle(
+                    label = stringResource(id = R.string.title_all_episodes),
+                )
+            }
 
             itemsIndexed(seasonsEpList) { index, season ->
                 CollapsableContent(
@@ -204,20 +215,57 @@ private fun SeasonContent(
     }
 }
 
+@OptIn(ExperimentalSnapperApi::class)
+@Composable
+fun WatchNextContent(
+    episodeList: ImmutableList<Episode>?,
+    modifier: Modifier = Modifier,
+    onEpisodeClicked: () -> Unit = {},
+) {
+    episodeList?.let {
+        LabelTitle(
+            modifier = modifier
+                .padding(top = 16.dp, bottom = 8.dp),
+            label = stringResource(id = R.string.title_watch_next),
+        )
+
+        val lazyListState = rememberLazyListState()
+
+        LazyRow(
+            state = lazyListState,
+            flingBehavior = rememberSnapperFlingBehavior(lazyListState),
+        ) {
+            itemsIndexed(episodeList) { index, episode ->
+                val value = if (index == 0) 0 else 8
+                Spacer(modifier = Modifier.width(value.dp))
+
+                EpisodeItem(
+                    modifier = modifier.size(width = 320.dp, height = 90.dp),
+                    imageUrl = episode.imageUrl,
+                    title = episode.seasonEpisodeNumber,
+                    episodeOverview = episode.overview,
+                    onEpisodeClicked = onEpisodeClicked,
+                )
+            }
+
+            item { Spacer(modifier = Modifier.height(16.dp)) }
+        }
+    }
+}
+
 @Composable
-private fun AllSeasonsTitle(
+private fun LabelTitle(
+    label: String,
     modifier: Modifier = Modifier,
 ) {
     Box(
-        modifier = modifier
-            .fillMaxWidth()
-            .padding(2.dp),
+        modifier = modifier.fillMaxWidth(),
         contentAlignment = Alignment.Center,
     ) {
         Spacer(modifier = Modifier.height(8.dp))
 
         Text(
-            text = stringResource(id = R.string.title_all_seasons),
+            text = label,
             style = MaterialTheme.typography.labelMedium.copy(MaterialTheme.colorScheme.secondary),
         )
     }
@@ -226,8 +274,7 @@ private fun AllSeasonsTitle(
 @ThemePreviews
 @Composable
 private fun SeasonDetailScreenPreview(
-    @PreviewParameter(SeasonPreviewParameterProvider::class)
-    state: SeasonDetailsState,
+    @PreviewParameter(SeasonPreviewParameterProvider::class) state: SeasonDetailsState,
 ) {
     TvManiacTheme {
         Surface {

android-features/season-details/src/main/java/com/thomaskioko/tvmaniac/seasondetails/SeasonPreviewParameterProvider.kt

@@ -6,6 +6,8 @@ import com.thomaskioko.tvmaniac.presentation.seasondetails.SeasonDetailsLoaded
 import com.thomaskioko.tvmaniac.presentation.seasondetails.SeasonDetailsState
 import com.thomaskioko.tvmaniac.presentation.seasondetails.model.Episode
 import com.thomaskioko.tvmaniac.presentation.seasondetails.model.SeasonDetails
+import kotlinx.collections.immutable.persistentListOf
+import kotlinx.collections.immutable.toPersistentList
 
 val episode = Episode(
     id = 2534997,
@@ -27,7 +29,7 @@ val seasonDetails = SeasonDetails(
     watchProgress = 0.4f,
     episodes = List(8) {
         episode
-    },
+    }.toPersistentList(),
 )
 
 class SeasonPreviewParameterProvider : PreviewParameterProvider<SeasonDetailsState> {
@@ -36,7 +38,7 @@ class SeasonPreviewParameterProvider : PreviewParameterProvider<SeasonDetailsSta
             return sequenceOf(
                 SeasonDetailsLoaded(
                     showTitle = "Loki",
-                    seasonDetailsList = listOf(seasonDetails),
+                    seasonDetailsList = persistentListOf(seasonDetails),
                 ),
                 LoadingError(message = "Something went Wrong "),
             )