QuickEditor: Update the Avatar's menu UI (#561)

* Change the Rating item label to Rating: {current}

* Add arrow to indicate submenu

* Move download option to the top

* Remove unused translated string resource

* Rename the label to a proper name

gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/components/AvatarMoreOptionsPickerPopup.kt

@@ -25,50 +25,61 @@ internal fun AvatarMoreOptionsPickerPopup(
     onDismissRequest: () -> Unit,
     onAvatarOptionClicked: (AvatarOption) -> Unit,
 ) {
+    val ratingItemLabel = stringResource(
+        R.string.gravatar_qe_selectable_avatar_more_options_rating_v2,
+        avatarRating.firstOrNull { it.selected }?.rating?.value.orEmpty(),
+    )
     PickerPopup(
         anchorAlignment = anchorAlignment,
         offset = offset,
         onDismissRequest = onDismissRequest,
         popupMenu = PickerPopupMenu(
             items = listOf(
+                PickerPopupItem(
+                    text = stringResource(R.string.gravatar_qe_selectable_avatar_more_options_download_image),
+                    iconRes = R.drawable.gravatar_avatar_more_options_download,
+                    contentDescription = stringResource(
+                        R.string.gravatar_qe_selectable_avatar_more_options_download_image,
+                    ),
+                    onClick = {
+                        onAvatarOptionClicked(AvatarOption.DownloadImage)
+                    },
+                ),
                 PickerPopupItem(
                     text = stringResource(R.string.gravatar_qe_selectable_avatar_more_options_alt_text),
                     iconRes = R.drawable.gravatar_avatar_more_options_alt_text,
-                    contentDescription =
+                    contentDescription = stringResource(
                         R.string.gravatar_qe_selectable_avatar_more_options_alt_text_content_description,
+                    ),
                     onClick = {
                         onAvatarOptionClicked(AvatarOption.AltText)
                     },
                 ),
                 PickerPopupItem(
-                    text = stringResource(R.string.gravatar_qe_selectable_avatar_more_options_rating),
+                    text = ratingItemLabel,
                     iconRes = R.drawable.gravatar_avatar_more_options_rating,
-                    contentDescription = R.string.gravatar_qe_selectable_avatar_more_options_rating,
+                    contentDescription = ratingItemLabel,
                     subMenu = PickerPopupMenu(
                         items = avatarRating.map { (rating, selected) ->
                             PickerPopupItem(
                                 text = stringResource(rating.fullNameRes),
                                 iconRes = if (selected) R.drawable.ic_checkmark else null,
-                                contentDescription = R.string.gravatar_qe_avatar_rating_selected_content_description,
+                                contentDescription = stringResource(
+                                    R.string.gravatar_qe_avatar_rating_selected_content_description,
+                                ),
                                 onClick = {
                                     onAvatarOptionClicked(AvatarOption.Rating(rating))
                                 },
                             )
                         },
                     ),
                 ),
-                PickerPopupItem(
-                    text = stringResource(R.string.gravatar_qe_selectable_avatar_more_options_download_image),
-                    iconRes = R.drawable.gravatar_avatar_more_options_download,
-                    contentDescription = R.string.gravatar_qe_selectable_avatar_more_options_download_image,
-                    onClick = {
-                        onAvatarOptionClicked(AvatarOption.DownloadImage)
-                    },
-                ),
                 PickerPopupItem(
                     text = stringResource(R.string.gravatar_qe_selectable_avatar_more_options_delete),
                     iconRes = R.drawable.gravatar_avatar_more_options_delete,
-                    contentDescription = R.string.gravatar_qe_selectable_avatar_more_options_delete_content_description,
+                    contentDescription = stringResource(
+                        R.string.gravatar_qe_selectable_avatar_more_options_delete_content_description,
+                    ),
                     contentColor = MaterialTheme.colorScheme.error,
                     onClick = {
                         onAvatarOptionClicked(AvatarOption.Delete)

gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/components/MediaPickerPopup.kt

@@ -31,13 +31,13 @@ internal fun MediaPickerPopup(
                 PickerPopupItem(
                     text = stringResource(R.string.gravatar_qe_avatar_picker_choose_a_photo),
                     iconRes = R.drawable.gravatar_photo_library,
-                    contentDescription = R.string.gravatar_qe_photo_library_icon_description,
+                    contentDescription = stringResource(R.string.gravatar_qe_photo_library_icon_description),
                     onClick = onChoosePhotoClick,
                 ),
                 PickerPopupItem(
                     text = stringResource(R.string.gravatar_qe_avatar_picker_take_photo),
                     iconRes = R.drawable.gravatar_capture_photo,
-                    contentDescription = R.string.gravatar_qe_capture_photo_icon_description,
+                    contentDescription = stringResource(R.string.gravatar_qe_capture_photo_icon_description),
                     onClick = onTakePhotoClick,
                 ),
             ),

gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/components/PickerPopup.kt

@@ -1,18 +1,24 @@
 package com.gravatar.quickeditor.ui.components
 
 import androidx.annotation.DrawableRes
-import androidx.annotation.StringRes
 import androidx.compose.animation.AnimatedContent
 import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.core.MutableTransitionState
 import androidx.compose.animation.core.Spring
 import androidx.compose.animation.core.spring
 import androidx.compose.animation.scaleIn
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.automirrored.filled.KeyboardArrowRight
 import androidx.compose.material3.HorizontalDivider
+import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.Immutable
@@ -36,6 +42,7 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.window.Popup
 import androidx.compose.ui.window.PopupPositionProvider
 import androidx.compose.ui.window.PopupProperties
+import com.gravatar.quickeditor.R
 
 @Composable
 internal fun PickerPopup(
@@ -96,7 +103,7 @@ private fun PickerPopup(
                             PopupButton(
                                 text = item.text,
                                 iconRes = item.iconRes,
-                                contentDescription = stringResource(item.contentDescription),
+                                contentDescription = item.contentDescription,
                                 shape = popupButtonShape(index, popupMenu.items.size, cornerRadius),
                                 color = item.contentColor,
                                 onClick = {
@@ -106,6 +113,27 @@ private fun PickerPopup(
                                         item.onClick?.let { it() }
                                     }
                                 },
+                                startIcon = if (targetState.items.any { it.subMenu != null }) {
+                                    {
+                                        Box(
+                                            modifier = Modifier
+                                                .padding(end = 2.dp)
+                                                .width(24.dp),
+                                        ) {
+                                            if (item.subMenu != null) {
+                                                Icon(
+                                                    imageVector = Icons.AutoMirrored.Filled.KeyboardArrowRight,
+                                                    contentDescription = stringResource(
+                                                        R.string.gravatar_qe_picker_submenu_icon_description,
+                                                    ),
+                                                    tint = item.contentColor ?: MaterialTheme.colorScheme.onSurface,
+                                                )
+                                            }
+                                        }
+                                    }
+                                } else {
+                                    null
+                                },
                             )
                             if (index < popupMenu.items.size - 1) {
                                 HorizontalDivider()
@@ -138,7 +166,7 @@ internal data class PickerPopupMenu(
 internal data class PickerPopupItem(
     val text: String,
     @DrawableRes val iconRes: Int?,
-    @StringRes val contentDescription: Int,
+    val contentDescription: String,
     val onClick: (() -> Unit)? = null,
     val contentColor: Color? = null,
     val subMenu: PickerPopupMenu? = null,

gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/components/PopupButton.kt

@@ -32,17 +32,26 @@ internal fun PopupButton(
     shape: Shape,
     color: Color? = null,
     modifier: Modifier = Modifier,
+    startIcon: @Composable (() -> Unit)? = null,
 ) {
+    val contentPadding = if (startIcon != null) {
+        PaddingValues(top = 12.dp, bottom = 12.dp, start = 6.dp, end = 16.dp)
+    } else {
+        PaddingValues(vertical = 12.dp, horizontal = 16.dp)
+    }
     TextButton(
         onClick = onClick,
         modifier = modifier,
         shape = shape,
-        contentPadding = PaddingValues(vertical = 12.dp, horizontal = 16.dp),
+        contentPadding = contentPadding,
     ) {
         Row(
             horizontalArrangement = Arrangement.SpaceBetween,
             verticalAlignment = Alignment.CenterVertically,
         ) {
+            if (startIcon != null) {
+                startIcon()
+            }
             Text(
                 text = text,
                 overflow = TextOverflow.Ellipsis,

gravatar-quickeditor/src/main/res/values-ar/strings.xml

@@ -25,7 +25,6 @@ Language: ar
     <string name="gravatar_qe_avatar_rating_g">G (عام)</string>
     <string name="gravatar_qe_alert_banner_close_content_description">إغلاق الإنذار</string>
     <string name="gravatar_qe_alert_banner_no_avatar_selected">لم يتم تحديد صورة. يرجى تحديد صورة أو سيتم استخدام الصورة الافتراضية.</string>
-    <string name="gravatar_qe_selectable_avatar_more_options_rating">تغيير التقييم</string>
     <string name="gravatar_qe_write_external_storage_permission_rationale_message">لحفظ الصورة في مجلد عام، يتعين عليك منح الصلاحية. يمكنك منحها ضمن إعدادات التطبيق.</string>
     <string name="gravatar_qe_download_manager_disabled_title">تم تعطيل DownloadManager. يرجى تمكينها لتنزيل الصور الرمزية.</string>
     <string name="gravatar_qe_download_manager_not_available">DownloadManager غير متوفر</string>

gravatar-quickeditor/src/main/res/values-de/strings.xml

@@ -25,7 +25,6 @@ Language: de
     <string name="gravatar_qe_avatar_rating_g">G (Für alle)</string>
     <string name="gravatar_qe_alert_banner_close_content_description">Hinweis schließen</string>
     <string name="gravatar_qe_alert_banner_no_avatar_selected">Kein Bild ausgewählt. Bitte wähle eines aus, andernfalls wird das Standardbild verwendet.</string>
-    <string name="gravatar_qe_selectable_avatar_more_options_rating">Bewertung ändern</string>
     <string name="gravatar_qe_write_external_storage_permission_rationale_message">Zum Speichern des Bilds in einem öffentlichen Ordner musst du die entsprechende Berechtigung erteilen. Die Berechtigung kannst du in den App-Einstellungen erteilen.</string>
     <string name="gravatar_qe_download_manager_disabled_title">Der Download Manager ist deaktiviert. Aktiviere die Funktion, um Avatare herunterladen zu können.</string>
     <string name="gravatar_qe_download_manager_not_available">Der Download Manager ist nicht verfügbar</string>

gravatar-quickeditor/src/main/res/values-es/strings.xml

@@ -25,7 +25,6 @@ Language: es
     <string name="gravatar_qe_avatar_rating_g">G (General)</string>
     <string name="gravatar_qe_alert_banner_close_content_description">Cerrar alerta</string>
     <string name="gravatar_qe_alert_banner_no_avatar_selected">No se ha seleccionado ninguna imagen. Elige una o se utilizará la imagen por defecto.</string>
-    <string name="gravatar_qe_selectable_avatar_more_options_rating">Cambiar calificación</string>
     <string name="gravatar_qe_write_external_storage_permission_rationale_message">Para guardar la imagen en una carpeta pública, tienes que otorgar el permiso para ello. Puedes hacerlo en los ajustes de la aplicación.</string>
     <string name="gravatar_qe_download_manager_disabled_title">DownloadManager se ha inhabilitado. Habilítalo para descargar avatares.</string>
     <string name="gravatar_qe_download_manager_not_available">DownloadManager no está disponible.</string>

gravatar-quickeditor/src/main/res/values-fr/strings.xml

@@ -25,7 +25,6 @@ Language: fr
     <string name="gravatar_qe_avatar_rating_g">G (tous publics)</string>
     <string name="gravatar_qe_alert_banner_close_content_description">Fermer l’alerte</string>
     <string name="gravatar_qe_alert_banner_no_avatar_selected">Aucune image sélectionnée. Veuillez en sélectionner une, faute de quoi l’image par défaut sera utilisée.</string>
-    <string name="gravatar_qe_selectable_avatar_more_options_rating">Modifier la classification</string>
     <string name="gravatar_qe_write_external_storage_permission_rationale_message">Pour enregistrer l\'image dans un dossier, vous devez en accorder l\'autorisation dans les paramètres de l\'application.</string>
     <string name="gravatar_qe_download_manager_disabled_title">DownloadManager est désactivé. Veuillez l\'activer pour pouvoir télécharger les avatars.</string>
     <string name="gravatar_qe_download_manager_not_available">DownloadManager n\'est pas disponible</string>

gravatar-quickeditor/src/main/res/values-in/strings.xml

@@ -25,7 +25,6 @@ Language: id
     <string name="gravatar_qe_avatar_rating_g">G (Umum)</string>
     <string name="gravatar_qe_alert_banner_close_content_description">Tutup peringatan</string>
     <string name="gravatar_qe_alert_banner_no_avatar_selected">Tidak ada gambar dipilih. Harap pilih satu gambar atau gambar default akan digunakan.</string>
-    <string name="gravatar_qe_selectable_avatar_more_options_rating">Ubah rating</string>
     <string name="gravatar_qe_write_external_storage_permission_rationale_message">Untuk menyimpan gambar di folder publik, Anda perlu memberikan izin. Anda dapat memberikan izin di pengaturan aplikasi.</string>
     <string name="gravatar_qe_download_manager_disabled_title">DownloadManager dinonaktifkan. Aktifkan untuk mengunduh Avatar.</string>
     <string name="gravatar_qe_download_manager_not_available">DownloadManager tidak tersedia</string>

gravatar-quickeditor/src/main/res/values-it/strings.xml

@@ -25,7 +25,6 @@ Language: it
     <string name="gravatar_qe_avatar_rating_g">G (generale)</string>
     <string name="gravatar_qe_alert_banner_close_content_description">Chiudi avviso</string>
     <string name="gravatar_qe_alert_banner_no_avatar_selected">Nessuna immagine selezionata. Seleziona un\'immagine, altrimenti verrà usata quella predefinita.</string>
-    <string name="gravatar_qe_selectable_avatar_more_options_rating">Modifica la valutazione</string>
     <string name="gravatar_qe_write_external_storage_permission_rationale_message">Per salvare l\'immagine in una cartella pubblica devi concedere l\'autorizzazione. Puoi concederla nelle impostazioni dell\'app.</string>
     <string name="gravatar_qe_download_manager_disabled_title">DownloadManager è disabilitato. Abilitalo per scaricare gli avatar.</string>
     <string name="gravatar_qe_download_manager_not_available">DownloadManager non è disponibile</string>

gravatar-quickeditor/src/main/res/values-iw/strings.xml

@@ -25,7 +25,6 @@ Language: he_IL
     <string name="gravatar_qe_avatar_rating_g">G (כללי)</string>
     <string name="gravatar_qe_alert_banner_close_content_description">לסגור התראה</string>
     <string name="gravatar_qe_alert_banner_no_avatar_selected">לא נבחרה תמונה. יש לבחור לפחות תמונה אחת, אחרת נשתמש בברירת המחדל.</string>
-    <string name="gravatar_qe_selectable_avatar_more_options_rating">לשנות דירוג</string>
     <string name="gravatar_qe_write_external_storage_permission_rationale_message">כדי לשמור את התמונה בתיקייה ציבורית, עליך להעניק הרשאה. אפשר להעניק את ההרשאות בהגדרות האפליקציה.</string>
     <string name="gravatar_qe_download_manager_disabled_title">האפשרות DownloadManager מושבתת. יש להפעיל אותה כדי להוריד צלמיות משתמשים.</string>
     <string name="gravatar_qe_download_manager_not_available">האפשרות DownloadManager לא זמינה</string>

gravatar-quickeditor/src/main/res/values-ja/strings.xml

@@ -25,7 +25,6 @@ Language: ja_JP
     <string name="gravatar_qe_avatar_rating_g">G (一般)</string>
     <string name="gravatar_qe_alert_banner_close_content_description">アラートを閉じる</string>
     <string name="gravatar_qe_alert_banner_no_avatar_selected">画像が選択されていません。 いずれかを選択してください。選択しない場合はデフォルトが使用されます。</string>
-    <string name="gravatar_qe_selectable_avatar_more_options_rating">評価を変更</string>
     <string name="gravatar_qe_write_external_storage_permission_rationale_message">パブリックフォルダーに画像を保存するには、パーミッションを付与する必要があります。 アプリの設定でパーミッションを付与できます。</string>
     <string name="gravatar_qe_download_manager_disabled_title">DownloadManager は無効です。 アバターをダウンロードするには、有効にしてください。</string>
     <string name="gravatar_qe_download_manager_not_available">DownloadManager は利用できません。</string>

gravatar-quickeditor/src/main/res/values-ko/strings.xml

@@ -25,7 +25,6 @@ Language: ko_KR
     <string name="gravatar_qe_avatar_rating_g">G(전체)</string>
     <string name="gravatar_qe_alert_banner_close_content_description">알림 닫기</string>
     <string name="gravatar_qe_alert_banner_no_avatar_selected">선택된 이미지가 없습니다. 이미지를 선택하지 않으면 기본 이미지가 사용됩니다.</string>
-    <string name="gravatar_qe_selectable_avatar_more_options_rating">등급 변경</string>
     <string name="gravatar_qe_write_external_storage_permission_rationale_message">이미지를 공개 폴더에 저장하려면 권한을 부여해야 합니다. 권한은 앱 설정에서 부여할 수 있습니다.</string>
     <string name="gravatar_qe_download_manager_disabled_title">DownloadManager가 비활성화되어 있습니다. 아바타를 다운로드하려면 활성화하세요.</string>
     <string name="gravatar_qe_download_manager_not_available">DownloadManager를 사용할 수 없습니다.</string>

gravatar-quickeditor/src/main/res/values-nl/strings.xml

@@ -25,7 +25,6 @@ Language: nl
     <string name="gravatar_qe_avatar_rating_g">G (algemeen)</string>
     <string name="gravatar_qe_alert_banner_close_content_description">Waarschuwing</string>
     <string name="gravatar_qe_alert_banner_no_avatar_selected">Geen afbeelding geselecteerd. Selecteer een afbeelding, anders wordt de standaardafbeelding gebruikt.</string>
-    <string name="gravatar_qe_selectable_avatar_more_options_rating">Beoordeling wijzigen</string>
     <string name="gravatar_qe_write_external_storage_permission_rationale_message">Om een afbeelding in een openbare map op te slaan, moet je toestemming geven. Je kan toestemming geven in de instellingen van de app.</string>
     <string name="gravatar_qe_download_manager_disabled_title">DownloadManager is uitgeschakeld. Schakel deze in om avatars te downloaden.</string>
     <string name="gravatar_qe_download_manager_not_available">DownloadManager is niet beschikbaar</string>