Migrated to material 3 design (#20)

rob729 · Nov 19, 2023 · 3216408 · 3216408
1 parent e383df3
commit 3216408
Show file tree

Hide file tree

Showing 31 changed files with 3,020 additions and 2,734 deletions.
diff --git a/.gitignore b/.gitignore
@@ -7,11 +7,11 @@
 /.idea/workspace.xml
 /.idea/navEditor.xml
 /.idea/assetWizardSettings.xml
+/.idea
 .DS_Store
 /build
 /captures
 .externalNativeBuild
 .cxx
 local.properties
-.idea
 app/release
diff --git a/.idea/androidTestResultsUserPreferences.xml b/.idea/androidTestResultsUserPreferences.xml
diff --git a/.idea/deploymentTargetDropDown.xml b/.idea/deploymentTargetDropDown.xml
diff --git a/app/build.gradle b/app/build.gradle
@@ -88,7 +88,6 @@ dependencies {
     implementation libs.androidx.core.ktx
     implementation platform(libs.compose.bom)
     implementation libs.compose.ui
-    implementation libs.androidx.compose.material
     implementation libs.androidx.compose.ui.tooling.preview
     implementation libs.androidx.lifecycle.runtime.ktx
     implementation libs.androidx.activity.compose

diff --git a/app/release/app-release.apk b/app/release/app-release.apk
diff --git a/app/src/main/baselineProfiles/baseline-prof.txt b/app/src/main/baselineProfiles/baseline-prof.txt
diff --git a/app/src/main/baselineProfiles/startup-prof.txt b/app/src/main/baselineProfiles/startup-prof.txt
diff --git a/app/src/main/java/com/rob729/newsfeed/initalizers/NewsSourceImagesPrefetch.kt b/app/src/main/java/com/rob729/newsfeed/initalizers/NewsSourceImagesPrefetch.kt
@@ -7,7 +7,7 @@ import androidx.work.WorkManager
 import androidx.work.WorkManagerInitializer
 import com.rob729.newsfeed.workManager.NewsSourceImagePrefetch
 
-class NewsSourceImagesPrefetch: Initializer<Unit> {
+class NewsSourceImagesPrefetch : Initializer<Unit> {
     override fun create(context: Context) {
         val newsSourceImagePreloadRequest = OneTimeWorkRequestBuilder<NewsSourceImagePrefetch>()
             .build()

diff --git a/app/src/main/java/com/rob729/newsfeed/model/state/UiStatus.kt b/app/src/main/java/com/rob729/newsfeed/model/state/UiStatus.kt
@@ -3,9 +3,9 @@ package com.rob729.newsfeed.model.state
 import com.rob729.newsfeed.model.ui.NewsArticleUiData
 
 sealed class UiStatus {
-    data class Success(val news: List<NewsArticleUiData>): UiStatus()
-    data object Loading: UiStatus()
-    data object Error: UiStatus()
+    data class Success(val news: List<NewsArticleUiData>) : UiStatus()
+    data object Loading : UiStatus()
+    data object Error : UiStatus()
 
-    data object EmptyScreen: UiStatus()
+    data object EmptyScreen : UiStatus()
 }
diff --git a/app/src/main/java/com/rob729/newsfeed/model/state/home/HomeFeedSideEffect.kt b/app/src/main/java/com/rob729/newsfeed/model/state/home/HomeFeedSideEffect.kt
@@ -1,8 +1,8 @@
 package com.rob729.newsfeed.model.state.home
 
 sealed class HomeFeedSideEffect {
-    data class HomeSourceClicked(val domain: String) : HomeFeedSideEffect()
-    data class HomeFeedItemClicked(val selectedItemUrl: String) : HomeFeedSideEffect()
-    data object HomeSourceFabClicked : HomeFeedSideEffect()
+    data class NewsSourceClicked(val domain: String) : HomeFeedSideEffect()
+    data class FeedItemClicked(val selectedItemUrl: String) : HomeFeedSideEffect()
+    data object NewsSourceFabClicked : HomeFeedSideEffect()
     data object ScrollToTopClicked : HomeFeedSideEffect()
 }
diff --git a/app/src/main/java/com/rob729/newsfeed/model/state/search/SearchSideEffects.kt b/app/src/main/java/com/rob729/newsfeed/model/state/search/SearchSideEffects.kt
@@ -3,5 +3,5 @@ package com.rob729.newsfeed.model.state.search
 sealed class SearchSideEffects {
     data class SearchResultClicked(val selectedResultUrl: String) : SearchSideEffects()
 
-    data class SearchQueryChanged(val query: String): SearchSideEffects()
+    data class SearchQueryChanged(val query: String) : SearchSideEffects()
 }
diff --git a/app/src/main/java/com/rob729/newsfeed/ui/NewsActivity.kt b/app/src/main/java/com/rob729/newsfeed/ui/NewsActivity.kt
@@ -21,16 +21,12 @@ import androidx.core.content.ContextCompat
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
 import androidx.navigation.compose.rememberNavController
-import com.rob729.newsfeed.BuildConfig
 import com.rob729.newsfeed.R
 import com.rob729.newsfeed.ui.screen.HomeScreen
 import com.rob729.newsfeed.ui.screen.SearchScreen
 import com.rob729.newsfeed.ui.theme.NewsFeedTheme
 import com.rob729.newsfeed.utils.Constants
 import com.rob729.newsfeed.utils.NotificationHelper
-import com.rob729.newsfeed.vm.HomeViewModel
-import com.rob729.newsfeed.vm.SearchViewModel
-import org.koin.androidx.viewmodel.ext.android.viewModel
 
 @OptIn(ExperimentalComposeUiApi::class)
 class NewsActivity : ComponentActivity() {

diff --git a/app/src/main/java/com/rob729/newsfeed/ui/bottomSheet/NewsSourceBottomSheet.kt b/app/src/main/java/com/rob729/newsfeed/ui/bottomSheet/NewsSourceBottomSheet.kt
@@ -0,0 +1,38 @@
+package com.rob729.newsfeed.ui.bottomSheet
+
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.ModalBottomSheet
+import androidx.compose.material3.SheetState
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.ExperimentalComposeUiApi
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.testTag
+import androidx.compose.ui.semantics.semantics
+import androidx.compose.ui.semantics.testTagsAsResourceId
+import com.rob729.newsfeed.ui.components.NewsSourceBottomSheetContent
+
+@OptIn(ExperimentalMaterial3Api::class, ExperimentalComposeUiApi::class)
+@Composable
+fun NewsSourceBottomSheet(
+    bottomSheetState: SheetState,
+    isBottomSheetVisible: Boolean,
+    onNewsSourceClicked: (String) -> Unit,
+    selectedNewsSource: String,
+    onDismissRequest: () -> Unit
+) {
+
+    if (isBottomSheetVisible) {
+        ModalBottomSheet(
+            modifier = Modifier.semantics { testTagsAsResourceId = true },
+            sheetState = bottomSheetState,
+            scrimColor = Color.Black.copy(alpha = 0.6f),
+            onDismissRequest = onDismissRequest
+        ) {
+            NewsSourceBottomSheetContent(
+                onNewsSourceClicked = onNewsSourceClicked,
+                currentSelectedNewsSource = selectedNewsSource
+            )
+        }
+    }
+}
diff --git a/app/src/main/java/com/rob729/newsfeed/ui/components/FloatingActionButtons.kt b/app/src/main/java/com/rob729/newsfeed/ui/components/FloatingActionButtons.kt
@@ -1,19 +1,19 @@
 package com.rob729.newsfeed.ui.components
 
-import androidx.compose.material.Icon
-import androidx.compose.material.Text
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.KeyboardArrowUp
 import androidx.compose.material.icons.filled.Newspaper
 import androidx.compose.material3.ExtendedFloatingActionButton
 import androidx.compose.material3.FloatingActionButtonDefaults
+import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.SmallFloatingActionButton
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.unit.dp
-import com.rob729.newsfeed.R
 import com.rob729.newsfeed.utils.Constants
 
 @Composable
@@ -31,7 +31,8 @@ fun NewsSourceExtendedFab(modifier: Modifier, isExpanded: Boolean, onClick: () -
         },
         elevation = FloatingActionButtonDefaults.elevation(8.dp),
         expanded = isExpanded,
-        containerColor = colorResource(R.color.status_bar)
+        containerColor = MaterialTheme.colorScheme.secondaryContainer,
+        shape = RoundedCornerShape(12.dp)
     )
 }
 
@@ -40,7 +41,8 @@ fun ScrollToTopFab(modifier: Modifier, onClick: () -> Unit) {
     SmallFloatingActionButton(
         modifier = modifier,
         onClick = onClick,
-        containerColor = colorResource(R.color.status_bar)
+        containerColor = MaterialTheme.colorScheme.secondaryContainer,
+        shape = RoundedCornerShape(12.dp)
     ) {
         Icon(
             imageVector = Icons.Default.KeyboardArrowUp,

diff --git a/app/src/main/java/com/rob729/newsfeed/ui/components/NewsFeedItem.kt b/app/src/main/java/com/rob729/newsfeed/ui/components/NewsFeedItem.kt
@@ -15,12 +15,12 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Icon
-import androidx.compose.material.Surface
-import androidx.compose.material.Text
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Schedule
 import androidx.compose.material.icons.filled.Share
+import androidx.compose.material3.Icon
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
@@ -62,15 +62,15 @@ fun NewsFeedItem(
     )
 
     Surface(
-        modifier
+        modifier = modifier
             .padding(8.dp)
             .clickable(
                 interactionSource = interactionSource,
                 indication = null,
                 onClick = onItemClick
             )
             .scale(scale),
-        elevation = 4.dp,
+        tonalElevation = 4.dp,
         shape = RoundedCornerShape(12.dp)
     ) {
         Column {
@@ -99,7 +99,8 @@ fun NewsFeedItem(
                     .fillMaxWidth(),
                 textAlign = TextAlign.Center,
                 overflow = TextOverflow.Ellipsis,
-                fontFamily = lexendDecaFontFamily
+                fontFamily = lexendDecaFontFamily,
+                lineHeight = 22.sp
             )
             Text(
                 text = newsArticleUiData.description,
@@ -108,7 +109,8 @@ fun NewsFeedItem(
                 modifier = Modifier.padding(horizontal = 12.dp, vertical = 8.dp),
                 fontSize = 12.sp,
                 overflow = TextOverflow.Ellipsis,
-                fontFamily = lexendDecaFontFamily
+                fontFamily = lexendDecaFontFamily,
+                lineHeight = 18.sp
             )
             Row(
                 modifier = Modifier

diff --git a/app/src/main/java/com/rob729/newsfeed/ui/components/NewsSourceBottomSheetContent.kt b/app/src/main/java/com/rob729/newsfeed/ui/components/NewsSourceBottomSheetContent.kt
@@ -7,7 +7,7 @@ import android.os.Vibrator
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.foundation.lazy.LazyRow
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -31,13 +31,13 @@ fun NewsSourceBottomSheetContent(
     val itemWidth = (screenWidthDp - (itemSpacing * visibleCards)).div(visibleCards)
 
     Box(
+        modifier = Modifier.navigationBarsPadding(),
         contentAlignment = Alignment.Center
     ) {
         Column {
             LazyRow(
                 modifier = Modifier
-                    .testTag("news_source_list")
-                    .padding(top = 12.dp, bottom = 6.dp),
+                    .testTag("news_source_list"),
                 horizontalArrangement = Arrangement.spacedBy(itemSpacing.dp)
             ) {
                 items(Constants.newsSourceUiDataLists.size,

diff --git a/app/src/main/java/com/rob729/newsfeed/ui/components/NewsSourcePill.kt b/app/src/main/java/com/rob729/newsfeed/ui/components/NewsSourcePill.kt
@@ -1,16 +1,12 @@
 package com.rob729.newsfeed.ui.components
 
 import androidx.compose.foundation.BorderStroke
-import androidx.compose.foundation.background
 import androidx.compose.foundation.border
 import androidx.compose.foundation.clickable
-import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -39,19 +35,6 @@ fun NewsSourcePill(
         horizontalAlignment = Alignment.CenterHorizontally
     ) {
 
-        Box(
-            modifier = Modifier
-                .height(6.dp)
-                .width(45.dp)
-                .background(
-                    color = if (isSelected) colorResource(R.color.status_bar) else Color.Transparent,
-                    shape = RoundedCornerShape(16.dp)
-                )
-                .align(Alignment.CenterHorizontally)
-        )
-
-        Spacer(modifier = Modifier.height(4.dp))
-
         AsyncImage(
             model = imageUrl,
             contentDescription = null,

diff --git a/app/src/main/java/com/rob729/newsfeed/ui/components/ShimmerListItem.kt b/app/src/main/java/com/rob729/newsfeed/ui/components/ShimmerListItem.kt
@@ -8,7 +8,8 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Card
+import androidx.compose.material3.Card
+import androidx.compose.material3.CardDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
@@ -19,8 +20,8 @@ import androidx.compose.ui.unit.dp
 fun ShimmerListItem(brush: Brush) {
 
     Card(
-        Modifier.padding(start = 8.dp, end = 8.dp, top = 8.dp),
-        elevation = 4.dp,
+        modifier = Modifier.padding(start = 8.dp, end = 8.dp, top = 8.dp),
+        elevation = CardDefaults.cardElevation(4.dp),
         shape = RoundedCornerShape(8.dp)
     ) {
         Column(

diff --git a/app/src/main/java/com/rob729/newsfeed/ui/components/Toolbar.kt b/app/src/main/java/com/rob729/newsfeed/ui/components/Toolbar.kt
@@ -4,11 +4,11 @@ import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.Icon
-import androidx.compose.material.Surface
-import androidx.compose.material.Text
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Search
+import androidx.compose.material3.Icon
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -26,7 +26,7 @@ import com.rob729.newsfeed.utils.Constants
 
 @Composable
 fun Toolbar(toolbarElevation: Dp, onSearchClick: () -> Unit) {
-    Surface(elevation = toolbarElevation, color = colorResource(R.color.status_bar)) {
+    Surface(tonalElevation = toolbarElevation, color = colorResource(R.color.status_bar)) {
         Row(modifier = Modifier.fillMaxWidth(), verticalAlignment = Alignment.CenterVertically) {
             Text(
                 text = Constants.TOOLBAR_TITLE,
@@ -40,10 +40,15 @@ fun Toolbar(toolbarElevation: Dp, onSearchClick: () -> Unit) {
                 color = Color.White
             )
 
-            Icon(imageVector = Icons.Default.Search , contentDescription = "Search", tint = Color.White,
-                modifier = Modifier.padding(end = 12.dp).testTag("search_icon").clickable {
-                    onSearchClick()
-                })
+            Icon(imageVector = Icons.Default.Search,
+                contentDescription = "Search",
+                tint = Color.White,
+                modifier = Modifier
+                    .padding(end = 12.dp)
+                    .testTag("search_icon")
+                    .clickable {
+                        onSearchClick()
+                    })
         }
     }
 }