Skip to content

[Dynamic Dashboard] Improvements to the custom range selection logic #11510

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
May 14, 2024
Merged

[Dynamic Dashboard] Improvements to the custom range selection logic #11510

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
28aebab
Make sure custom range is not applied when date picker is dismissed
hichamboushaba May 14, 2024
1a9018a
Align top performers custom range selection with stats card
hichamboushaba May 14, 2024
ec699ee
Rename functions for more clarity
hichamboushaba May 14, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions WooCommerce/src/main/kotlin/com/woocommerce/android/AppPrefs.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -861,11 +861,11 @@ object AppPrefs {

fun getActiveStatsTab() = getString(DeletablePrefKey.ACTIVE_STATS_GRANULARITY)

fun setActiveTopPerformersGranularity(selectionName: String) {
fun setActiveTopPerformersTab(selectionName: String) {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This renaming was done just for consistency, the term granularity doesn't apply to tabs anymore after introducing the custom range.

setString(DeletablePrefKey.ACTIVE_TOP_PERFORMERS_GRANULARITY, selectionName)
}

fun getActiveTopPerformersGranularity() = getString(DeletablePrefKey.ACTIVE_TOP_PERFORMERS_GRANULARITY)
fun getActiveTopPerformersTab() = getString(DeletablePrefKey.ACTIVE_TOP_PERFORMERS_GRANULARITY)

fun setCustomDomainsSource(source: String) {
setString(DeletablePrefKey.CUSTOM_DOMAINS_SOURCE, source)
Expand Down
8 changes: 4 additions & 4 deletions WooCommerce/src/main/kotlin/com/woocommerce/android/AppPrefsWrapper.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -212,12 +212,12 @@ class AppPrefsWrapper @Inject constructor() {
fun getActiveStoreStatsTab() =
AppPrefs.getActiveStatsTab()

fun setActiveTopPerformersGranularity(selectionName: String) {
AppPrefs.setActiveTopPerformersGranularity(selectionName)
fun setActiveTopPerformersTab(selectionName: String) {
AppPrefs.setActiveTopPerformersTab(selectionName)
}

fun getActiveTopPerformersGranularity() =
AppPrefs.getActiveTopPerformersGranularity()
fun getActiveTopPerformersTab() =
AppPrefs.getActiveTopPerformersTab()

fun setCustomDomainsSource(source: DomainFlowSource) {
AppPrefs.setCustomDomainsSource(source.name)
Expand Down
13 changes: 7 additions & 6 deletions ...rce/src/main/kotlin/com/woocommerce/android/ui/dashboard/stats/DashboardStatsViewModel.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -115,12 +115,13 @@ class DashboardStatsViewModel @AssistedInject constructor(

fun onTabSelected(selectionType: SelectionType) {
usageTracksEventEmitter.interacted()
appPrefsWrapper.setActiveStatsTab(selectionType.name)

if (selectionType == SelectionType.CUSTOM) {
if (selectionType != SelectionType.CUSTOM) {
appPrefsWrapper.setActiveStatsTab(selectionType.name)
} else {
if (dateRangeState.value?.customRange == null) {
onAddCustomRangeClicked()
} else {
appPrefsWrapper.setActiveStatsTab(SelectionType.CUSTOM.name)
analyticsTrackerWrapper.track(
AnalyticsEvent.DASHBOARD_STATS_CUSTOM_RANGE_TAB_SELECTED
)
Expand All @@ -136,11 +137,11 @@ class DashboardStatsViewModel @AssistedInject constructor(
)
)

if (dateRangeState.value?.rangeSelection?.selectionType != SelectionType.CUSTOM) {
onTabSelected(SelectionType.CUSTOM)
}
viewModelScope.launch {
customDateRangeDataStore.updateDateRange(range)
if (dateRangeState.value?.rangeSelection?.selectionType != SelectionType.CUSTOM) {
onTabSelected(SelectionType.CUSTOM)
}
}
}

Expand Down
2 changes: 1 addition & 1 deletion ...ain/kotlin/com/woocommerce/android/ui/dashboard/stats/GetSelectedRangeForTopPerformers.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,6 @@ class GetSelectedRangeForTopPerformers @Inject constructor(
) : GetSelectedDateRange(appPrefs, customDateRangeDataStore, dateUtils) {
override fun getSelectedRange(): SelectionType =
runCatching {
SelectionType.valueOf(appPrefs.getActiveTopPerformersGranularity())
SelectionType.valueOf(appPrefs.getActiveTopPerformersTab())
}.getOrDefault(SelectionType.TODAY)
}
46 changes: 32 additions & 14 deletions ...lin/com/woocommerce/android/ui/dashboard/topperformers/DashboardTopPerformersViewModel.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@ import kotlinx.coroutines.coroutineScope
import kotlinx.coroutines.flow.MutableSharedFlow
import kotlinx.coroutines.flow.MutableStateFlow
import kotlinx.coroutines.flow.collectLatest
import kotlinx.coroutines.flow.combine
import kotlinx.coroutines.flow.flatMapLatest
import kotlinx.coroutines.flow.map
import kotlinx.coroutines.flow.merge
Expand Down Expand Up @@ -81,10 +82,14 @@ class DashboardTopPerformersViewModel @AssistedInject constructor(
getSelectedDateRange: GetSelectedRangeForTopPerformers,
) : ScopedViewModel(savedState) {
private val _selectedDateRange = getSelectedDateRange()
val selectedDateRange: LiveData<TopPerformersDateRange> = _selectedDateRange.map {
val selectedDateRange: LiveData<TopPerformersDateRange> = combine(
_selectedDateRange,
customDateRangeDataStore.dateRange
) { selectedRange, customRange ->
TopPerformersDateRange(
rangeSelection = it,
dateFormatted = dateFormatter.formatRangeDate(it)
rangeSelection = selectedRange,
customRange = customRange,
dateFormatted = dateFormatter.formatRangeDate(selectedRange)
)
}.asLiveData()

Expand All @@ -102,8 +107,6 @@ class DashboardTopPerformersViewModel @AssistedInject constructor(
)
}.asLiveData()

private val customRange = customDateRangeDataStore.dateRange.asLiveData()
Copy link
Member Author

@hichamboushaba hichamboushaba May 14, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The LiveData here wasn't observed anywhere, which means it always had the value as null, and it caused a bug where opening the date picker doesn't show the current custom range.


private val refreshTrigger = MutableSharedFlow<RefreshEvent>(extraBufferCapacity = 1)

init {
Expand Down Expand Up @@ -152,21 +155,32 @@ class DashboardTopPerformersViewModel @AssistedInject constructor(
}
}

fun onGranularityChanged(selectionType: SelectionType) {
fun onTabSelected(selectionType: SelectionType) {
usageTracksEventEmitter.interacted()
appPrefsWrapper.setActiveTopPerformersGranularity(selectionType.name)
if (selectionType == SelectionType.CUSTOM) {
analyticsTrackerWrapper.track(
AnalyticsEvent.DASHBOARD_STATS_CUSTOM_RANGE_TAB_SELECTED
)
if (selectionType != SelectionType.CUSTOM) {
appPrefsWrapper.setActiveTopPerformersTab(selectionType.name)
} else {
if (selectedDateRange.value?.customRange == null) {
onEditCustomRangeTapped()
} else {
appPrefsWrapper.setActiveTopPerformersTab(SelectionType.CUSTOM.name)
analyticsTrackerWrapper.track(AnalyticsEvent.DASHBOARD_STATS_CUSTOM_RANGE_TAB_SELECTED)
}
}
}

fun onEditCustomRangeTapped() {
val event = if (selectedDateRange.value?.customRange == null) {
AnalyticsEvent.DASHBOARD_STATS_CUSTOM_RANGE_ADD_BUTTON_TAPPED
} else {
AnalyticsEvent.DASHBOARD_STATS_CUSTOM_RANGE_EDIT_BUTTON_TAPPED
}
analyticsTrackerWrapper.track(event)

triggerEvent(
OpenDatePicker(
fromDate = customRange.value?.start ?: Date(),
toDate = customRange.value?.end ?: Date()
fromDate = selectedDateRange.value?.customRange?.start ?: Date(),
toDate = selectedDateRange.value?.customRange?.end ?: Date()
)
)
}
Expand Down Expand Up @@ -247,11 +261,14 @@ class DashboardTopPerformersViewModel @AssistedInject constructor(
analyticsTrackerWrapper.track(
AnalyticsEvent.DASHBOARD_STATS_CUSTOM_RANGE_CONFIRMED,
mapOf(
AnalyticsTracker.KEY_IS_EDITING to (customRange.value != null),
AnalyticsTracker.KEY_IS_EDITING to (selectedDateRange.value?.customRange != null),
)
)
viewModelScope.launch {
customDateRangeDataStore.updateDateRange(statsTimeRange)
if (selectedDateRange.value?.rangeSelection?.selectionType != SelectionType.CUSTOM) {
onTabSelected(SelectionType.CUSTOM)
}
}
}

Expand All @@ -264,6 +281,7 @@ class DashboardTopPerformersViewModel @AssistedInject constructor(

data class TopPerformersDateRange(
val rangeSelection: StatsTimeRangeSelection,
val customRange: StatsTimeRange?,
val dateFormatted: String
)

Expand Down
23 changes: 12 additions & 11 deletions ...in/com/woocommerce/android/ui/dashboard/topperformers/DashboardTopPerformersWidgetCard.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,11 +90,11 @@ fun DashboardTopPerformersWidgetCard(
)

else -> DashboardTopPerformersContent(
topPerformersState,
selectedDateRange,
lastUpdateState,
topPerformersViewModel::onGranularityChanged,
topPerformersViewModel::onEditCustomRangeTapped
topPerformersState = topPerformersState,
selectedDateRange = selectedDateRange,
lastUpdateState = lastUpdateState,
onTabSelected = topPerformersViewModel::onTabSelected,
onEditCustomRangeTapped = topPerformersViewModel::onEditCustomRangeTapped
)
}
}
Expand All @@ -120,7 +120,7 @@ fun DashboardTopPerformersContent(
topPerformersState: TopPerformersState?,
selectedDateRange: TopPerformersDateRange?,
lastUpdateState: String?,
onGranularityChanged: (SelectionType) -> Unit,
onTabSelected: (SelectionType) -> Unit,
onEditCustomRangeTapped: () -> Unit,
) {
Column {
Expand All @@ -129,7 +129,7 @@ fun DashboardTopPerformersContent(
rangeSelection = it.rangeSelection,
dateFormatted = it.dateFormatted,
onCustomRangeClick = onEditCustomRangeTapped,
onTabSelected = onGranularityChanged
onTabSelected = onTabSelected
)
}
Divider(modifier = Modifier.padding(bottom = 16.dp))
Expand Down Expand Up @@ -377,6 +377,7 @@ private fun TopPerformersWidgetCardPreview() {
calendar = Calendar.getInstance(),
locale = Locale.getDefault(),
),
customRange = null,
dateFormatted = "Today"
)
val topPerformersState = TopPerformersState(
Expand Down Expand Up @@ -420,28 +421,28 @@ private fun TopPerformersWidgetCardPreview() {
topPerformersState = topPerformersState,
lastUpdateState = "Last update: 8:52 AM",
selectedDateRange = selectedDateRange,
onGranularityChanged = {},
onTabSelected = {},
onEditCustomRangeTapped = {}
)
DashboardTopPerformersContent(
topPerformersState = topPerformersState.copy(isLoading = true),
lastUpdateState = "Last update: 8:52 AM",
selectedDateRange = selectedDateRange,
onGranularityChanged = {},
onTabSelected = {},
onEditCustomRangeTapped = {}
)
DashboardTopPerformersContent(
topPerformersState = topPerformersState.copy(isError = true),
lastUpdateState = "Last update: 8:52 AM",
selectedDateRange = selectedDateRange,
onGranularityChanged = {},
onTabSelected = {},
onEditCustomRangeTapped = {}
)
DashboardTopPerformersContent(
topPerformersState = topPerformersState.copy(topPerformers = emptyList()),
lastUpdateState = "Last update: 8:52 AM",
selectedDateRange = selectedDateRange,
onGranularityChanged = {},
onTabSelected = {},
onEditCustomRangeTapped = {}
)
}
Expand Down
Loading