Merge pull request #123 from imashnake0/home-mediapage-cleanup

Cleanup `HomeScreen` and `MediaPage`

app/src/main/java/com/imashnake/animite/features/RootNavGraph.kt

@@ -1,6 +1,6 @@
 package com.imashnake.animite.features
 
-import com.imashnake.animite.features.destinations.HomeDestination
+import com.imashnake.animite.features.destinations.HomeScreenDestination
 import com.imashnake.animite.features.destinations.MediaPageDestination
 import com.imashnake.animite.profile.ProfileNavGraph
 import com.imashnake.animite.rslash.RslashNavGraph
@@ -13,11 +13,11 @@ object RootNavGraph : NavGraphSpec {
 
     // TODO Once Home is refactored to a module, turn off compose-destinations code gen for app module
     override val destinationsByRoute: Map<String, DestinationSpec<*>> = mapOf(
-        HomeDestination.route to HomeDestination,
+        HomeScreenDestination.route to HomeScreenDestination,
         MediaPageDestination.route to MediaPageDestination
     )
 
-    override val startRoute: Route = HomeDestination
+    override val startRoute: Route = HomeScreenDestination
 
     override val nestedNavGraphs: List<NavGraphSpec> = listOf(
         ProfileNavGraph,

app/src/main/java/com/imashnake/animite/features/home/Home.kt → app/src/main/java/com/imashnake/animite/features/home/HomeScreen.kt

@@ -44,13 +44,14 @@ import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.res.vectorResource
 import androidx.compose.ui.unit.dp
+import androidx.compose.ui.util.fastForEach
 import androidx.hilt.navigation.compose.hiltViewModel
 import com.imashnake.animite.api.anilist.sanitize.media.Media
 import com.imashnake.animite.api.anilist.type.MediaType
 import com.imashnake.animite.core.extensions.bannerParallax
 import com.imashnake.animite.core.extensions.landscapeCutoutPadding
 import com.imashnake.animite.core.ui.ProgressIndicator
-import com.imashnake.animite.core.ui.TranslucentStatusBarLayout
+import com.imashnake.animite.core.ui.layouts.TranslucentStatusBarLayout
 import com.imashnake.animite.core.data.Resource
 import com.imashnake.animite.features.destinations.MediaPageDestination
 import com.imashnake.animite.features.media.MediaPageArgs
@@ -64,7 +65,7 @@ import com.imashnake.animite.core.ui.LocalPaddings
 @Destination
 @Composable
 @Suppress("LongMethod")
-fun Home(
+fun HomeScreen(
     viewModel: HomeViewModel = hiltViewModel(),
     navigator: DestinationsNavigator
 ) {
@@ -76,12 +77,15 @@ fun Home(
     val upcomingList by viewModel.upcomingMediaNextSeason.collectAsState()
     val allTimePopularList by viewModel.allTimePopular.collectAsState()
 
-    // TODO: [Code Smells: If Statements](https://dzone.com/articles/code-smells-if-statements).
+    val rows = listOf(
+        trendingList to stringResource(R.string.trending_now),
+        popularList to stringResource(R.string.popular_this_season),
+        upcomingList to stringResource(R.string.upcoming_next_season),
+        allTimePopularList to stringResource(R.string.all_time_popular)
+    )
+
     when {
-        trendingList is Resource.Success &&
-        popularList is Resource.Success &&
-        upcomingList is Resource.Success &&
-        allTimePopularList is Resource.Success -> {
+        rows.all { it.first is Resource.Success } -> {
             val scrollState = rememberScrollState()
             TranslucentStatusBarLayout(
                 scrollState = scrollState,
@@ -121,7 +125,9 @@ fun Home(
                         ) { }
 
                         Row(
-                            modifier = Modifier.fillMaxWidth().align(Alignment.BottomCenter),
+                            modifier = Modifier
+                                .fillMaxWidth()
+                                .align(Alignment.BottomCenter),
                             horizontalArrangement = Arrangement.SpaceBetween,
                             verticalAlignment = Alignment.CenterVertically
                         ) {
@@ -163,73 +169,24 @@ fun Home(
                                 .padding(bottom = dimensionResource(R.dimen.navigation_bar_height)),
                             verticalArrangement = Arrangement.spacedBy(LocalPaddings.current.large)
                         ) {
-                            HomeRow(
-                                list = trendingList.data.orEmpty(),
-                                title = stringResource(R.string.trending_now),
-                                onItemClicked = {
-                                    navigator.navigate(
-                                        MediaPageDestination(
-                                            MediaPageArgs(
-                                                it.id,
-                                                homeMediaType.value.rawValue
-                                            )
-                                        )
-                                    ) {
-                                        launchSingleTop = true
-                                    }
-                                }
-                            )
-
-                            HomeRow(
-                                list = popularList.data.orEmpty(),
-                                title = stringResource(R.string.popular_this_season),
-                                onItemClicked = {
-                                    navigator.navigate(
-                                        MediaPageDestination(
-                                            MediaPageArgs(
-                                                it.id,
-                                                homeMediaType.value.rawValue
+                            rows.fastForEach { row ->
+                                HomeRow(
+                                    list = row.first.data.orEmpty(),
+                                    title = row.second,
+                                    onItemClicked = {
+                                        navigator.navigate(
+                                            MediaPageDestination(
+                                                MediaPageArgs(
+                                                    it.id,
+                                                    homeMediaType.value.rawValue
+                                                )
                                             )
-                                        )
-                                    ) {
-                                        launchSingleTop = true
+                                        ) {
+                                            launchSingleTop = true
+                                        }
                                     }
-                                }
-                            )
-
-                            HomeRow(
-                                list = upcomingList.data.orEmpty(),
-                                title = stringResource(R.string.upcoming_next_season),
-                                onItemClicked = {
-                                    navigator.navigate(
-                                        MediaPageDestination(
-                                            MediaPageArgs(
-                                                it.id,
-                                                homeMediaType.value.rawValue
-                                            )
-                                        )
-                                    ) {
-                                        launchSingleTop = true
-                                    }
-                                }
-                            )
-
-                            HomeRow(
-                                list = allTimePopularList.data.orEmpty(),
-                                title = stringResource(R.string.all_time_popular),
-                                onItemClicked = {
-                                    navigator.navigate(
-                                        MediaPageDestination(
-                                            MediaPageArgs(
-                                                it.id,
-                                                homeMediaType.value.rawValue
-                                            )
-                                        )
-                                    ) {
-                                        launchSingleTop = true
-                                    }
-                                }
-                            )
+                                )
+                            }
                         }
                     }
                 }
@@ -257,7 +214,10 @@ fun HomeRow(
     modifier: Modifier = Modifier
 ) {
     if (list.isNotEmpty()) {
-        Column(modifier) {
+        Column(
+            modifier = modifier,
+            verticalArrangement = Arrangement.spacedBy(LocalPaddings.current.medium)
+        ) {
             Text(
                 text = title,
                 style = MaterialTheme.typography.titleMedium,
@@ -266,8 +226,6 @@ fun HomeRow(
                     .landscapeCutoutPadding()
             )
 
-            Spacer(Modifier.size(LocalPaddings.current.medium))
-
             MediaSmallRow(
                 mediaList = list,
                 content = { media ->

app/src/main/java/com/imashnake/animite/features/media/MediaPage.kt

@@ -15,7 +15,6 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.asPaddingValues
 import androidx.compose.foundation.layout.aspectRatio
@@ -26,7 +25,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.statusBars
 import androidx.compose.foundation.layout.statusBarsPadding
 import androidx.compose.foundation.layout.width
@@ -37,7 +35,6 @@ import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.ContentAlpha
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.SuggestionChip
 import androidx.compose.material3.SuggestionChipDefaults
@@ -76,11 +73,12 @@ import com.imashnake.animite.core.extensions.bannerParallax
 import com.imashnake.animite.core.extensions.landscapeCutoutPadding
 import com.imashnake.animite.core.ui.LocalPaddings
 import com.imashnake.animite.core.ui.NestedScrollableContent
-import com.imashnake.animite.core.ui.TranslucentStatusBarLayout
+import com.imashnake.animite.core.ui.layouts.TranslucentStatusBarLayout
 import com.imashnake.animite.dev.internal.Constants
 import com.imashnake.animite.features.ui.MediaSmall
 import com.imashnake.animite.features.ui.MediaSmallRow
 import com.ramcosta.composedestinations.annotation.Destination
+import com.imashnake.animite.core.R as coreR
 
 @Destination(navArgsDelegate = MediaPageArgs::class)
 @Composable
@@ -97,7 +95,6 @@ fun MediaPage(
     val media = viewModel.uiState
 
     MaterialTheme(colorScheme = rememberColorSchemeFor(color = media.color)) {
-        // TODO: [Add shimmer](https://google.github.io/accompanist/placeholder/).
         TranslucentStatusBarLayout(
             scrollState = scrollState,
             distanceUntilAnimated = bannerHeight,
@@ -129,7 +126,8 @@ fun MediaPage(
                     MediaDetails(
                         title = media.title.orEmpty(),
                         description = media.description.orEmpty(),
-                        // TODO Can we do something about this Modifier chain?
+                        // TODO: Can we do something about this Modifier chain?
+                        //  Fix this in a follow up PR with `BannerLayout`.
                         modifier = Modifier
                             .padding(
                                 start = LocalPaddings.current.large
@@ -199,8 +197,7 @@ fun MediaPage(
                         .statusBarsPadding()
                         .padding(
                             top = dimensionResource(R.dimen.media_card_top_padding),
-                            start = LocalPaddings.current.large,
-                            end = LocalPaddings.current.large
+                            start = LocalPaddings.current.large
                         )
                         .landscapeCutoutPadding()
                 ) {
@@ -258,9 +255,7 @@ fun MediaDetails(
     description: String,
     modifier: Modifier = Modifier
 ) {
-    val textColor = MaterialTheme.colorScheme.onBackground.copy(
-        alpha = ContentAlpha.medium
-    ).toArgb()
+    val textColor = MaterialTheme.colorScheme.onBackground.copy(alpha = 0.74f).toArgb()
 
     val html = remember(description) {
         HtmlCompat.fromHtml(description, HtmlCompat.FROM_HTML_MODE_LEGACY)
@@ -279,13 +274,15 @@ fun MediaDetails(
             // TODO: Get rid of this once Compose supports HTML/Markdown
             //  https://issuetracker.google.com/issues/139326648
             AndroidView(
-                factory = {
-                    TextView(it).apply {
+                factory = { context ->
+                    TextView(context).apply {
                         movementMethod = LinkMovementMethod.getInstance()
                         setTextColor(textColor)
                         textSize = 14f
                         // This is needed since `FontFamily` can't be used with `AndroidView`.
-                        typeface = ResourcesCompat.getFont(it, com.imashnake.animite.core.R.font.manrope_medium)
+                        typeface = ResourcesCompat.getFont(
+                            context, coreR.font.manrope_medium
+                        )
                     }
                 },
                 update = { it.text = html },
@@ -337,9 +334,7 @@ fun MediaGenres(
     color: Color = MaterialTheme.colorScheme.primaryContainer
 ) {
     LazyRow(
-        horizontalArrangement = Arrangement.spacedBy(
-            LocalPaddings.current.medium
-        ),
+        horizontalArrangement = Arrangement.spacedBy(LocalPaddings.current.medium),
         contentPadding = contentPadding,
         modifier = modifier
     ) {
@@ -372,7 +367,10 @@ fun MediaCharacters(
     modifier: Modifier = Modifier,
     contentPadding: PaddingValues = PaddingValues()
 ) {
-    Column(modifier) {
+    Column(
+        modifier = modifier,
+        verticalArrangement = Arrangement.spacedBy(LocalPaddings.current.medium)
+    ) {
         Text(
             text = stringResource(R.string.characters),
             color = MaterialTheme.colorScheme.onBackground,
@@ -382,11 +380,7 @@ fun MediaCharacters(
                 .landscapeCutoutPadding()
         )
 
-        Spacer(Modifier.size(LocalPaddings.current.medium))
-
-        MediaSmallRow(
-            mediaList = characters
-        ) { character ->
+        MediaSmallRow(characters) { character ->
             MediaSmall(
                 image = character.image,
                 label = character.name,
@@ -402,15 +396,16 @@ fun MediaTrailer(
     trailer: Media.Trailer,
     modifier: Modifier = Modifier
 ) {
-    Column(modifier) {
+    Column(
+        modifier = modifier,
+        verticalArrangement = Arrangement.spacedBy(LocalPaddings.current.medium)
+    ) {
         Text(
             text = stringResource(R.string.trailer),
             color = MaterialTheme.colorScheme.onBackground,
             style = MaterialTheme.typography.titleMedium
         )
 
-        Spacer(Modifier.size(LocalPaddings.current.medium))
-
         val context = LocalContext.current
         Box(
             modifier = Modifier
@@ -446,10 +441,8 @@ fun MediaTrailer(
                 contentScale = ContentScale.FillWidth,
                 modifier = Modifier
                     .fillMaxWidth()
-                    .aspectRatio(1.778f) // 16 : 9
-                    .clip(
-                        RoundedCornerShape(dimensionResource(R.dimen.trailer_corner_radius))
-                    ),
+                    .aspectRatio(16f / 9)
+                    .clip(RoundedCornerShape(dimensionResource(R.dimen.trailer_corner_radius))),
                 alignment = Alignment.Center
             )
 

app/src/main/java/com/imashnake/animite/features/navigationbar/NavigationBar.kt

@@ -25,7 +25,7 @@ import androidx.compose.ui.res.vectorResource
 import androidx.compose.ui.unit.dp
 import androidx.navigation.NavController
 import androidx.navigation.NavGraph.Companion.findStartDestination
-import com.imashnake.animite.features.destinations.HomeDestination
+import com.imashnake.animite.features.destinations.HomeScreenDestination
 import com.imashnake.animite.profile.ProfileNavGraph
 import com.imashnake.animite.rslash.RslashNavGraph
 import com.ramcosta.composedestinations.spec.DestinationSpec
@@ -96,7 +96,7 @@ enum class NavigationBarPaths(
         }
     ),
     Home(
-        HomeDestination,
+        HomeScreenDestination,
         {
             Icon(
                 imageVector = ImageVector.vectorResource(

app/src/main/res/values/strings.xml

@@ -12,7 +12,6 @@
     <string name="all_time_popular">All Time Popular</string>
 
     <!-- MediaPage -->
-    <string name="score">SCORE</string>
     <string name="characters">Characters</string>
     <string name="trailer">Trailer</string>
 

core/src/main/kotlin/com/imashnake/animite/core/ui/TranslucentStatusBarLayout.kt → core/src/main/kotlin/com/imashnake/animite/core/ui/layouts/TranslucentStatusBarLayout.kt

@@ -1,4 +1,4 @@
-package com.imashnake.animite.core.ui
+package com.imashnake.animite.core.ui.layouts
 
 import androidx.compose.foundation.ScrollState
 import androidx.compose.foundation.layout.Box