Closes mozilla-mobile#26212: added UI feedback to the wallpaper downl…

…oading process
mavduevskiy · Aug 26, 2022 · 6d7496e · 6d7496e
1 parent f89203b
commit 6d7496e
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 6 deletions.
diff --git a/app/src/main/java/org/mozilla/fenix/components/appstate/AppStoreReducer.kt b/app/src/main/java/org/mozilla/fenix/components/appstate/AppStoreReducer.kt
@@ -201,7 +201,7 @@ internal object AppStoreReducer {
             )
         is AppAction.WallpaperAction.UpdateWallpaperDownloadState -> {
             val wallpapers = state.wallpaperState.availableWallpapers.map {
-                if (it == action.wallpaper) {
+                if (it.name == action.wallpaper.name) {
                     it.copy(assetsFileState = action.imageState)
                 } else {
                     it

diff --git a/app/src/main/java/org/mozilla/fenix/settings/wallpaper/WallpaperSettings.kt b/app/src/main/java/org/mozilla/fenix/settings/wallpaper/WallpaperSettings.kt
@@ -19,9 +19,11 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.verticalScroll
+import androidx.compose.material.CircularProgressIndicator
 import androidx.compose.material.Scaffold
 import androidx.compose.material.Snackbar
 import androidx.compose.material.SnackbarDuration
@@ -36,7 +38,9 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.asImageBitmap
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.LocalConfiguration
@@ -165,14 +169,16 @@ private fun WallpaperThumbnails(
                     for (columnIndex in 0 until numColumns) {
                         val itemIndex = rowIndex * numColumns + columnIndex
                         if (itemIndex < wallpapers.size) {
+                            val wallpaper = wallpapers[itemIndex]
                             Box(
                                 modifier = Modifier.weight(1f, fill = true).padding(4.dp),
                             ) {
                                 WallpaperThumbnailItem(
-                                    wallpaper = wallpapers[itemIndex],
+                                    wallpaper = wallpaper,
                                     defaultWallpaper = defaultWallpaper,
                                     loadWallpaperResource = loadWallpaperResource,
-                                    isSelected = selectedWallpaper == wallpapers[itemIndex],
+                                    isSelected = selectedWallpaper.name == wallpaper.name,
+                                    isLoading = wallpaper.assetsFileState == Wallpaper.ImageFileState.Downloading,
                                     onSelect = onSelectWallpaper
                                 )
                             }
@@ -201,6 +207,7 @@ private fun WallpaperThumbnailItem(
     defaultWallpaper: Wallpaper,
     loadWallpaperResource: suspend (Wallpaper) -> Bitmap?,
     isSelected: Boolean,
+    isLoading: Boolean,
     aspectRatio: Float = 1.1f,
     onSelect: (Wallpaper) -> Unit
 ) {
@@ -211,7 +218,12 @@ private fun WallpaperThumbnailItem(
     val thumbnailShape = RoundedCornerShape(8.dp)
     val border = if (isSelected) {
         Modifier.border(
-            BorderStroke(width = 2.dp, color = FirefoxTheme.colors.borderAccent),
+            BorderStroke(width = 3.dp, color = FirefoxTheme.colors.borderAccent),
+            thumbnailShape
+        )
+    } else if (wallpaper.name == Wallpaper.defaultName) {
+        Modifier.border(
+            BorderStroke(width = 1.dp, color = FirefoxTheme.colors.borderPrimary),
             thumbnailShape
         )
     } else {
@@ -239,8 +251,20 @@ private fun WallpaperThumbnailItem(
                     R.string.wallpapers_item_name_content_description, wallpaper.name
                 ),
                 modifier = Modifier.fillMaxSize(),
+                alpha = if (isLoading) 0.5f else 1.0f
             )
         }
+        if (isLoading) {
+            Box(
+                contentAlignment = Alignment.Center,
+                modifier = Modifier
+                    .size(24.dp)
+            ) {
+                CircularProgressIndicator(
+                    color = FirefoxTheme.colors.borderAccent
+                )
+            }
+        }
     }
 }
 

diff --git a/app/src/main/java/org/mozilla/fenix/settings/wallpaper/WallpaperSettingsFragment.kt b/app/src/main/java/org/mozilla/fenix/settings/wallpaper/WallpaperSettingsFragment.kt
@@ -49,7 +49,7 @@ class WallpaperSettingsFragment : Fragment() {
                         state.wallpaperState.currentWallpaper
                     }.value ?: Wallpaper.Default
 
-                    var coroutineScope = rememberCoroutineScope()
+                    val coroutineScope = rememberCoroutineScope()
 
                     WallpaperSettings(
                         wallpapers = wallpapers,

diff --git a/app/src/main/java/org/mozilla/fenix/wallpapers/WallpapersUseCases.kt b/app/src/main/java/org/mozilla/fenix/wallpapers/WallpapersUseCases.kt
@@ -449,7 +449,9 @@ class WallpapersUseCases(
          * @param wallpaper The selected wallpaper.
          */
         override suspend fun invoke(wallpaper: Wallpaper) {
-            if (fileManager.wallpaperImagesExist(wallpaper)) {
+            if (wallpaper.name == Wallpaper.defaultName ||
+                fileManager.wallpaperImagesExist(wallpaper)
+            ) {
                 selectWallpaper(wallpaper)
                 dispatchDownloadState(wallpaper, Wallpaper.ImageFileState.Downloaded)
             } else {