[fenix] For https://github.com/mozilla-mobile/fenix/issues/8643 and https://github.com/mozilla-mobile/fenix/issues/7606 - illustrations are now connected to their radio buttons

app/src/main/java/org/mozilla/fenix/home/sessioncontrol/viewholders/onboarding/OnboardingThemePickerViewHolder.kt

@@ -35,10 +35,12 @@ class OnboardingThemePickerViewHolder(view: View) : RecyclerView.ViewHolder(view
         }
 
         radioLightTheme.addToRadioGroup(radioDarkTheme)
-        radioDarkTheme.addToRadioGroup(radioLightTheme)
-
         radioLightTheme.addToRadioGroup(radioFollowDeviceTheme)
+        radioLightTheme.addIllustration(view.theme_light_image)
+
+        radioDarkTheme.addToRadioGroup(radioLightTheme)
         radioDarkTheme.addToRadioGroup(radioFollowDeviceTheme)
+        radioDarkTheme.addIllustration(view.theme_dark_image)
 
         radioFollowDeviceTheme.addToRadioGroup(radioDarkTheme)
         radioFollowDeviceTheme.addToRadioGroup(radioLightTheme)
@@ -60,12 +62,10 @@ class OnboardingThemePickerViewHolder(view: View) : RecyclerView.ViewHolder(view
         }
 
         radioLightTheme.onClickListener {
-            setLightIllustrationSelected()
             setNewTheme(AppCompatDelegate.MODE_NIGHT_NO)
         }
 
         radioDarkTheme.onClickListener {
-            setDarkIllustrationSelected()
             view.context.components.analytics.metrics.track(
                 Event.DarkThemeSelected(
                     Event.DarkThemeSelected.Source.ONBOARDING
@@ -75,7 +75,6 @@ class OnboardingThemePickerViewHolder(view: View) : RecyclerView.ViewHolder(view
         }
 
         radioFollowDeviceTheme.onClickListener {
-            setNoIllustrationSelected()
             if (SDK_INT >= Build.VERSION_CODES.P) {
                 setNewTheme(AppCompatDelegate.MODE_NIGHT_FOLLOW_SYSTEM)
             } else {
@@ -84,40 +83,21 @@ class OnboardingThemePickerViewHolder(view: View) : RecyclerView.ViewHolder(view
         }
 
         with(view.context.settings()) {
-            val radio: OnboardingRadioButton
+            val radio: OnboardingRadioButton = when {
-            when {
                 shouldUseLightTheme -> {
-                    radio = radioLightTheme
+                    radioLightTheme
-                    setLightIllustrationSelected()
                 }
                 shouldUseDarkTheme -> {
-                    radio = radioDarkTheme
+                    radioDarkTheme
-                    setDarkIllustrationSelected()
                 }
                 else -> {
-                    radio = radioFollowDeviceTheme
+                    radioFollowDeviceTheme
-                    setNoIllustrationSelected()
                 }
             }
-            radio.isChecked = true
+            radio.updateRadioValue(true)
         }
     }
 
-    private fun setNoIllustrationSelected() {
-        itemView.theme_dark_image.isSelected = false
-        itemView.theme_light_image.isSelected = false
-    }
-
-    private fun setDarkIllustrationSelected() {
-        itemView.theme_dark_image.isSelected = true
-        itemView.theme_light_image.isSelected = false
-    }
-
-    private fun setLightIllustrationSelected() {
-        itemView.theme_dark_image.isSelected = false
-        itemView.theme_light_image.isSelected = true
-    }
-
     private fun setNewTheme(mode: Int) {
         if (AppCompatDelegate.getDefaultNightMode() == mode) return
         AppCompatDelegate.setDefaultNightMode(mode)

app/src/main/java/org/mozilla/fenix/home/sessioncontrol/viewholders/onboarding/OnboardingToolbarPositionPickerViewHolder.kt

@@ -23,19 +23,19 @@ class OnboardingToolbarPositionPickerViewHolder(view: View) : RecyclerView.ViewH
         val radio: OnboardingRadioButton
 
         radioTopToolbar.addToRadioGroup(radioBottomToolbar)
-        radioBottomToolbar.addToRadioGroup(radioTopToolbar)
+        radioTopToolbar.addIllustration(view.toolbar_top_image)
 
-        if (view.context.settings().shouldUseBottomToolbar) {
+        radioBottomToolbar.addToRadioGroup(radioTopToolbar)
-            radio = radioBottomToolbar
+        radioBottomToolbar.addIllustration(view.toolbar_bottom_image)
-            setBottomIllustrationSelected()
+
+        radio = if (view.context.settings().shouldUseBottomToolbar) {
+            radioBottomToolbar
         } else {
-            radio = radioTopToolbar
+            radioTopToolbar
-            setTopIllustrationSelected()
         }
-        radio.isChecked = true
+        radio.updateRadioValue(true)
 
         radioBottomToolbar.onClickListener {
-            setBottomIllustrationSelected()
             itemView.context.asActivity()?.recreate()
         }
 
@@ -44,7 +44,6 @@ class OnboardingToolbarPositionPickerViewHolder(view: View) : RecyclerView.ViewH
         }
 
         radioTopToolbar.onClickListener {
-            setTopIllustrationSelected()
             itemView.context.asActivity()?.recreate()
         }
 
@@ -53,16 +52,6 @@ class OnboardingToolbarPositionPickerViewHolder(view: View) : RecyclerView.ViewH
         }
     }
 
-    private fun setTopIllustrationSelected() {
-        itemView.toolbar_top_image.isSelected = true
-        itemView.toolbar_bottom_image.isSelected = false
-    }
-
-    private fun setBottomIllustrationSelected() {
-        itemView.toolbar_top_image.isSelected = false
-        itemView.toolbar_bottom_image.isSelected = true
-    }
-
     companion object {
         const val LAYOUT_ID = R.layout.onboarding_toolbar_position_picker
     }

app/src/main/java/org/mozilla/fenix/onboarding/OnboardingRadioButton.kt

@@ -6,6 +6,7 @@ package org.mozilla.fenix.onboarding
 
 import android.content.Context
 import android.util.AttributeSet
+import android.widget.ImageButton
 import androidx.appcompat.widget.AppCompatRadioButton
 import androidx.core.content.edit
 import androidx.core.content.withStyledAttributes
@@ -14,6 +15,7 @@ import org.mozilla.fenix.ext.settings
 
 class OnboardingRadioButton(context: Context, attrs: AttributeSet) : AppCompatRadioButton(context, attrs) {
     private val radioGroups = mutableListOf<OnboardingRadioButton>()
+    private var illustration: ImageButton? = null
     private var clickListener: (() -> Unit)? = null
     var key: Int = 0
 
@@ -31,6 +33,10 @@ class OnboardingRadioButton(context: Context, attrs: AttributeSet) : AppCompatRa
         radioGroups.add(radioButton)
     }
 
+    fun addIllustration(illustration: ImageButton) {
+        this.illustration = illustration
+    }
+
     fun onClickListener(listener: () -> Unit) {
         clickListener = listener
     }
@@ -43,8 +49,11 @@ class OnboardingRadioButton(context: Context, attrs: AttributeSet) : AppCompatRa
         }
     }
 
-    private fun updateRadioValue(isChecked: Boolean) {
+    fun updateRadioValue(isChecked: Boolean) {
         this.isChecked = isChecked
+        illustration?.let {
+            it.isSelected = isChecked
+        }
         context.settings().preferences.edit {
             putBoolean(context.getString(key), isChecked)
         }