Merge pull request #105 from c0de-wizard/fix-loading-images

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 "),
  )