Merge pull request #10739 from woocommerce/issue/10574-fix-budget-slider-responsiveness

Fix budget slider responsiveness

Author: JorgeMucientes

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/blaze/creation/budget/BlazeCampaignBudgetScreen.kt

@@ -201,7 +201,7 @@ private fun EditBudgetSection(
         )
         Slider(
             modifier = Modifier.padding(top = 8.dp, bottom = 8.dp),
-            value = state.sliderValue,
+            value = state.totalBudget,
             valueRange = state.budgetRangeMin..state.budgetRangeMax,
             onValueChange = { onBudgetUpdated(it) },
             onValueChangeFinished = { onBudgetChangeFinished() },
@@ -413,7 +413,6 @@ private fun CampaignBudgetScreenPreview() {
         state = BlazeCampaignBudgetViewModel.BudgetUiState(
             currencyCode = "USD",
             totalBudget = 35f,
-            sliderValue = 35f,
             budgetRangeMin = 5f,
             budgetRangeMax = 35f,
             dailySpending = "$5",

WooCommerce/src/main/kotlin/com/woocommerce/android/ui/blaze/creation/budget/BlazeCampaignBudgetViewModel.kt

@@ -23,6 +23,7 @@ import kotlinx.coroutines.launch
 import kotlinx.parcelize.Parcelize
 import java.util.Date
 import javax.inject.Inject
+import kotlin.math.roundToInt
 import kotlin.time.Duration.Companion.days
 
 @HiltViewModel
@@ -38,7 +39,6 @@ class BlazeCampaignBudgetViewModel @Inject constructor(
         BudgetUiState(
             currencyCode = navArgs.budget.currencyCode,
             totalBudget = navArgs.budget.totalBudget,
-            sliderValue = navArgs.budget.totalBudget,
             budgetRangeMin = navArgs.budget.durationInDays * CAMPAIGN_MINIMUM_DAILY_SPEND,
             budgetRangeMax = navArgs.budget.durationInDays * CAMPAIGN_MAXIMUM_DAILY_SPEND,
             dailySpending = formatDailySpend(
@@ -106,14 +106,11 @@ class BlazeCampaignBudgetViewModel @Inject constructor(
     }
 
     fun onBudgetUpdated(sliderValue: Float) {
-        budgetUiState.update { it.copy(sliderValue = sliderValue) }
-        if (sliderValue.toInt().mod(budgetUiState.value.durationInDays) == 0) {
-            budgetUiState.update {
-                it.copy(
-                    totalBudget = sliderValue,
-                    dailySpending = formatDailySpend(sliderValue / it.durationInDays)
-                )
-            }
+        budgetUiState.update {
+            it.copy(
+                totalBudget = sliderValue,
+                dailySpending = formatDailySpend(sliderValue / it.durationInDays)
+            )
         }
     }
 
@@ -127,7 +124,6 @@ class BlazeCampaignBudgetViewModel @Inject constructor(
                 budgetRangeMax = duration * CAMPAIGN_MAXIMUM_DAILY_SPEND,
                 dailySpending = formatDailySpend(currentDailyExpend),
                 totalBudget = newTotalBudget,
-                sliderValue = newTotalBudget,
                 campaignDurationDates = getCampaignDurationDisplayDate(it.campaignStartDateMillis, duration)
             )
         }
@@ -148,6 +144,12 @@ class BlazeCampaignBudgetViewModel @Inject constructor(
 
     fun onBudgetChangeFinished() {
         fetchAdForecast()
+        val roundedBudgetToDurationMultiple =
+            (budgetUiState.value.totalBudget / budgetUiState.value.durationInDays).roundToInt() *
+                budgetUiState.value.durationInDays
+        budgetUiState.update {
+            it.copy(totalBudget = roundedBudgetToDurationMultiple.toFloat())
+        }
     }
 
     private fun fetchAdForecast() {
@@ -193,7 +195,6 @@ class BlazeCampaignBudgetViewModel @Inject constructor(
     data class BudgetUiState(
         val currencyCode: String,
         val totalBudget: Float,
-        val sliderValue: Float,
         val budgetRangeMin: Float,
         val budgetRangeMax: Float,
         val dailySpending: String,