[Audio player] Indefinite progress while loading thumbnails

app/src/main/java/com/github/libretube/ui/fragments/AudioPlayerFragment.kt

@@ -148,11 +148,22 @@ class AudioPlayerFragment : BaseFragment() {
             NavigationHelper.navigateChannel(requireContext(), current.uploaderUrl?.toID())
         }
 
-        ImageHelper.loadImage(current.thumbnail, binding.thumbnail)
+        current.thumbnail?.let { updateThumbnailAsync(it) }
 
         initializeSeekBar()
     }
 
+    private fun updateThumbnailAsync(thumbnailUrl: String) {
+        binding.progress.visibility = View.VISIBLE
+        binding.thumbnail.visibility = View.GONE
+
+        ImageHelper.getAsync(requireContext(), thumbnailUrl) {
+            binding.thumbnail.setImageBitmap(it)
+            binding.thumbnail.visibility = View.VISIBLE
+            binding.progress.visibility = View.GONE
+        }
+    }
+
     private fun initializeSeekBar() {
         binding.timeBar.addOnChangeListener { _, value, fromUser ->
             if (fromUser) playerService?.seekToPosition(value.toLong() * 1000)

app/src/main/java/com/github/libretube/util/ImageHelper.kt

@@ -56,12 +56,17 @@ object ImageHelper {
     }
 
     fun downloadImage(context: Context, url: String, path: String) {
+        getAsync(context, url) { bitmap ->
+            saveImage(context, bitmap, Uri.fromFile(File(path)))
+        }
+    }
+
+    fun getAsync(context: Context, url: String?, onSuccess: (Bitmap) -> Unit) {
         val request = ImageRequest.Builder(context)
             .data(url)
             .target { result ->
                 val bitmap = (result as BitmapDrawable).bitmap
-                val file = File(path)
+                onSuccess.invoke(bitmap)
-                saveImage(context, bitmap, Uri.fromFile(file))
             }
             .build()
 

app/src/main/res/layout/fragment_audio_player.xml

@@ -23,6 +23,12 @@
             app:shapeAppearanceOverlay="@style/ShapeAppearance.Material3.Corner.Small"
             tools:src="@tools:sample/backgrounds/scenic" />
 
+        <ProgressBar
+            android:id="@+id/progress"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center" />
+
     </FrameLayout>
 
     <LinearLayout
@@ -33,21 +39,21 @@
 
         <TextView
             android:id="@+id/title"
-            android:layout_width="wrap_content"
+            android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:layout_gravity="center"
             android:ellipsize="marquee"
             android:marqueeRepeatLimit="marquee_forever"
             android:scrollHorizontally="true"
             android:singleLine="true"
+            android:textAlignment="center"
             android:textSize="24sp" />
 
         <TextView
             android:id="@+id/uploader"
-            android:layout_width="wrap_content"
+            android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:layout_gravity="center"
             android:layout_marginTop="10dp"
+            android:textAlignment="center"
             android:textSize="18sp" />
 
     </LinearLayout>
@@ -84,7 +90,7 @@
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="center"
-        android:layout_marginTop="24dp"
+        android:layout_marginTop="10dp"
         android:layout_marginBottom="36dp">
 
         <ImageView
@@ -124,8 +130,8 @@
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="center"
-        app:cardCornerRadius="18dp"
+        android:layout_marginBottom="30dp"
-        android:layout_marginBottom="30dp">
+        app:cardCornerRadius="18dp">
 
         <LinearLayout
             android:layout_width="wrap_content"