Updated Icon & Added Animation for Nearby (#6201)

* Applied better animation in nearby

* Refactor: Reduce Duration of Rotate Animation

Decreased the duration of the rotate animation from 1000ms to 500ms in `rotate.xml`, resulting in a faster rotation speed.

app/src/main/java/fr/free/nrw/commons/nearby/fragments/NearbyParentFragment.kt

@@ -46,6 +46,9 @@ import androidx.recyclerview.widget.DividerItemDecoration
 import androidx.recyclerview.widget.GridLayoutManager
 import androidx.recyclerview.widget.LinearLayoutManager
 import com.bumptech.glide.Glide
+import com.bumptech.glide.load.engine.GlideException
+import com.bumptech.glide.request.RequestListener
+import com.bumptech.glide.request.target.Target
 import com.google.android.material.bottomsheet.BottomSheetBehavior
 import com.google.android.material.bottomsheet.BottomSheetBehavior.BottomSheetCallback
 import com.google.android.material.snackbar.Snackbar
@@ -134,6 +137,7 @@ import java.util.UUID
 import java.util.concurrent.TimeUnit
 import javax.inject.Inject
 import javax.inject.Named
+import javax.sql.DataSource
 import kotlin.concurrent.Volatile
 
 
@@ -2353,12 +2357,50 @@ class NearbyParentFragment : CommonsDaggerSupportFragment(),
         selectedPlace?.pic?.substringAfterLast("/")?.takeIf { it.isNotEmpty() }?.let { imageName ->
             Glide.with(binding!!.bottomSheetDetails.icon.context)
                 .clear(binding!!.bottomSheetDetails.icon)
+
+            val loadingDrawable = ContextCompat.getDrawable(
+                binding!!.bottomSheetDetails.icon.context,
+                R.drawable.loading_icon
+            )
+            val animation = AnimationUtils.loadAnimation(
+                binding!!.bottomSheetDetails.icon.context,
+                R.anim.rotate
+            )
+
             Glide.with(binding!!.bottomSheetDetails.icon.context)
                 .load("https://commons.wikimedia.org/wiki/Special:Redirect/file/$imageName?width=25")
-                .placeholder(fr.free.nrw.commons.R.drawable.ic_refresh_24dp_nearby)
+                .placeholder(loadingDrawable)
                 .error(selectedPlace!!.label.icon)
+                .listener(object : RequestListener<Drawable> {
+                    override fun onLoadFailed(
+                        e: GlideException?,
+                        model: Any?,
+                        target: Target<Drawable>,
+                        isFirstResource: Boolean
+                    ): Boolean {
+                        binding!!.bottomSheetDetails.icon.clearAnimation()
+                        return false
+                    }
+
+                    override fun onResourceReady(
+                        resource: Drawable,
+                        model: Any,
+                        target: Target<Drawable>?,
+                        dataSource: com.bumptech.glide.load.DataSource,
+                        isFirstResource: Boolean
+                    ): Boolean {
+                        binding!!.bottomSheetDetails.icon.clearAnimation()
+                        return false
+                    }
+                })
                 .into(binding!!.bottomSheetDetails.icon)
 
+            if (binding!!.bottomSheetDetails.icon.drawable != null && binding!!.bottomSheetDetails.icon.drawable.constantState == loadingDrawable?.constantState) {
+                binding!!.bottomSheetDetails.icon.startAnimation(animation)
+            } else {
+                binding!!.bottomSheetDetails.icon.clearAnimation()
+            }
+
             binding!!.bottomSheetDetails.icon.setOnClickListener {
                 handleMediaClick(imageName)
             }

app/src/main/res/anim/rotate.xml

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<rotate
+  xmlns:android="http://schemas.android.com/apk/res/android"
+  android:fromDegrees="0"
+  android:toDegrees="360"
+  android:pivotX="50%"
+  android:pivotY="50%"
+  android:duration="500"
+  android:repeatCount="infinite"
+  android:interpolator="@android:anim/linear_interpolator"/>

app/src/main/res/drawable/loading_icon.xml

@@ -0,0 +1,49 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+  <item>
+    <vector
+      android:width="24dp"
+      android:height="24dp"
+      android:viewportWidth="24"
+      android:viewportHeight="24">
+      <path
+        android:pathData="M12,4 A8,8 0 1,1 4,12 A8,8 0 1,5 19.42 ,15"
+        android:strokeWidth="2"
+        android:strokeColor="#2196F3"
+        android:fillColor="#00000000"
+      android:trimPathStart="0.2"
+      android:trimPathEnd="1.0"/>
+    </vector>
+  </item>
+
+  <item>
+    <vector
+      android:width="24dp"
+      android:height="24dp"
+      android:viewportWidth="24"
+      android:viewportHeight="24">
+      <path
+        android:pathData="M12,4 A8,8 0 1,1 4,12 A8,8 0 1,1 12,4"
+        android:strokeWidth="2"
+        android:strokeColor="#FFFFFF"
+        android:fillColor="#00000000"
+      android:trimPathStart="0.0"
+      android:trimPathEnd="0.2"/>
+    </vector>
+  </item>
+
+  <item android:right="12dp">
+    <rotate
+      android:fromDegrees="0"
+      android:toDegrees="360"
+      android:pivotX="50%"
+      android:pivotY="50%">
+      <shape android:shape="ring">
+        <size
+          android:width="12dp"
+          android:height="2dp"/>
+        <solid android:color="#2196F3"/>
+      </shape>
+    </rotate>
+  </item>
+</layer-list>